CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-07-07 15:25:52 +12:00
Code Issues Projects Releases Wiki Activity

Adjust design section page layouts to stop remounting left nav on screen change

Browse source
This commit is contained in:
Andrew Kingston 2023-08-22 17:51:47 +01:00
parent a4a639c2ba
commit d0414812cf
3 changed files with 8 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/builder/src/pages/builder/app/[application]/design/[screenId]/_layout.svelte
View file

@ -4,6 +4,7 @@
import { syncURLToState } from "helpers/urlStateSync"
import { store } from "builderStore"
import { onDestroy } from "svelte"
import LeftPanel from "./components/[componentId]/_components/LeftPanel/index.svelte"
$: screenId = $store.selectedScreenId
$: store.actions.websocket.selectResource(screenId)
@ -23,6 +24,7 @@
<div class="design">
<div class="content">
<LeftPanel />
<AppPanel />
<slot />
</div>

9
packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/LeftPanel/index.svelte
View file

@ -1,25 +1,28 @@
<script>
import Screens from "./Screens/index.svelte"
import Components from "./Components/index.svelte"
import { selectedScreen } from "builderStore"
</script>
<div class="panel">
<Screens />
<div class="divider" />
<Components />
{#if $selectedScreen}
<Components />
{/if}
</div>
<style>
.panel {
width: 310px;
height: 100%;
border-right: 2px solid var(--grey-2);
border-right: var(--border-light);
display: flex;
flex-direction: column;
background: var(--background);
}
.divider {
border-bottom: 2px solid var(--grey-2);
border-bottom: var(--border-light);
}
</style>

10
packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_layout.svelte
View file

@ -1,5 +1,4 @@
<script>
import LeftPanel from "./_components/LeftPanel/index.svelte"
import { syncURLToState } from "helpers/urlStateSync"
import { store, selectedScreen } from "builderStore"
import * as routify from "@roxi/routify"
@ -47,9 +46,6 @@
onDestroy(stopSyncing)
</script>
<div class="left">
<LeftPanel />
</div>
{#if routeComponentId === "screen"}
<ScreenSettingsPanel />
{:else if routeComponentId === "navigation"}
@ -58,9 +54,3 @@
<ComponentSettingsPanel />
{/if}
<slot />
<style>
.left {
order: -1;
}
</style>