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. */
/* Developer-mode strip — sits flush under the fixed topbar when CFG_DEV_MODE
is on. 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 by the strip's height; dismissal is local and remembered in
/* Developer-mode strip — sits flush at the very top of the viewport above
the topbar when CFG_DEV_MODE is on. Above-chrome is the standard env-
banner placement (Stripe test-mode, GitHub staff-mode); pushing the
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. */
.dev-banner {
position: fixed;
top: 60px;
top: 0;
left: 0;
right: 0;
z-index: 999;
z-index: 1001;
height: 36px;
display: flex;
align-items: center;
@ -63,6 +67,13 @@
}
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) {
.dev-banner { padding: 0 48px 0 12px; font-size: 0.8rem; }