Browse Source

Update layouts in nav tree to new full width style

master
Andrew Kingston 5 years ago
parent
commit
82898d6b68
  1. 7
      packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/LayoutDropdownMenu.svelte
  2. 22
      packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte

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

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

22
packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte

@ -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">
{#each $store.layouts as layout, idx (layout._id)}
<Layout {layout} border={idx > 0} />
{/each}
<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>

Loading…
Cancel
Save