2019-07-13 21:35:57 +12:00
|
|
|
<script>
|
|
|
|
|
|
|
|
import Nav from "./nav/Nav.svelte";
|
|
|
|
import Database from "./database/DatabaseRoot.svelte" ;
|
|
|
|
import UserInterface from "./userInterface/UserInterfaceRoot.svelte" ;
|
|
|
|
import ActionsAndTriggers from "./actionsAndTriggers/ActionsAndTriggersRoot.svelte" ;
|
|
|
|
import AccessLevels from "./accessLevels/AccessLevelsRoot.svelte" ;
|
|
|
|
import ComingSoon from "./common/ComingSoon.svelte";
|
|
|
|
|
2019-07-31 19:09:04 +12:00
|
|
|
import {store} from "./builderStore";
|
2019-07-13 21:35:57 +12:00
|
|
|
|
|
|
|
export let navWidth = "50px";
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<div class="root">
|
|
|
|
<Nav width={navWidth} />
|
|
|
|
<div class="content"
|
|
|
|
style="width: calc(100% - {navWidth}); left: {navWidth}">
|
2019-07-31 19:09:04 +12:00
|
|
|
{#if $store.activeNav === "database"}
|
2019-07-13 21:35:57 +12:00
|
|
|
<Database />
|
2019-07-31 19:09:04 +12:00
|
|
|
{:else if $store.activeNav === "actions"}
|
2019-07-13 21:35:57 +12:00
|
|
|
<ActionsAndTriggers />
|
2019-07-31 19:09:04 +12:00
|
|
|
{:else if $store.activeNav === "access levels"}
|
2019-07-13 21:35:57 +12:00
|
|
|
<AccessLevels />
|
2019-07-31 19:09:04 +12:00
|
|
|
{:else if $store.activeNav === "user interface"}
|
2019-07-13 21:35:57 +12:00
|
|
|
<UserInterface />
|
|
|
|
{/if}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
.root {
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.content {
|
|
|
|
position: fixed;
|
|
|
|
height: 100%;
|
|
|
|
background-color: var(--white);
|
|
|
|
margin:0;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
</style>
|