{# app/templates/shop/base.html #} {# Base template for vendor shop frontend with theme support #} {# Dynamic title with vendor branding #} {% block title %}{{ vendor.name }}{% endblock %} {% if vendor.tagline %} - {{ vendor.tagline }}{% endif %} {# SEO Meta Tags #} {# Favicon - vendor-specific or default #} {% if theme.branding.favicon %} {% else %} {% endif %} {# CRITICAL: Inject theme CSS variables #} {# Tailwind CSS - uses CSS variables #} {# Base Shop Styles #} {# Optional: Theme-specific stylesheet #} {% if theme.theme_name != 'default' %} {% endif %} {# Alpine.js for interactivity #} {% block extra_head %}{% endblock %} {# Header - Theme-aware #}
{# Vendor Logo #}
{% if theme.branding.logo %} {# Show light logo in light mode, dark logo in dark mode #} {{ vendor.name }} {% if theme.branding.logo_dark %} {{ vendor.name }} {% endif %} {% else %} {{ vendor.name }} {% endif %}
{# Navigation #} {# Right side actions #}
{# Search #} {# Cart #} {# Theme toggle #} {# Account #} {# Mobile menu toggle #}
{# Main Content Area #}
{% block content %} {# Page-specific content goes here #} {% endblock %}
{# Footer with vendor info and social links #} {# Base Shop JavaScript #} {# Page-specific JavaScript #} {% block extra_scripts %}{% endblock %} {# Toast notification container #}