jekyll-theme-zer0 0.22.0 → 0.22.19

data/_includes/setup/wizard.html

@@ -0,0 +1,330 @@
+<!--
+  ===================================================================
+  SETUP WIZARD — Interactive _config.yml Generator
+  ===================================================================
+
+  File: wizard.html
+  Path: _includes/setup/wizard.html
+  Purpose: Multi-step Bootstrap form that builds a complete _config.yml
+           and lets the user download or copy it.
+
+  Dependencies: Bootstrap 5.3, assets/js/setup-wizard.js
+  Environment: Development only (guarded by calling page)
+  ===================================================================
+-->
+
+<div class="container py-4" id="setup-wizard">
+  <div class="row justify-content-center">
+    <div class="col-lg-10">
+
+      <h1 class="mb-2"><i class="bi bi-gear-wide-connected"></i> Site Setup Wizard</h1>
+      <p class="lead text-muted mb-4">
+        Fill in the form to generate a personalised <code>_config.yml</code>.
+        Download it and replace the one in your project root.
+      </p>
+
+      <!-- ============================================================ -->
+      <!-- Progress Tabs                                                 -->
+      <!-- ============================================================ -->
+      <ul class="nav nav-pills nav-fill mb-4" id="wizardTabs" role="tablist">
+        <li class="nav-item" role="presentation">
+          <button class="nav-link active" id="tab-identity"
+                  data-bs-toggle="pill" data-bs-target="#step-identity"
+                  type="button" role="tab">
+            <i class="bi bi-person-badge"></i> Identity
+          </button>
+        </li>
+        <li class="nav-item" role="presentation">
+          <button class="nav-link" id="tab-urls"
+                  data-bs-toggle="pill" data-bs-target="#step-urls"
+                  type="button" role="tab">
+            <i class="bi bi-link-45deg"></i> URLs
+          </button>
+        </li>
+        <li class="nav-item" role="presentation">
+          <button class="nav-link" id="tab-collections"
+                  data-bs-toggle="pill" data-bs-target="#step-collections"
+                  type="button" role="tab">
+            <i class="bi bi-collection"></i> Collections
+          </button>
+        </li>
+        <li class="nav-item" role="presentation">
+          <button class="nav-link" id="tab-analytics"
+                  data-bs-toggle="pill" data-bs-target="#step-analytics"
+                  type="button" role="tab">
+            <i class="bi bi-graph-up"></i> Analytics
+          </button>
+        </li>
+        <li class="nav-item" role="presentation">
+          <button class="nav-link" id="tab-review"
+                  data-bs-toggle="pill" data-bs-target="#step-review"
+                  type="button" role="tab">
+            <i class="bi bi-file-earmark-code"></i> Review
+          </button>
+        </li>
+      </ul>
+
+      <!-- ============================================================ -->
+      <!-- Step Panels                                                   -->
+      <!-- ============================================================ -->
+      <div class="tab-content" id="wizardTabContent">
+
+        <!-- ───── Step 1: Identity ───── -->
+        <div class="tab-pane fade show active" id="step-identity" role="tabpanel">
+          <div class="card">
+            <div class="card-body">
+              <h4 class="card-title mb-3">Site Identity</h4>
+
+              <div class="mb-3">
+                <label for="cfg-title" class="form-label">Site Title</label>
+                <input type="text" class="form-control cfg-field" id="cfg-title"
+                       placeholder="My Awesome Site" data-key="title">
+              </div>
+
+              <div class="mb-3">
+                <label for="cfg-subtitle" class="form-label">Subtitle <small class="text-muted">(optional)</small></label>
+                <input type="text" class="form-control cfg-field" id="cfg-subtitle"
+                       placeholder="A short tagline" data-key="subtitle">
+              </div>
+
+              <div class="mb-3">
+                <label for="cfg-description" class="form-label">Description <small class="text-muted">(SEO, ≤ 160 chars)</small></label>
+                <textarea class="form-control cfg-field" id="cfg-description" rows="2"
+                          maxlength="160" data-key="description"
+                          placeholder="Brief description of your site for search engines"></textarea>
+                <div class="form-text"><span id="desc-count">0</span>/160</div>
+              </div>
+
+              <div class="row">
+                <div class="col-md-6 mb-3">
+                  <label for="cfg-author" class="form-label">Author / Owner</label>
+                  <input type="text" class="form-control cfg-field" id="cfg-author"
+                         placeholder="Your Name" data-key="founder">
+                </div>
+                <div class="col-md-6 mb-3">
+                  <label for="cfg-email" class="form-label">Email</label>
+                  <input type="email" class="form-control cfg-field" id="cfg-email"
+                         placeholder="you@example.com" data-key="email">
+                </div>
+              </div>
+
+              <div class="mb-3">
+                <label for="cfg-github-user" class="form-label">GitHub Username</label>
+                <input type="text" class="form-control cfg-field" id="cfg-github-user"
+                       placeholder="your-username" data-key="github_user">
+              </div>
+
+              <div class="mb-3">
+                <label for="cfg-repo-name" class="form-label">Repository Name</label>
+                <input type="text" class="form-control cfg-field" id="cfg-repo-name"
+                       placeholder="my-site" data-key="repository_name">
+                <div class="form-text">The GitHub repository name for this site (e.g. <code>my-site</code>).</div>
+              </div>
+
+              <div class="text-end">
+                <button class="btn btn-primary btn-next" data-next="tab-urls">
+                  Next: URLs <i class="bi bi-arrow-right"></i>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- ───── Step 2: URLs ───── -->
+        <div class="tab-pane fade" id="step-urls" role="tabpanel">
+          <div class="card">
+            <div class="card-body">
+              <h4 class="card-title mb-3">URLs &amp; Deployment</h4>
+
+              <div class="mb-3">
+                <label for="cfg-url" class="form-label">Site URL</label>
+                <input type="url" class="form-control cfg-field" id="cfg-url"
+                       placeholder="https://yourdomain.com" data-key="url">
+                <div class="form-text">Your production URL. For GitHub Pages: <code>https://USERNAME.github.io</code></div>
+              </div>
+
+              <div class="mb-3">
+                <label for="cfg-baseurl" class="form-label">Base URL <small class="text-muted">(path prefix)</small></label>
+                <input type="text" class="form-control cfg-field" id="cfg-baseurl"
+                       placeholder="/repo-name" data-key="baseurl">
+                <div class="form-text">Leave empty for apex domains. Use <code>/repo-name</code> for project pages.</div>
+              </div>
+
+              <div class="mb-3">
+                <label for="cfg-remote-theme" class="form-label">Remote Theme</label>
+                <input type="text" class="form-control cfg-field" id="cfg-remote-theme"
+                       value="bamr87/zer0-mistakes" data-key="remote_theme">
+                <div class="form-text">Used by GitHub Pages. Set to <code>false</code> for local development.</div>
+              </div>
+
+              <div class="mb-3">
+                <label for="cfg-permalink" class="form-label">Permalink Style</label>
+                <select class="form-select cfg-field" id="cfg-permalink" data-key="permalink">
+                  <option value="/:categories/:title/">/:categories/:title/</option>
+                  <option value="/blog/:year/:month/:day/:title/">Date-based</option>
+                  <option value="/:title/">Title only</option>
+                  <option value="pretty">Pretty (/:categories/:year/:month/:day/:title/)</option>
+                </select>
+              </div>
+
+              <div class="d-flex justify-content-between">
+                <button class="btn btn-outline-secondary btn-prev" data-prev="tab-identity">
+                  <i class="bi bi-arrow-left"></i> Back
+                </button>
+                <button class="btn btn-primary btn-next" data-next="tab-collections">
+                  Next: Collections <i class="bi bi-arrow-right"></i>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- ───── Step 3: Collections ───── -->
+        <div class="tab-pane fade" id="step-collections" role="tabpanel">
+          <div class="card">
+            <div class="card-body">
+              <h4 class="card-title mb-3">Content Collections</h4>
+              <p class="text-muted">Toggle which content collections to enable.</p>
+
+              <div class="form-check form-switch mb-3">
+                <input class="form-check-input cfg-collection" type="checkbox" id="col-posts" checked data-col="posts">
+                <label class="form-check-label" for="col-posts">
+                  <strong>Blog Posts</strong> — <code>pages/_posts/</code>
+                </label>
+              </div>
+
+              <div class="form-check form-switch mb-3">
+                <input class="form-check-input cfg-collection" type="checkbox" id="col-docs" checked data-col="docs">
+                <label class="form-check-label" for="col-docs">
+                  <strong>Documentation</strong> — <code>pages/_docs/</code>
+                </label>
+              </div>
+
+              <div class="form-check form-switch mb-3">
+                <input class="form-check-input cfg-collection" type="checkbox" id="col-about" checked data-col="about">
+                <label class="form-check-label" for="col-about">
+                  <strong>About Pages</strong> — <code>pages/_about/</code>
+                </label>
+              </div>
+
+              <div class="form-check form-switch mb-3">
+                <input class="form-check-input cfg-collection" type="checkbox" id="col-notes" data-col="notes">
+                <label class="form-check-label" for="col-notes">
+                  <strong>Notes</strong> — <code>pages/_notes/</code>
+                </label>
+              </div>
+
+              <div class="form-check form-switch mb-3">
+                <input class="form-check-input cfg-collection" type="checkbox" id="col-notebooks" data-col="notebooks">
+                <label class="form-check-label" for="col-notebooks">
+                  <strong>Notebooks</strong> — <code>pages/_notebooks/</code>
+                </label>
+              </div>
+
+              <div class="d-flex justify-content-between">
+                <button class="btn btn-outline-secondary btn-prev" data-prev="tab-urls">
+                  <i class="bi bi-arrow-left"></i> Back
+                </button>
+                <button class="btn btn-primary btn-next" data-next="tab-analytics">
+                  Next: Analytics <i class="bi bi-arrow-right"></i>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- ───── Step 4: Analytics ───── -->
+        <div class="tab-pane fade" id="step-analytics" role="tabpanel">
+          <div class="card">
+            <div class="card-body">
+              <h4 class="card-title mb-3">Analytics &amp; Integrations</h4>
+
+              <div class="mb-3">
+                <label for="cfg-ga" class="form-label">Google Analytics ID <small class="text-muted">(optional)</small></label>
+                <input type="text" class="form-control cfg-field" id="cfg-ga"
+                       placeholder="G-XXXXXXXXXX" data-key="google_analytics">
+              </div>
+
+              <div class="mb-4">
+                <label class="form-label">PostHog Analytics</label>
+                <div class="form-check form-switch mb-2">
+                  <input class="form-check-input" type="checkbox" id="cfg-posthog-enabled" data-key="posthog.enabled">
+                  <label class="form-check-label" for="cfg-posthog-enabled">Enable PostHog</label>
+                </div>
+                <input type="text" class="form-control cfg-field" id="cfg-posthog-key"
+                       placeholder="phc_your_key_here" data-key="posthog.api_key">
+              </div>
+
+              <div class="mb-3">
+                <label class="form-label">Social Links <small class="text-muted">(optional)</small></label>
+                <div class="row g-2">
+                  <div class="col-md-6">
+                    <div class="input-group">
+                      <span class="input-group-text"><i class="bi bi-twitter-x"></i></span>
+                      <input type="text" class="form-control cfg-field" placeholder="username" data-key="twitter_username">
+                    </div>
+                  </div>
+                  <div class="col-md-6">
+                    <div class="input-group">
+                      <span class="input-group-text"><i class="bi bi-linkedin"></i></span>
+                      <input type="text" class="form-control cfg-field" placeholder="username" data-key="linkedin_username">
+                    </div>
+                  </div>
+                </div>
+              </div>
+
+              <div class="d-flex justify-content-between">
+                <button class="btn btn-outline-secondary btn-prev" data-prev="tab-collections">
+                  <i class="bi bi-arrow-left"></i> Back
+                </button>
+                <button class="btn btn-primary btn-next" data-next="tab-review">
+                  Review &amp; Download <i class="bi bi-arrow-right"></i>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- ───── Step 5: Review & Download ───── -->
+        <div class="tab-pane fade" id="step-review" role="tabpanel">
+          <div class="card">
+            <div class="card-body">
+              <h4 class="card-title mb-3">Review Your Configuration</h4>
+              <p class="text-muted">This is the <code>_config.yml</code> that will be generated. Review it, then download or copy.</p>
+
+              <div class="position-relative">
+                <pre class="bg-dark text-light p-3 rounded" style="max-height:450px;overflow:auto"><code id="yaml-preview">Loading…</code></pre>
+                <button class="btn btn-sm btn-outline-light position-absolute top-0 end-0 m-2" id="btn-copy"
+                        title="Copy to clipboard">
+                  <i class="bi bi-clipboard"></i>
+                </button>
+              </div>
+
+              <div class="d-flex justify-content-between mt-3">
+                <button class="btn btn-outline-secondary btn-prev" data-prev="tab-analytics">
+                  <i class="bi bi-arrow-left"></i> Back
+                </button>
+                <div>
+                  <button class="btn btn-outline-primary me-2" id="btn-copy-full">
+                    <i class="bi bi-clipboard"></i> Copy YAML
+                  </button>
+                  <button class="btn btn-primary" id="btn-download">
+                    <i class="bi bi-download"></i> Download _config.yml
+                  </button>
+                </div>
+              </div>
+
+              <div class="alert alert-info mt-4" role="alert">
+                <i class="bi bi-info-circle"></i>
+                <strong>Next step:</strong> Replace the <code>_config.yml</code> in your project root with the downloaded file, then restart your dev server.
+              </div>
+            </div>
+          </div>
+        </div>
+
+      </div><!-- /tab-content -->
+    </div>
+  </div>
+</div>
+
+<script src="{{ '/assets/js/setup-wizard.js' | relative_url }}"></script>

