Quellcode durchsuchen

Keep admin sidebar fixed to the window height

The sidebar stretched with the document, so on long pages the logout
button sat at the bottom of the content and was only reachable after
scrolling. Make it a sticky, viewport-tall column that scrolls
internally if it ever gets taller than the window.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
sebastian vor 3 Wochen
Ursprung
Commit
9f70eb8799
1 geänderte Dateien mit 1 neuen und 1 gelöschten Zeilen
  1. 1 1
      admin/layout.php

+ 1 - 1
admin/layout.php

@@ -26,7 +26,7 @@ function admin_head(string $title, string $active = ''): void {
 *,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
 body{background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;font-size:14px;display:flex;min-height:100vh;}
 /* sidebar */
-.sidebar{width:200px;flex-shrink:0;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:1.5rem 0;}
+.sidebar{width:200px;flex-shrink:0;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:1.5rem 0;position:sticky;top:0;align-self:flex-start;height:100vh;height:100dvh;overflow-y:auto;}
 .sidebar-logo{font-family:'Bebas Neue',sans-serif;font-size:1.8rem;color:var(--accent);letter-spacing:.05em;padding:0 1.25rem .5rem;}
 .sidebar-sub{font-size:.7rem;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;padding:0 1.25rem 1.5rem;}
 .nav-link{display:block;padding:.55rem 1.25rem;color:var(--muted);text-decoration:none;font-size:.85rem;font-weight:500;border-left:3px solid transparent;transition:color .15s,border-color .15s,background .15s;}