diff --git a/app.py b/app.py index e643b2e..b87e980 100644 --- a/app.py +++ b/app.py @@ -100,8 +100,11 @@ def create_app() -> Flask: @app.context_processor def inject_company_name(): - """Make COMPANY_NAME available to all templates""" - return {'COMPANY_NAME': os.environ.get('COMPANY_NAME', 'QR Code Management System')} + """Make COMPANY_NAME and THEME_NAME available to all templates""" + return { + 'COMPANY_NAME': os.environ.get('COMPANY_NAME', 'QR Code Management System'), + 'THEME_NAME': os.environ.get('THEME_NAME', ''), + } @app.context_processor def inject_logging_status(): diff --git a/static/css/theme-gov.css b/static/css/theme-gov.css new file mode 100644 index 0000000..155aee1 --- /dev/null +++ b/static/css/theme-gov.css @@ -0,0 +1,127 @@ +/** + * theme-gov.css + * ============= + * UI theme overrides for GOV Services, Inc. (qr.govservicesinc.com) + * + * HOW IT WORKS + * ------------ + * This file is loaded AFTER style.css when THEME_NAME=gov is set in .env. + * It overrides only the CSS custom properties defined in style.css :root, + * so every component that uses those variables (sidebar, buttons, login page, + * links, badges, focus rings) automatically adopts the new palette. + * No existing files are duplicated or heavily modified. + * + * TO CUSTOMISE + * ------------ + * 1. Change --primary-color / --primary-hover to your desired brand colors. + * 2. Adjust --brand-text and --brand-icon-class below if needed. + * 3. For the original LT Services instance: set THEME_NAME= (empty) in its + * .env — this file will not load at all, leaving the default blue intact. + * + * ADDING A THIRD THEME (future) + * ----------------------------- + * Create static/css/theme-{name}.css and set THEME_NAME={name} in that + * instance's .env. No code changes required. + */ + +/* ------------------------------------------------------------------ */ +/* 1. COLOR PALETTE — GOV Services green */ +/* ------------------------------------------------------------------ */ +:root { + /* Primary brand color: institutional green */ + --primary-color: #1a6b3c; + --primary-hover: #145530; + + /* Accent used for links, focus rings, active states */ + --info-color: #1a6b3c; +} + +/* ------------------------------------------------------------------ */ +/* 2. SIDEBAR BRAND TEXT & ICON */ +/* Replaces the hardcoded "QR Manager" text in base_authenticated */ +/* ------------------------------------------------------------------ */ +.brand-text::before { + content: "GOV QR"; +} +.sidebar-brand .brand-content > span.brand-text { + /* Hide the original text node rendered by the template, + show our pseudo-element instead. */ + font-size: 0; +} +.sidebar-brand .brand-content > span.brand-text::before { + font-size: 1.125rem; /* matches original brand-text size */ + font-weight: 700; + letter-spacing: 0.02em; +} + +/* ------------------------------------------------------------------ */ +/* 3. LOGIN PAGE HEADER ("QR Manager" h1) */ +/* Replaces the hardcoded h1 in login.html without editing the file */ +/* ------------------------------------------------------------------ */ +.auth-header h1 { + font-size: 0 !important; /* hide original text */ +} +.auth-header h1::before { + content: "GOV Services"; + font-size: 2.25rem !important; + font-weight: 700 !important; + color: var(--gray-900) !important; +} + +/* ------------------------------------------------------------------ */ +/* 4. FOOTER COPYRIGHT LINE */ +/* ------------------------------------------------------------------ */ +.footer-content p { + font-size: 0; +} +.footer-content p::after { + content: "© 2025 GOV Services, Inc. All rights reserved."; + font-size: 0.875rem; + color: var(--gray-500); +} + +/* ------------------------------------------------------------------ */ +/* 5. SIDEBAR GRADIENT — re-declare to pick up new variables */ +/* (Browsers resolve var() at paint time so this block is only */ +/* needed if the gradient was hard-coded; here it is variable- */ +/* driven, so this section is a safety net.) */ +/* ------------------------------------------------------------------ */ +.sidebar { + background: linear-gradient( + 180deg, + var(--primary-color), + var(--primary-hover) + ); +} + +/* ------------------------------------------------------------------ */ +/* 6. AUTH CONTAINER GRADIENT (login background) */ +/* ------------------------------------------------------------------ */ +.auth-container { + background: linear-gradient( + 135deg, + var(--primary-color), + var(--primary-hover) + ) !important; +} + +.auth-logo { + background: linear-gradient( + 135deg, + var(--primary-color), + var(--primary-hover) + ) !important; +} + +.auth-card::before { + background: linear-gradient( + 90deg, + var(--primary-color), + var(--primary-hover) + ) !important; +} + +/* ------------------------------------------------------------------ */ +/* 7. PAGE TITLE / BROWSER TAB — handled via COMPANY_NAME in .env */ +/* (no CSS needed; Flask injects it from COMPANY_NAME=GOV. Serv...) */ +/* ------------------------------------------------------------------ */ diff --git a/templates/base.html b/templates/base.html index 892735e..a107553 100644 --- a/templates/base.html +++ b/templates/base.html @@ -1,97 +1,105 @@ - - - - - - {% block title %}{{ COMPANY_NAME }}{% endblock %} - - - - - - - - - {% block extra_head %}{% endblock %} - - - - - - -
- - {% with messages = get_flashed_messages(with_categories=true) %} {% if - messages %} -
- {% for category, message in messages %} -
- - {{ message }} - -
- {% endfor %} -
- {% endif %} {% endwith %} - - -
{% block content %}{% endblock %}
-
- - - - - - - - - {% block extra_scripts %}{% endblock %} - - - - {% if turnstile_enabled %} - - - {% endif %} - - + + + + + + {% block title %}{{ COMPANY_NAME }}{% endblock %} + + + + + + {% if THEME_NAME %} + + {% endif %} + + + + + + {% block extra_head %}{% endblock %} + + + + + + +
+ + {% with messages = get_flashed_messages(with_categories=true) %} {% if + messages %} +
+ {% for category, message in messages %} +
+ + {{ message }} + +
+ {% endfor %} +
+ {% endif %} {% endwith %} + + +
{% block content %}{% endblock %}
+
+ + + + + + + + + {% block extra_scripts %}{% endblock %} + + + + {% if turnstile_enabled %} + + + {% endif %} + + diff --git a/templates/base_authenticated.html b/templates/base_authenticated.html index 4c60a9d..a0621b9 100644 --- a/templates/base_authenticated.html +++ b/templates/base_authenticated.html @@ -11,6 +11,14 @@ href="{{ url_for('static', filename='css/style.css') }}" /> + + {% if THEME_NAME %} + + {% endif %} +