data/_layouts/admin.html

@@ -0,0 +1,166 @@
+---
+layout: root
+---
+<!--
+  ===================================================================
+  ADMIN LAYOUT - Administrative and configuration page layout
+  ===================================================================
+  
+  File: admin.html
+  Path: _layouts/admin.html
+  Inherits: root.html
+  Purpose: Dedicated layout for administrative, settings, and
+           configuration utility pages. Provides a dashboard-style
+           presentation without article-oriented metadata.
+  
+  Template Logic:
+  - Full-width container with optional collapsible admin sidebar
+  - Admin header with page icon, title, and breadcrumb navigation
+  - No author byline, reading time, or share buttons
+  - Responsive: sidebar collapses to offcanvas on mobile
+  - Supports front matter: icon, admin_nav (true/false)
+  
+  Front Matter Variables:
+  - icon: Bootstrap Icon class for header (e.g., "bi-gear")
+  - admin_nav: Show admin sidebar navigation (default: true)
+  - admin_section: Active section name for sidebar highlighting
+  - admin_actions: Array of {label, url, icon, style} for header buttons
+  
+  Layout Structure:
+  1. Admin header with breadcrumbs, icon, title, description, actions
+  2. Optional admin sidebar with navigation links (data-driven)
+  3. Full-width main content area
+  
+  Dependencies:
+  - Bootstrap 5 grid, offcanvas, nav components
+  - Bootstrap Icons
+  ===================================================================
+-->
+
+{% comment %} ════════════════════════════════════════════════════════ {% endcomment %}
+{% comment %} ADMIN NAV DATA                                          {% endcomment %}
+{% comment %} Collect pages in the about collection that have         {% endcomment %}
+{% comment %} admin_nav_order set, or fall back to a sensible list.   {% endcomment %}
+{% comment %} ════════════════════════════════════════════════════════ {% endcomment %}
+
+{% assign show_sidebar = page.admin_nav | default: true %}
+
+<!-- ================================================ -->
+<!-- ADMIN PAGE HEADER                                -->
+<!-- Breadcrumbs + title bar (no author/read-time)    -->
+<!-- ================================================ -->
+<div class="bg-body-tertiary border-bottom">
+  <div class="container-xxl py-3">
+    <!-- Breadcrumbs -->
+    <nav aria-label="breadcrumb">
+      <ol class="breadcrumb mb-2 small">
+        <li class="breadcrumb-item"><a href="{{ '/' | relative_url }}"><i class="bi bi-house-door"></i> Home</a></li>
+        <li class="breadcrumb-item"><a href="{{ '/about/' | relative_url }}">About</a></li>
+        <li class="breadcrumb-item active" aria-current="page">{{ page.title }}</li>
+      </ol>
+    </nav>
+
+    <!-- Title row -->
+    <div class="d-flex align-items-center">
+      {% if page.icon %}
+        <i class="{{ page.icon }} fs-2 me-3 text-primary"></i>
+      {% else %}
+        <i class="bi bi-gear fs-2 me-3 text-primary"></i>
+      {% endif %}
+      <div class="me-auto">
+        <h1 class="h3 mb-0">{{ page.title }}</h1>
+        {% if page.excerpt and page.excerpt != empty %}
+          <p class="text-body-secondary mb-0 small">{{ page.excerpt | strip_html }}</p>
+        {% endif %}
+        {% if page.lastmod %}
+          <small class="text-body-tertiary"><i class="bi bi-clock me-1"></i>Updated {{ page.lastmod | date: "%b %d, %Y" }}</small>
+        {% endif %}
+      </div>
+
+      <!-- Page-level action buttons (from front matter admin_actions) -->
+      {% if page.admin_actions %}
+      <div class="d-none d-md-flex gap-2 ms-3">
+        {% for action in page.admin_actions %}
+          <a href="{{ action.url | relative_url }}"
+             class="btn btn-sm {{ action.style | default: 'btn-outline-secondary' }}">
+            {% if action.icon %}<i class="{{ action.icon }} me-1"></i>{% endif %}
+            {{ action.label }}
+          </a>
+        {% endfor %}
+      </div>
+      {% endif %}
+
+      <!-- Mobile sidebar toggle -->
+      {% if show_sidebar %}
+      <button class="btn btn-outline-secondary ms-3 d-lg-none"
+              type="button"
+              data-bs-toggle="offcanvas"
+              data-bs-target="#adminSidebar"
+              aria-controls="adminSidebar"
+              aria-label="Toggle admin navigation">
+        <i class="bi bi-list"></i>
+      </button>
+      {% endif %}
+    </div>
+  </div>
+</div>
+
+<!-- ================================================ -->
+<!-- MAIN LAYOUT: SIDEBAR + CONTENT                   -->
+<!-- ================================================ -->
+<div class="container-xxl py-4">
+  <div class="row">
+
+    {% if show_sidebar %}
+    <!-- ════════════════════════════════ -->
+    <!-- ADMIN SIDEBAR                   -->
+    <!-- Desktop: sticky column           -->
+    <!-- Mobile: offcanvas                -->
+    <!-- ════════════════════════════════ -->
+
+    <!-- Desktop sidebar (lg+) -->
+    <div class="col-lg-3 d-none d-lg-block">
+      <div class="position-sticky" style="top: 5rem;">
+        <nav class="admin-sidebar" aria-label="Admin navigation">
+          <h6 class="text-uppercase text-body-secondary fw-semibold small mb-3">
+            <i class="bi bi-sliders me-1"></i> Administration
+          </h6>
+          {% include navigation/admin-nav.html %}
+        </nav>
+      </div>
+    </div>
+
+    <!-- Mobile offcanvas sidebar -->
+    <div class="offcanvas offcanvas-start d-lg-none" tabindex="-1"
+         id="adminSidebar" aria-labelledby="adminSidebarLabel">
+      <div class="offcanvas-header">
+        <h5 class="offcanvas-title" id="adminSidebarLabel">
+          <i class="bi bi-sliders me-1"></i> Administration
+        </h5>
+        <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+      </div>
+      <div class="offcanvas-body">
+        {% include navigation/admin-nav.html %}
+      </div>
+    </div>
+
+    <!-- Main content area (with sidebar) -->
+    <div class="col-lg-9">
+      <div id="admin-content">
+        {{ content }}
+      </div>
+    </div>
+
+    {% else %}
+
+    <!-- Full-width content (no sidebar) -->
+    <div class="col-12">
+      <div id="admin-content">
+        {{ content }}
+      </div>
+    </div>
+
+    {% endif %}
+
+  </div>
+</div>

