MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update layouts in nav tree to new full width style

This commit is contained in:
Andrew Kingston 2022-03-21 15:40:07 +00:00
parent 0ffd080b0f
commit 014d318437
2 changed files with 25 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/LayoutDropdownMenu.svelte
View File

@ -65,3 +65,10 @@
<Input thin type="text" label="Name" bind:value={name} />
</ModalContent>
</Modal>
<style>
.icon {
display: grid;
place-items: center;
}
</style>

16
packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte
View File

@ -148,15 +148,21 @@
</BBUILayout>
<div class="nav-items-container" bind:this={scrollRef}>
<ComponentNavigationTree />
<div class="overlay" />
</div>
</div>
</Tab>
<Tab title="Layouts">
<div class="tab-content-padding">
<div
class="nav-items-container nav-items-container--layouts"
bind:this={scrollRef}
>
<div class="layouts-container">
{#each $store.layouts as layout, idx (layout._id)}
<Layout {layout} border={idx > 0} />
{/each}
</div>
</div>
<Modal bind:this={newLayoutModal}>
<NewLayoutModal />
</Modal>
@ -212,4 +218,12 @@
height: 0;
position: relative;
}
.nav-items-container--layouts {
border-top: none;
margin-top: calc(-1 * var(--spectrum-global-dimension-static-size-150));
}
.layouts-container {
min-width: max-content;
}
</style>