(a grandchild block doesn't propagate to a grandparent unless the intermediate layout re-declares it). #} {% block title %}{{ pageTitle|default("System Page") }}{% endblock %} {% block description %}{% endblock %} {# No site navigation or footer on system pages — just the centered card. #} {% block header %}{% endblock header %} {% block footer %}{% endblock footer %} {% block body %} <div class="system-page {% block page_class %}{% endblock %}"> <div class="system-container {% block container_class %}{% endblock %}"> {# Brand / Logo #} {% block brand %} <div class="system-brand"> {% if brand_settings.primaryLogo.src %} <img src="{{ brand_settings.primaryLogo.src }}" alt="{{ brand_settings.primaryLogo.alt or site_settings.company_name }}" class="system-logo"> {% elif site_settings.company_name %} <span class="system-brand-name">{{ site_settings.company_name }}</span> {% endif %} </div> {% endblock %} {# Icon Block #} {% block icon %} <div class="system-icon"> {% block icon_content %} <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> <path d="M12 2L2 7l10 5 10-5-10-5z"/> <path d="M2 17l10 5 10-5"/> <path d="M2 12l10 5 10-5"/> </svg> {% endblock %} </div> {% endblock %} {# Status/Code Block (for error pages) #} {% block status_code %}{% endblock %} {# Title #} <h1 class="system-title">{% block page_title %}System Page{% endblock %}</h1> {# Status Message (if applicable) #} {% block status_message %}{% endblock %} {# Main Message — div wrapper so templates can safely include block-level elements #} <div class="system-message"> {% block page_message %}{% endblock %} </div> {# Main Content Area #} {% block main_content %}{% endblock %} {# Actions/Buttons #} {% block actions %} <div class="system-actions"> {% block action_buttons %} <a href="/" class="btn btn-primary">Go to Homepage</a> {% endblock %} </div> {% endblock %} {# Additional Content #} {% block additional_content %}{% endblock %} {# Footer/Contact Info #} {% block footer_info %}{% endblock %} </div> </div> {# Page-specific scripts #} {% block scripts %}{% endblock %} {% endblock body %}

{# System Page Base Layout — single source of truth for all system pages (error + membership). This EXTENDS the theme's real base.html. That is deliberate and load-bearing: get_asset_url() / require_css() only resolve on system pages (incl. /_hcms/mem/*) when the template extends the standard base layout — a standalone doc gets an empty get_asset_url, so no CSS loads (that was the long-standing "unstyled login page" bug). Verified against the upthegame theme, whose membership login loads its CSS the same way. base.html already bakes the brand tokens (--color-*) and loads modern.css, so here we only add the system-pages stylesheet and hide the site chrome (header/footer) for a clean card. #} {% extends "../layouts/base.html" %} {# System-pages stylesheet — loaded the supported way. Do NOT {% include %} a .css file (that fails validation) and do NOT rely on a standalone layout (get_asset_url returns empty there). #} {{ require_css(get_asset_url("../../css/components/system-pages.css")) }} {# Re-expose title/description so child templates' {% block title %} reaches base.html's (a grandchild block doesn't propagate to a grandparent unless the intermediate layout re-declares it). #} {% block title %}{{ pageTitle|default("System Page") }}{% endblock %} {% block description %}{% endblock %} {# No site navigation or footer on system pages — just the centered card. #} {% block header %}{% endblock header %} {% block footer %}{% endblock footer %} {% block body %} <div class="system-page {% block page_class %}{% endblock %}"> <div class="system-container {% block container_class %}{% endblock %}"> {# Brand / Logo #} {% block brand %} <div class="system-brand"> {% if brand_settings.primaryLogo.src %} <img src="{{ brand_settings.primaryLogo.src }}" alt="{{ brand_settings.primaryLogo.alt or site_settings.company_name }}" class="system-logo"> {% elif site_settings.company_name %} <span class="system-brand-name">{{ site_settings.company_name }}</span> {% endif %} </div> {% endblock %} {# Icon Block #} {% block icon %} <div class="system-icon"> {% block icon_content %} <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> <path d="M12 2L2 7l10 5 10-5-10-5z"/> <path d="M2 17l10 5 10-5"/> <path d="M2 12l10 5 10-5"/> </svg> {% endblock %} </div> {% endblock %} {# Status/Code Block (for error pages) #} {% block status_code %}{% endblock %} {# Title #} <h1 class="system-title">{% block page_title %}System Page{% endblock %}</h1> {# Status Message (if applicable) #} {% block status_message %}{% endblock %} {# Main Message — div wrapper so templates can safely include block-level elements #} <div class="system-message"> {% block page_message %}{% endblock %} </div> {# Main Content Area #} {% block main_content %}{% endblock %} {# Actions/Buttons #} {% block actions %} <div class="system-actions"> {% block action_buttons %} <a href="/" class="btn btn-primary">Go to Homepage</a> {% endblock %} </div> {% endblock %} {# Additional Content #} {% block additional_content %}{% endblock %} {# Footer/Contact Info #} {% block footer_info %}{% endblock %} </div> </div> {# Page-specific scripts #} {% block scripts %}{% endblock %} {% endblock body %}