data/_layouts/landing.html

@@ -47,13 +47,13 @@ layout: root
 <!-- ================================ -->
 <!-- HERO SECTION                     -->
 <!-- ================================ -->
-<div class="bg-primary text-white position-relative overflow-hidden">
+<div class="bg-primary zer0-bg-hero text-white position-relative overflow-hidden landing-hero">
     <div class="container-xl py-5 px-4 px-md-5">
         <div class="row align-items-center min-vh-50 g-4 g-lg-5">
-            <div class="col-lg-6 order-1">
-                <h1 class="display-4 fw-bold mb-3 animate-on-scroll">{{ page.title }}</h1>
-                <p class="lead mb-4 animate-on-scroll" style="animation-delay: 0.1s;">{{ page.description }}</p>
-                <div class="d-flex flex-column flex-md-row gap-3 animate-on-scroll" style="animation-delay: 0.2s;">
+            <div class="col-lg-6 order-1 landing-hero-copy">
+                <h1 class="display-4 fw-bold mb-3">{{ page.title }}</h1>
+                <p class="lead mb-4">{{ page.description }}</p>
+                <div class="d-flex flex-column flex-md-row gap-3 flex-wrap">
                     <a href="#get-started" class="btn btn-light btn-lg">
                         <i class="bi bi-rocket-takeoff me-2"></i>Get Started
                     </a>
