Enhance OTS Signage Theme with Icon Dashboard and UI Improvements

- Updated theme.js to refine dropdown initialization, excluding user menu handling.
- Modified authed.twig to allow CSS variable theming for background and text colors, and adjusted content wrapper classes based on navigation state.
- Adjusted override-styles.twig to improve layout responsiveness and ensure proper styling for horizontal navigation mode.
- Enhanced theme-scripts.twig to improve user menu functionality, including repositioning and click handling.
- Introduced a new dashboard-icon-page.twig for a stylized icon dashboard, featuring card-based buttons for quick access to various functionalities, along with custom styles for better user experience.
This commit is contained in:
Matt Batchelder
2026-02-09 18:47:14 -05:00
parent 86030cb881
commit 54e092ec01
7 changed files with 1820 additions and 103 deletions

View File

@@ -52,7 +52,9 @@
})();
</script>
<style nonce="{{ cspNonce }}">html,body{background:#ffffff!important;color:#111111!important}
<style nonce="{{ cspNonce }}">
/* Let the CSS variable theming (light/dark) control page background */
html,body{background-color:var(--color-background,#0f172a)!important;color:var(--color-text-primary,#ffffff)!important}
/* Hide the old topbar strip entirely — actions are now in .ots-page-actions */
.row.header.header-side,
.ots-topbar-strip { display: none !important; height: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; }
@@ -104,9 +106,10 @@
{% endif %}
{% endif %}
<div id="content-wrapper"{% if hideNavigation == "1" %} class="no-nav"{% endif %}>
<div id="content-wrapper" class="{% if hideNavigation == "1" %}no-nav{% endif %}{% if horizontalNav %} ots-horizontal-nav{% endif %}">
{# Floating top-right actions: notification bell + user menu #}
{% if not forceHide %}
{# Hidden when horizontal nav is active — the navbar already has these controls #}
{% if not forceHide and not horizontalNav %}
<div class="ots-page-actions"{% if hideNavigation == "1" %} style="display:none!important"{% endif %}>
{% include "authed-theme-topbar.twig" ignore missing %}
{% if currentUser.featureEnabled("drawer") %}