Add some borders. Fix style override when switching pages
This commit is contained in:
@@ -15,56 +15,52 @@ onMount(() => {
|
||||
})
|
||||
</script>
|
||||
|
||||
{#if $global_navigator.path.length > 1}
|
||||
<MenuEntry id="tree_parents" collapsed={menu_collapsed}>
|
||||
{#snippet title()}
|
||||
<div class="title">Parent directories</div>
|
||||
<button title="Navigate up" onclick={() => global_navigator.navigate_up()}>
|
||||
<i class="icon">north</i>
|
||||
</button>
|
||||
{/snippet}
|
||||
|
||||
{#snippet body()}
|
||||
{#each $global_navigator.path.slice(0, $global_navigator.path.length-1) as node (node.id)}
|
||||
{#if node.type === "dir"}
|
||||
<div class="row">
|
||||
<a class="button" href="/d{fs_encode_path(node.path)}" title="{node.name}">
|
||||
<img class="thumbnail" src="{fs_node_icon(node, 32, 32)}" alt="{node.name}"/>
|
||||
<span class:hide={menu_collapsed}>{node.name}</span>
|
||||
</a>
|
||||
</div>
|
||||
{/if}
|
||||
{/each}
|
||||
{/snippet}
|
||||
</MenuEntry>
|
||||
{/if}
|
||||
|
||||
{#if siblings.length !== 0}
|
||||
<MenuEntry id="tree_siblings" collapsed={menu_collapsed}>
|
||||
{#snippet title()}
|
||||
<div class="title">Siblings</div>
|
||||
<button title="Open previous sibling" onclick={() => global_navigator.open_sibling(-1)}>
|
||||
<i class="icon">west</i>
|
||||
<MenuEntry id="tree_parents" collapsed={menu_collapsed}>
|
||||
{#snippet title()}
|
||||
<div class="title">Parent directories</div>
|
||||
<button title="Navigate up" onclick={() => global_navigator.navigate_up()}>
|
||||
<i class="icon">north</i>
|
||||
</button>
|
||||
<button title="Open next sibling" onclick={() => global_navigator.open_sibling(1)}>
|
||||
<i class="icon">east</i>
|
||||
</button>
|
||||
{/snippet}
|
||||
{/snippet}
|
||||
|
||||
{#snippet body()}
|
||||
{#each siblings as node (node.id)}
|
||||
{#if !node.is_hidden()}
|
||||
<div class="row">
|
||||
<a class="button" href="/d{fs_encode_path(node.path)}" title="{node.name}" use:highlight_current_page>
|
||||
<img class="thumbnail" src="{fs_node_icon(node, 32, 32)}" alt="{node.name}"/>
|
||||
<span class:hide={menu_collapsed}>{node.name}</span>
|
||||
</a>
|
||||
</div>
|
||||
{/if}
|
||||
{/each}
|
||||
{/snippet}
|
||||
</MenuEntry>
|
||||
{/if}
|
||||
{#snippet body()}
|
||||
{#each $global_navigator.path.slice(0, $global_navigator.path.length-1) as node (node.id)}
|
||||
{#if node.type === "dir"}
|
||||
<div class="row">
|
||||
<a class="button" href="/d{fs_encode_path(node.path)}" title="{node.name}">
|
||||
<img class="thumbnail" src="{fs_node_icon(node, 32, 32)}" alt="{node.name}"/>
|
||||
<span class:hide={menu_collapsed}>{node.name}</span>
|
||||
</a>
|
||||
</div>
|
||||
{/if}
|
||||
{/each}
|
||||
{/snippet}
|
||||
</MenuEntry>
|
||||
|
||||
<MenuEntry id="tree_siblings" collapsed={menu_collapsed}>
|
||||
{#snippet title()}
|
||||
<div class="title">Siblings</div>
|
||||
<button title="Open previous sibling" onclick={() => global_navigator.open_sibling(-1)}>
|
||||
<i class="icon">west</i>
|
||||
</button>
|
||||
<button title="Open next sibling" onclick={() => global_navigator.open_sibling(1)}>
|
||||
<i class="icon">east</i>
|
||||
</button>
|
||||
{/snippet}
|
||||
|
||||
{#snippet body()}
|
||||
{#each siblings as node (node.id)}
|
||||
{#if !node.is_hidden()}
|
||||
<div class="row">
|
||||
<a class="button" href="/d{fs_encode_path(node.path)}" title="{node.name}" use:highlight_current_page>
|
||||
<img class="thumbnail" src="{fs_node_icon(node, 32, 32)}" alt="{node.name}"/>
|
||||
<span class:hide={menu_collapsed}>{node.name}</span>
|
||||
</a>
|
||||
</div>
|
||||
{/if}
|
||||
{/each}
|
||||
{/snippet}
|
||||
</MenuEntry>
|
||||
|
||||
<style>
|
||||
.title {
|
||||
|
||||
Reference in New Issue
Block a user