mirror of https://github.com/Budibase/budibase.git
Michael Shanks
7 years ago
22 changed files with 16215 additions and 13545 deletions
@ -0,0 +1,24 @@ |
|||
|
|||
export const USER_STATE_PATH = "_bbuser"; |
|||
|
|||
export const authenticate = (api) => async ({username, password}) => { |
|||
|
|||
if(!username) { |
|||
api.error("Authenticate: username not set"); |
|||
return; |
|||
} |
|||
|
|||
if(!password) { |
|||
api.error("Authenticate: password not set"); |
|||
return; |
|||
} |
|||
|
|||
const user = await post({ |
|||
url:`${rootPath}/api/authenticate`, |
|||
body : {username, password} |
|||
}); |
|||
|
|||
// set user even if error - so it is defined at least
|
|||
api.setState(USER_STATE_PATH, user); |
|||
localStorage.setItem("budibase:user", user); |
|||
} |
|||
@ -1,8 +1,9 @@ |
|||
#current_component.svelte-1xqz9vm{height:100%;width:100%} |
|||
.root.svelte-1oto99m{height:100%;display:grid;grid-template-columns:[left] 1fr [middle] auto [right] 1fr;grid-template-rows:[top] 1fr [center] auto [bottom] 1fr}.content.svelte-1oto99m{grid-column-start:middle;grid-row-start:center;width:400px}.logo-container.svelte-1oto99m{margin-bottom:20px |
|||
}.logo-container.svelte-1oto99m>img.svelte-1oto99m{max-width:100%}.login-button-container.svelte-1oto99m{text-align:right;margin-top:20px}.incorrect-details-panel.svelte-1oto99m{margin-top:30px;padding:10px;border-style:solid;border-width:1px;border-color:maroon;border-radius:1px;text-align:center;color:maroon;background-color:mistyrose}.form-root.svelte-1oto99m{display:grid;grid-template-columns:[label] auto [control] 1fr}.label.svelte-1oto99m{grid-column-start:label;padding:5px 10px;vertical-align:middle}.control.svelte-1oto99m{grid-column-start:control;padding:5px 10px} |
|||
.root.svelte-10kw8to{display:grid} |
|||
.default.svelte-1ec4wqj{width:100%;font-family:inherit;font-size:inherit;padding:0.4em;margin:0 0 0.5em 0;box-sizing:border-box;border:1px solid #ccc;border-radius:2px;width:100%}.default.svelte-1ec4wqj:disabled{color:#ccc} |
|||
.root.svelte-10kw8to{display:grid} |
|||
.root.svelte-aihwli{height:100%;width:100%;grid-template-columns:[navbar] auto [content] 1fr;display:grid}.navbar.svelte-aihwli{grid-column:navbar;background:var(--navBarBackground);border:var(--navBarBorder);color:var(--navBarColor)}.navitem.svelte-aihwli{padding:10px 17px;cursor:pointer}.navitem.svelte-aihwli:hover{background:var(--itemHoverBackground);color:var(--itemHoverColor)}.navitem.selected.svelte-aihwli{background:var(--selectedItemBackground);border:var(--selectedItemBorder);color:var(--selectedItemColor)}.content.svelte-aihwli{grid-column:content} |
|||
.form-root.svelte-m9d6ue{display:grid;grid-template-columns:[label] auto [control] 1fr}.label.svelte-m9d6ue{grid-column-start:label;padding:5px 10px;vertical-align:middle}.control.svelte-m9d6ue{grid-column-start:control;padding:5px 10px}.overflow.svelte-m9d6ue{grid-column-start:overflow}.full-width.svelte-m9d6ue{width:100%} |
|||
.default.svelte-1q8lga0{font-family:inherit;font-size:inherit;padding:0.4em;margin:0 0 0.5em 0;box-sizing:border-box;border:1px solid #ccc;border-radius:2px;color:#333;background-color:#f4f4f4;outline:none}.default.svelte-1q8lga0:active{background-color:#ddd}.default.svelte-1q8lga0:focus{border-color:#666} |
|||
|
|||
|
|||
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
@ -0,0 +1,86 @@ |
|||
<script> |
|||
import cssVars from "./cssVars"; |
|||
|
|||
export let navBarBackground = ""; |
|||
export let navBarBorder=""; |
|||
export let navBarColor=""; |
|||
export let selectedItemBackground=""; |
|||
export let selectedItemColor=""; |
|||
export let selectedItemBorder=""; |
|||
export let itemHoverBackground=""; |
|||
export let itemHoverColor=""; |
|||
export let items = [] |
|||
|
|||
export let _app; |
|||
|
|||
let selectedIndex; |
|||
let contentElement; |
|||
|
|||
$: styleVars = { |
|||
navBarBackground, navBarBorder, |
|||
navBarColor, selectedItemBackground, |
|||
selectedItemColor, selectedItemBorder, |
|||
itemHoverBackground, itemHoverColor |
|||
} |
|||
|
|||
const onSelectItem = (index) => () => { |
|||
selectedIndex = index; |
|||
_app.initialiseComponent(items[index].component, contentElement); |
|||
} |
|||
|
|||
|
|||
</script> |
|||
|
|||
<div class="root" use:cssVars={styleVars}> |
|||
<div class="navbar"> |
|||
{#each items as navItem, index} |
|||
<div class="navitem" |
|||
on:click={onSelectItem(index)} |
|||
class:selected={selectedIndex === index}> |
|||
{navItem.title} |
|||
</div> |
|||
{/each} |
|||
</div> |
|||
<div class="content" |
|||
bind:this={contentElement}> |
|||
</div> |
|||
</div> |
|||
|
|||
<style> |
|||
|
|||
.root { |
|||
height: 100%; |
|||
width:100%; |
|||
grid-template-columns: [navbar] auto [content] 1fr; |
|||
display: grid; |
|||
} |
|||
|
|||
.navbar { |
|||
grid-column: navbar; |
|||
background: var(--navBarBackground); |
|||
border: var(--navBarBorder); |
|||
color: var(--navBarColor); |
|||
} |
|||
|
|||
.navitem { |
|||
padding: 10px 17px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.navitem:hover { |
|||
background: var(--itemHoverBackground); |
|||
color: var(--itemHoverColor); |
|||
} |
|||
|
|||
.navitem.selected { |
|||
background: var(--selectedItemBackground); |
|||
border: var(--selectedItemBorder); |
|||
color: var(--selectedItemColor); |
|||
} |
|||
|
|||
.content { |
|||
grid-column: content; |
|||
} |
|||
|
|||
</style> |
|||
|
|||
@ -0,0 +1,40 @@ |
|||
<script> |
|||
import {buildStyle} from "./buildStyle"; |
|||
|
|||
export let component=""; |
|||
export let text=""; |
|||
export let containerClass=""; |
|||
export let background=""; |
|||
export let border=""; |
|||
export let borderRadius=""; |
|||
export let font=""; |
|||
export let display=""; |
|||
export let textAlign=""; |
|||
export let color=""; |
|||
export let padding=""; |
|||
|
|||
export let _app; |
|||
|
|||
let style=""; |
|||
let componentElement; |
|||
|
|||
$: { |
|||
style=buildStyle({ |
|||
border, background, font, |
|||
padding, display, color, |
|||
"text-align": textAlign, |
|||
"border-radius":borderRadius |
|||
}); |
|||
|
|||
if(_app && component) { |
|||
_app.initialiseComponent(component, componentElement); |
|||
} |
|||
} |
|||
|
|||
</script> |
|||
|
|||
<div class={containerClass} |
|||
style={style} |
|||
this:bind={componentElement}> |
|||
{text} |
|||
</div> |
|||
@ -0,0 +1,21 @@ |
|||
// https://github.com/kaisermann/svelte-css-vars
|
|||
|
|||
export default (node, props) => { |
|||
Object.entries(props).forEach(([key, value]) => { |
|||
node.style.setProperty(`--${key}`, value); |
|||
}); |
|||
|
|||
return { |
|||
update(new_props) { |
|||
Object.entries(new_props).forEach(([key, value]) => { |
|||
node.style.setProperty(`--${key}`, value); |
|||
delete props[key]; |
|||
}); |
|||
|
|||
Object.keys(props).forEach(name => |
|||
node.style.removeProperty(`--${name}`), |
|||
); |
|||
props = new_props; |
|||
}, |
|||
}; |
|||
}; |
|||
Loading…
Reference in new issue