feat(sidebar): library + general settings dialogs, sidebar footer, alignment polish
- Add a Settings cog to the Folders header that opens a tabbed library admin dialog (Library / Index / Import / Logs) wrapping PhotoPrism's /api/v1 settings, index, import and errors endpoints. - Add a sticky footer to the left sidebar with the signed-in user's display name plus quick-toggle theme, general-settings cog (separate dialog for app prefs), and sign-out. Pull these out of the top Toolbar trailing slot. - Align depth-0 folder rows with the rest of the sidebar entries (drop the leading chevron column when no children) and bring heap rows in line with folder rows so the kebab is part of the row's hover background instead of a detached chip. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -110,15 +110,15 @@
|
||||
<!--
|
||||
Indent via padding-left rather than nested margin+border, so the
|
||||
active row's background bleeds edge-to-edge of the sidebar (matches
|
||||
mule-image's compact tree). Depth × 12px keeps lines aligned with
|
||||
the chevron of the previous level.
|
||||
mule-image's compact tree). 8px baseline aligns the depth-0 chevron
|
||||
with the px-2 of Views/Heaps rows; +12px per nested level.
|
||||
-->
|
||||
<div
|
||||
class="group flex h-[24px] items-center rounded text-[12px] leading-tight hover:bg-accent"
|
||||
class:bg-primary={active}
|
||||
class:text-primary-foreground={active}
|
||||
class:hover:bg-primary={active}
|
||||
style="padding-left: {depth * 12}px;"
|
||||
style="padding-left: {8 + depth * 12}px;"
|
||||
>
|
||||
{#if hasChildren}
|
||||
<button
|
||||
@@ -130,11 +130,15 @@
|
||||
>
|
||||
{open ? '▾' : '▸'}
|
||||
</button>
|
||||
{:else}
|
||||
{:else if depth > 0}
|
||||
<!-- Spacer keeps childless siblings aligned with their chevroned
|
||||
peers at nested depths. Skipped at depth 0 so root folders
|
||||
left-align with the Views/Heaps rows. -->
|
||||
<span class="inline-block h-[18px] w-4" aria-hidden="true"></span>
|
||||
{/if}
|
||||
<button
|
||||
class="flex flex-1 items-center truncate px-1 text-left"
|
||||
class="flex flex-1 items-center truncate text-left"
|
||||
class:px-1={hasChildren || depth > 0}
|
||||
onclick={() => onPick(node.path)}
|
||||
ondblclick={readonly ? undefined : () => onRename?.(node.path)}
|
||||
title={node.path}
|
||||
|
||||
Reference in New Issue
Block a user