@@ -67,11 +67,25 @@ layout: root
             </div>
             <div class="col-lg-6 text-center order-2">
                 {% if page.hero_image %}
-                <img src="{{ page.hero_image }}" alt="{{ page.title }}" class="img-fluid rounded shadow-lg animate-on-scroll" loading="eager" style="animation-delay: 0.3s;">
+                <div class="landing-hero-media ratio ratio-4x3 mx-auto shadow-lg rounded overflow-hidden">
+                    <img
+                        src="{{ page.hero_image | relative_url }}"
+                        alt="{{ page.title }}"
+                        class="w-100 h-100"
+                        width="800"
+                        height="600"
+                        loading="eager"
+                        decoding="async"
+                        fetchpriority="high"
+                        style="object-fit: contain;"
+                    >
+                </div>
                 {% else %}
-                <div class="bg-secondary rounded p-5 text-body animate-on-scroll">
-                    <i class="bi bi-code-square display-1"></i>
-                    <p class="mt-3 mb-0">Jekyll Theme</p>
+                <div class="landing-hero-media ratio ratio-4x3 mx-auto shadow-lg rounded overflow-hidden">
+                    <div class="position-absolute top-0 start-0 w-100 h-100 d-flex flex-column align-items-center justify-content-center bg-secondary bg-opacity-25 text-body rounded">
+                        <i class="bi bi-code-square display-1"></i>
+                        <p class="mt-3 mb-0 px-3">Jekyll Theme</p>
+                    </div>
                 </div>
                 {% endif %}
             </div>

