Webstar/LibrePortal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge claude/1

Browse Source
This commit is contained in:
librelad 2026-05-27 20:23:30 +01:00
commit f7d7e21335
1 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
containers/libreportal/frontend/css/topbar.css
View File

@ -2,17 +2,21 @@
/* Topbar layout, nav pills, donate/logout buttons. Extracted from style.css. Theme via var(--*) tokens. */ /* Topbar layout, nav pills, donate/logout buttons. Extracted from style.css. Theme via var(--*) tokens. */
/* Developer-mode strip — sits flush under the fixed topbar when CFG_DEV_MODE /* Developer-mode strip — sits flush at the very top of the viewport above
is on. Neutral glass so it reads as "system bar" not "warning"; only the the topbar when CFG_DEV_MODE is on. Above-chrome is the standard env-
icon picks up the theme accent. Body gets .has-dev-banner to bump banner placement (Stripe test-mode, GitHub staff-mode); pushing the
padding-top by the strip's height; dismissal is local and remembered in topbar down 36px is a deliberate signal that the environment is non-
standard. Neutral glass so it reads as "system bar" not "warning"; only
the icon picks up the theme accent. Body gets .has-dev-banner to bump
padding-top + shift every other fixed-positioned chrome element down
by the strip's height. Dismissal is local and remembered in
localStorage until dev mode is toggled off + on again. */ localStorage until dev mode is toggled off + on again. */
.dev-banner { .dev-banner {
position: fixed; position: fixed;
top: 60px; top: 0;
left: 0; left: 0;
right: 0; right: 0;
z-index: 999; z-index: 1001;
height: 36px; height: 36px;
display: flex; display: flex;
align-items: center; align-items: center;
@ -63,6 +67,13 @@
} }
body.has-dev-banner { padding-top: 96px; } body.has-dev-banner { padding-top: 96px; }
/* Shift every other fixed-positioned chrome element down by the banner
height when it's on. Topbar slides from top:0 → 36 (under the banner);
anything that was at top:60 (the topbar's bottom edge — sidebar, apps
layout, mobile-drawer) slides to 96 to clear the now-pushed-down topbar. */
body.has-dev-banner .topbar { top: 36px; }
body.has-dev-banner .sidebar { top: 96px; }
body.has-dev-banner .apps-layout { top: 96px; }
@media (max-width: 768px) { @media (max-width: 768px) {
.dev-banner { padding: 0 48px 0 12px; font-size: 0.8rem; } .dev-banner { padding: 0 48px 0 12px; font-size: 0.8rem; }