1
0
Fork 0
mirror of synced 2024-06-02 02:25:17 +12:00

Reduce unecessary div layers

This commit is contained in:
Andrew Kingston 2020-10-23 12:57:35 +01:00
parent 2c7910ee51
commit 51c11cb537
3 changed files with 31 additions and 35 deletions

View file

@ -33,49 +33,40 @@
}
</script>
<div class="items-root">
{#if $backendUiStore.selectedDatabase && $backendUiStore.selectedDatabase._id}
<div class="title">
<h1>Tables</h1>
<i on:click={modal.show} class="ri-add-circle-fill" />
</div>
<div class="hierarchy-items-container">
{#each $backendUiStore.tables as table}
{#if $backendUiStore.selectedDatabase && $backendUiStore.selectedDatabase._id}
<div class="title">
<h1>Tables</h1>
<i on:click={modal.show} class="ri-add-circle-fill" />
</div>
<div class="hierarchy-items-container">
{#each $backendUiStore.tables as table, idx}
<NavItem
border={idx > 0}
icon="ri-table-line"
text={table.name}
selected={selectedView === `all_${table._id}`}
on:click={() => selectTable(table)}>
<EditTablePopover {table} />
</NavItem>
{#each Object.keys(table.views || {}) as viewName}
<NavItem
icon="ri-table-line"
text={table.name}
selected={selectedView === `all_${table._id}`}
on:click={() => selectTable(table)}>
<EditTablePopover {table} />
indentLevel={1}
icon="ri-eye-line"
text={viewName}
selected={selectedView === viewName}
on:click={() => onClickView(table, viewName)}>
<EditViewPopover
view={{ name: viewName, ...table.views[viewName] }} />
</NavItem>
{#each Object.keys(table.views || {}) as viewName}
<NavItem
indentLevel={1}
icon="ri-eye-line"
text={viewName}
selected={selectedView === viewName}
on:click={() => onClickView(table, viewName)}>
<EditViewPopover
view={{ name: viewName, ...table.views[viewName] }} />
</NavItem>
{/each}
{/each}
</div>
{/if}
</div>
{/each}
</div>
{/if}
<Modal bind:this={modal}>
<CreateTableModal />
</Modal>
<style>
.items-root {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
gap: var(--spacing-l);
}
.title {
display: flex;
flex-direction: row;

View file

@ -30,5 +30,10 @@
overflow-y: auto;
background: var(--white);
padding: var(--spacing-l) var(--spacing-xl);
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
gap: var(--spacing-l);
}
</style>