data/_layouts/root.html

@@ -31,7 +31,7 @@
 -->
 
 <!doctype html>
-<html lang="{{ site.locale | slice: 0,2 | default: 'en' }}" class="no-js" data-bs-theme="dark">
+<html lang="{{ site.locale | slice: 0,2 | default: 'en' }}" class="no-js" data-bs-theme="dark" data-theme-skin="{{ site.theme_skin | default: 'dark' }}" data-zer0-bg="{{ site.theme_background.enabled | default: true }}">
     <head>
         <!-- =============================================== -->
         <!-- HEAD SECTION: Meta tags, styles, and SEO setup -->
@@ -43,15 +43,18 @@
         <!-- Jekyll SEO plugin for enhanced search engine optimization -->
         <!-- Documentation: https://github.com/jekyll/jekyll-seo-tag -->
         {% seo %}
+
+        <!-- fffuel-style SVG background config overrides -->
+        {% include components/svg-background.html zone="body" %}
     </head>
     
-    <body data-bs-spy="scroll" data-bs-target="#TableOfContents">
+    <body class="zer0-bg-body" data-bs-spy="scroll" data-bs-target="#TableOfContents">
         <!-- ============================================== -->
         <!-- BODY SECTION: Site structure and content area -->
         <!-- ============================================== -->
         
         <!-- Inline SVG symbols for consistent iconography throughout the site -->
