/* static/unstuck_ops/css/header_compact.css */ /* Compact header variant for small screens and kiosks. Activate by adding 'header-compact' to . For extra-minimal kiosk layouts, also add 'kiosk-mode'. */ /* {% extends "_base.html" %} {% block body_class %}header-compact{% endblock %} {% block content %} {% endblock %} or, {% extends "_base.html" %} {% block body_class %}header-compact kiosk-mode{% endblock %} {% block content %} {% endblock %} */ :root{ /* Tune these if you want the compact header even tighter/looser */ --compact-navbar-min-h: 44px; /* target min height */ --compact-brand-img: 22px; /* brand mark size */ --compact-top-offset: 46px; /* contextual subnav top offset */ } /* Core compaction */ .header-compact .navbar{ min-height: var(--compact-navbar-min-h); padding-top: .25rem; padding-bottom: .25rem; } .header-compact .navbar .navbar-brand{ gap: .375rem; font-size: .95rem; } .header-compact .navbar .navbar-brand img{ width: var(--compact-brand-img); height: var(--compact-brand-img); } .header-compact .navbar .btn, .header-compact .navbar .nav-link{ padding-top: .25rem; padding-bottom: .25rem; } /* Tighten dropdown spacing just a hair */ .header-compact .navbar .dropdown-menu{ padding: .25rem 0; } /* Smaller top offset for sticky context subnav since header is shorter */ .header-compact .context-subnav-wrapper{ top: var(--compact-top-offset); } /* Optional: on compact pages, always hide the desktop search block to save space */ .header-compact .navbar form[role="search"].d-none.d-md-flex{ display: none !important; } /* ------- Kiosk mode: extreme minimal chrome -------- */ /* Add 'kiosk-mode' to body alongside 'header-compact' for dedicated kiosks */ .kiosk-mode .mobile-tabbar{ display: none !important; /* remove bottom chrome to prevent stray taps */ } /* Hide non-essential controls (account dropdown, alerts, admin) */ .kiosk-mode .navbar .dropdown, .kiosk-mode .navbar a[href="/alerts/"], .kiosk-mode .navbar a[href="/admin/"], .kiosk-mode .navbar .btn-outline-light{ display: none !important; } /* Keep the offcanvas menu available for navigation, but smaller toggler */ .kiosk-mode .navbar .navbar-toggler{ padding: .125rem .25rem; } /* Make tap targets still large enough for accessibility */ .kiosk-mode .navbar .nav-link, .kiosk-mode .navbar .btn{ padding-top: .5rem; padding-bottom: .5rem; } /* If you want to completely disable offcanvas in kiosk, uncomment: .kiosk-mode .navbar .navbar-toggler { display: none !important; } .kiosk-mode .offcanvas { display: none !important; } */