-        {% include_cached components/svg.html %}
+        {% include components/svg.html %}
 
         <!-- Google Tag Manager body code for analytics (if configured) -->
         <!-- Note: Currently commented out - uncomment when GTM is needed -->
@@ -60,11 +63,14 @@
         {% include core/header.html %}
 
         <!-- Search modal (site-wide) -->
-        {% include_cached components/search-modal.html %}
+        {% include components/search-modal.html %}
 
         <!-- Site-wide information banner or announcement section -->
         {% include components/info-section.html %}
 
+        <!-- Setup banner for unconfigured sites -->
+        {% include components/setup-banner.html %}
+
         <!-- ======================== -->
         <!-- MAIN CONTENT AREA        -->
         <!-- ======================== -->
@@ -81,7 +87,7 @@
         {%- include core/footer.html -%}
 
         <!-- Privacy-compliant cookie consent banner -->
-        {%- include_cached components/cookie-consent.html -%}
+        {%- include components/cookie-consent.html -%}
 
         <!-- JavaScript dependencies and custom scripts -->
         <div>
@@ -89,7 +95,7 @@
             <!-- Note: Currently commented out - uncomment when search is implemented -->
 
             <!-- External JavaScript libraries and custom scripts -->
-            {% include_cached components/js-cdn.html %}
+            {% include components/js-cdn.html %}
         </div>
 
         <!-- Analytics Integration -->