jekyll-theme-zer0 0.2.0 → 0.4.0

data/_includes/core/head.html

@@ -0,0 +1,163 @@
+<!--
+  ===================================================================
+  HEAD - HTML Document Head Section
+  ===================================================================
+  
+  File: head.html
+  Path: _includes/head.html
+  Purpose: Complete HTML document head section with meta tags, styles, 
+           and essential JavaScript libraries
+  
+  Template Logic:
+  - Loads critical JavaScript libraries before page render
+  - Includes SEO optimization and social media meta tags
+  - Configures third-party integrations (Analytics, MathJax)
+  - Sets up progress bar and UI enhancement scripts
+  
+  Dependencies:
+  - seo.html: SEO meta tags and Open Graph data
+  - google-analytics.html: Google Analytics tracking
+  - google-tag-manager-head.html: GTM head section
+  
+  Performance Notes:
+  - Scripts loaded in head for immediate availability
+  - MathJax loaded asynchronously to prevent render blocking
+  - Nanobar provides visual loading feedback
+  ===================================================================
+-->
+
+<!-- ================================ -->
+<!-- ANALYTICS AND TRACKING          -->
+<!-- ================================ -->
+<!-- Google Tag Manager - Must be in head section for proper tracking -->
+{% include analytics/google-tag-manager-head.html %}
+
+<!-- ================================ -->
+<!-- JAVASCRIPT LIBRARIES            -->
+<!-- ================================ -->
+<!-- Custom theme JavaScript - Loaded early for UI functionality -->
+<script src="{{ '/assets/js/myScript.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/auto-hide-nav.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/back-to-top.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/halfmoon.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/side-bar-folders.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/code-copy.js' | relative_url }}"></script>
+
+<!-- ================================ -->
+<!-- THIRD PARTY INTEGRATIONS        -->
+<!-- ================================ -->
+
+<!-- Mermaid Diagrams - Conditional loading based on page front matter -->
+{% if page.mermaid %}
+  {% include components/mermaid.html %}
+{% endif %}
+
+<!-- Nano Progress Bar - Visual loading indicator -->
+<script src="{{'/assets/js/nanobar.min.js' | relative_url }}"></script>
+
+<!-- Progress Bar Initialization - Creates visual loading feedback -->
+<script>
+    // Wait for DOM to be ready before initializing Nanobar
+    document.addEventListener('DOMContentLoaded', function() {
+        // Check if the progress bar element exists before initializing
+        var progressElement = document.getElementById('top-progress-bar');
+        if (progressElement) {
+            var options = {
+              classname: 'nanobar',
+              id: 'top-progress-bar'
+            };
+            var nanobar = new Nanobar(options);
+            nanobar.go( 30 );  // Initial loading state
+            nanobar.go( 76 );  // Partial completion
+            nanobar.go(100);   // Complete loading
+        } else {
+            console.warn('Progress bar element #top-progress-bar not found. Skipping Nanobar initialization.');
+        }
+    });
+</script>
+
+<!-- MathJax - Mathematical notation rendering (async for performance) -->
+<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
+
+<!-- ================================ -->
+<!-- HTML DOCUMENT META DATA         -->
+<!-- ================================ -->
+<!-- Essential meta tags for proper document rendering and mobile support -->
+<meta charset="utf-8">
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+<!-- ================================ -->
+<!-- SEO AND SOCIAL MEDIA META TAGS  -->
+<!-- ================================ -->
+<!-- Comprehensive SEO optimization including Open Graph and Twitter Cards -->
+{% include content/seo.html %}
+
+<!-- ========================== -->
+<!-- STRUCTURED DATA MARKUP    -->
+<!-- ========================== -->
+<!-- Enhanced meta data for rich snippets and social media -->
+{% if page.title %}
+    <meta itemprop="headline" content="{{ page.title | markdownify | strip_html | strip_newlines | escape_once }}">
+{% endif %}
+{% if page.description %}
+    <meta itemprop="description" content="{{ page.description | markdownify | strip_html | strip_newlines | escape_once }}">
+{% elsif page.excerpt %}
+    <meta itemprop="description" content="{{ page.excerpt | markdownify | strip_html | strip_newlines | escape_once}} ">
+{% endif %}
+{% if page.date %}
+    <meta itemprop="datePublished" content="{{ page.date | date_to_xmlschema }}">
+{% endif %}
+{% if page.last_modified_at %}
+    <meta itemprop="dateModified" content="{{ page.lastmod | date_to_xmlschema }}">
+{% endif %}
+
+<!-- ========================== -->
+<!-- ANALYTICS INTEGRATION     -->
+<!-- ========================== -->
+<!-- Google Analytics tracking - Configured in _config.yml -->
+{% include analytics/google-analytics.html %}
+
+
+<!-- ================================ -->
+<!-- CSS FRAMEWORKS AND LIBRARIES   -->
+<!-- ================================ -->
+
+<!-- ========================== -->
+<!-- BOOTSTRAP 5 FRAMEWORK     -->
+<!-- ========================== -->
+<!-- Bootstrap 5.3.3 - Primary CSS framework via CDN for performance -->
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+
+<!-- Local Bootstrap Installation - Alternative for offline development -->
+<!-- <script src="/assets/js/bootstrap.js"></script> -->
+
+<!-- ========================== -->
+<!-- ICON LIBRARIES             -->
+<!-- ========================== -->
+<!-- Bootstrap Icons 1.10.3 - Complete icon set for UI elements -->
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css">
+
+<!-- ========================== -->
+<!-- CUSTOM THEME STYLES       -->
+<!-- ========================== -->
+<!-- Primary theme stylesheet - Core styling and layout -->
+<link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">
+
+<!-- Custom CSS overrides - Theme customizations and tweaks -->
+<link rel="stylesheet" href="{{'/assets/css/custom.css' | relative_url }}">
+
+<!-- Statistics page specific styles -->
+{% if page.layout == 'stats' %}
+<link rel="stylesheet" href="{{ '/assets/css/stats.css' | relative_url }}">
+{% endif %}
+
+<!-- ========================== -->
+<!-- EXPERIMENTAL FRAMEWORKS   -->
+<!-- ========================== -->
+<!-- Tailwind CSS - Currently disabled, enable for utility-first styling -->
+<!-- <script src="https://cdn.tailwindcss.com"></script> -->
+
+<!-- Docs CSS - Alternative stylesheet, currently disabled due to scroll spy issues -->
+<!-- TODO: Replace with compiled Sass when scroll spy functionality is fixed -->
+<!-- <link rel="stylesheet" href="/assets/css/docs.css"> -->

data/_includes/core/header.html

@@ -0,0 +1,125 @@
+<!--
+  ===================================================================
+  HEADER - Main Navigation and Site Header
+  ===================================================================
+  
+  File: header.html
+  Path: _includes/header.html
+  Purpose: Primary site navigation with responsive design and 
+           offcanvas mobile menu integration
+  
+  Template Logic:
+  - Responsive navigation bar with Bootstrap 5 components
+  - Offcanvas sidebars for mobile navigation
+  - Brand logo and home navigation integration
+  - Settings modal and navigation toggles
+  
+  Dependencies:
+  - branding.html: Site title and logo display
+  - navbar.html: Main navigation menu items
+  - Bootstrap 5 offcanvas and navbar components
+  
+  Responsive Behavior:
+  - Desktop: Full horizontal navigation bar
+  - Mobile: Collapsed navigation with hamburger menu
+  - Offcanvas panels for sidebar and navigation
+  
+  TODO: Fix Nanobar progress bar positioning and animation
+  ===================================================================
+-->
+
+<header id="navbar" class="container-fluid text-center z-1" role="navigation">
+
+    <!-- ================================ -->
+    <!-- TOP NAVIGATION BAR              -->
+    <!-- ================================ -->
+    <div class="navbar navbar-expand-lg bg-body-tertiary flex-nowrap justify-content-center bottom-shadow">
+       
+        <!-- ========================== -->
+        <!-- PROGRESS BAR INDICATOR    -->
+        <!-- ========================== -->
+        <!-- Fixed position progress bar for page loading feedback -->
+        <div class="nanobar" id="top-progress-bar" style="position: fixed;">
+            <div class="bar"></div>
+        </div>
+        
+        <!-- ========================== -->
+        <!-- MAIN NAVIGATION CONTAINER -->
+        <!-- ========================== -->
+        <nav class="container-xl order-2 order-lg-1 grid gap-1">
+
+            <!-- ========================== -->
+            <!-- MOBILE MENU CONTROLS      -->
+            <!-- ========================== -->
+            
+            <!-- Left Sidebar Toggle - Mobile view only -->
+            <div class="bd-navbar-toggle">
+                <button class="navbar-toggler p-2" 
+                        type="button" 
+                        data-bs-toggle="offcanvas" 
+                        data-bs-target="#bdSidebar" 
+                        aria-controls="bdSidebar" 
+                        aria-label="Toggle navigation">
+                    <span class="bi bi-list"></span>
+                </button>
+            </div>
+
+            <!-- ========================== -->
+            <!-- BRAND AND HOME NAVIGATION -->
+            <!-- ========================== -->
+            <div class="container d-inline-flex text-center">
+                <!-- Home Navigation Button -->
+                {%- for home in site.data.navigation.home -%}
+                <a class="btn" href="{{ home.url | relative_url }}">
+                    <i class="{{ site.default_icon}} {{ home.icon }}"></i>
+                </a>
+                {% endfor %}
+                
+                <!-- Brand Logo Link to Root -->
+                <!-- Logo path configured in _config.yml -->
+                {% capture logo_path %}{{ site.logo }}{% endcapture %}
+                <a class="navbar-brand" href="{{ site.baseurl }}/">
+                    <img src="{{ logo_path | relative_url }}" alt="Logo" width="30" height="30">
+                </a>
+            </div>
+            
+            <!-- ========================== -->
+            <!-- SITE BRANDING SECTION     -->
+            <!-- ========================== -->
+            <!-- Site title and subtitle display -->
+            {% include core/branding.html %}
+    
+            <!-- ========================== -->
+            <!-- MAIN NAVIGATION MENU      -->
+            <!-- ========================== -->
+            <!-- Primary navigation items from _data/navigation.yml -->
+            {% include navigation/navbar.html %}
+
+            <!-- ========================== -->
+            <!-- UTILITY CONTROLS          -->
+            <!-- ========================== -->
+            
+            <!-- Settings Modal Toggle -->
+            <div class="btn"
+                data-bs-toggle="modal" 
+                data-bs-target="#info-section" 
+                aria-expanded="false" 
+                aria-controls="#info-section"
+                role="button">
+                <i type="button" class="{{site.default_icon}} bi-gear"></i>
+            </div>
+
+            <!-- Navigation Menu Toggle - Mobile view -->
+            <div class="bd-navbar-toggle">
+                <button class="navbar-toggler p-2" 
+                        type="button" 
+                        data-bs-toggle="offcanvas" 
+                        data-bs-target="#bdNavbar" 
+                        aria-controls="bdNavbar" 
+                        aria-label="Toggle navigation">
+                    <span class="bi bi-three-dots"></span>
+                </button>
+            </div>
+        </nav>
+    </div>
+</header>

data/_includes/landing/landing-install-cards.html

@@ -0,0 +1,52 @@
+<!-- Installation method cards; uses site.resources.* and environment where helpful -->
+<div class="row g-4 justify-content-center">
+  <div class="col-12 col-sm-10 col-md-6 col-lg-4">
+    <div class="card h-100 border-0 shadow-sm">
+      <div class="card-header bg-primary text-white">
+        <h5 class="card-title mb-0"><i class="bi bi-gem me-2"></i>Ruby Gem</h5>
+      </div>
+      <div class="card-body p-4 d-flex flex-column text-center">
+        <p class="card-text mb-3">Install the theme as a Ruby gem for classic Jekyll workflows.</p>
+        <pre class="bg-dark text-light p-3 rounded mb-3 small text-start overflow-auto"><code>gem install {{ site.resources.rubygems.name | default: 'zer0-mistakes' }}</code></pre>
+        <a class="btn btn-outline-primary btn-sm mt-auto" href="{{ site.resources.rubygems.url | default: '#' }}" target="_blank" rel="noopener">View on RubyGems</a>
+      </div>
+    </div>
+  </div>
+  
+  <div class="col-12 col-sm-10 col-md-6 col-lg-4">
+    <div class="card h-100 border-0 shadow-sm">
+      <div class="card-header bg-info text-white">
+        <h5 class="card-title mb-0"><i class="bi bi-box-seam me-2"></i>Docker Image</h5>
+      </div>
+      <div class="card-body p-4 d-flex flex-column text-center">
+        <p class="card-text mb-3">Run locally with zero Ruby setup using Docker.</p>
+        <pre class="bg-dark text-light p-3 rounded mb-3 small text-start overflow-auto"><code>docker pull {{ site.resources.docker.image | default: 'bamr87/zer0-mistakes' }}
+docker run -p 4000:4000 {{ site.resources.docker.image | default: 'bamr87/zer0-mistakes' }}</code></pre>
+        <a class="btn btn-outline-info btn-sm mt-auto" href="{{ site.resources.docker.hub_url | default: '#' }}" target="_blank" rel="noopener">View on Docker Hub</a>
+      </div>
+    </div>
+  </div>
+  
+  <div class="col-12 col-sm-10 col-md-6 col-lg-4">
+    <div class="card h-100 border-0 shadow-sm">
+      <div class="card-header bg-secondary text-white">
+        <h5 class="card-title mb-0"><i class="bi bi-git me-2"></i>Fork Repository</h5>
+      </div>
+      <div class="card-body p-4 d-flex flex-column text-center">
+        <p class="card-text mb-3">Improve the theme by forking the repo and opening a PR.</p>
+        <pre class="bg-dark text-light p-3 rounded mb-3 small text-start overflow-auto"><code>git clone {{ site.resources.github_repo | default: site.github.repository_url }}
+cd {{ site.local_repo | default: site.repository_name | default: 'repo' }}
+git remote add upstream {{ site.resources.github_repo | default: site.github.repository_url }}
+git checkout -b feature/your-change</code></pre>
+  <a class="btn btn-outline-secondary btn-sm mt-auto" href="{{ site.resources.github_fork | default: site.github.repository_url | append: '/fork' }}" target="_blank" rel="noopener">Fork on GitHub</a>
+      </div>
+    </div>
+  </div>
+</div>
+
+<!-- Contributing guide call-to-action placed below all cards -->
+<div class="text-center mt-4">
+  <a class="btn btn-outline-secondary" href="{{ site.resources.contributing | default: '#' }}" target="_blank" rel="noopener">
+    <i class="bi bi-journal-text me-2"></i>Read the Contributing Guide
+  </a>
+</div>

data/_includes/landing/landing-quick-links.html

@@ -0,0 +1,28 @@
+<!-- Quick Links bar for landing page; uses site.resources config -->
+<div class="bg-dark text-white py-3">
+  <div class="container-xl px-4 px-md-5">
+    <div class="row g-3 justify-content-center text-center align-items-center">
+      <div class="col-6 col-md-3 d-flex justify-content-center">
+        <a class="btn btn-outline-light btn-sm w-100" href="{{ site.resources.github_repo | default: site.github.repository_url | default: '/' }}" target="_blank" rel="noopener">
+          <i class="bi bi-github me-2"></i> GitHub
+        </a>
+      </div>
+      <div class="col-6 col-md-3 d-flex justify-content-center">
+        <a class="btn btn-outline-light btn-sm w-100" href="{{ site.resources.rubygems.url | default: '#' }}" target="_blank" rel="noopener">
+          <i class="bi bi-gem me-2"></i> RubyGems
+        </a>
+      </div>
+      <div class="col-6 col-md-3 d-flex justify-content-center">
+        <a class="btn btn-outline-light btn-sm w-100" href="{{ site.resources.docker.hub_url | default: '#' }}" target="_blank" rel="noopener">
+          <i class="bi bi-box-seam me-2"></i> Docker Hub
+        </a>
+      </div>
+      <div class="col-6 col-md-3 d-flex justify-content-center">
+        <a class="btn btn-outline-light btn-sm w-100" href="{{ site.resources.github_fork | default: site.github.repository_url | append: '/fork' }}" target="_blank" rel="noopener">
+          <i class="bi bi-git me-2"></i> Fork Project
+        </a>
+      </div>
+    </div>
+  </div>
+  
+</div>

data/_includes/navigation/navbar.html

@@ -0,0 +1,96 @@
+<!-- 
+    file: navbar.html
+    path: /includes/navbar.html
+    includes:
+    purpose: Offcanvas main navigation following Bootstrap 5 best practices
+ -->
+
+<!-- Navigation Links - Offcanvas -->
+<div class="offcanvas offcanvas-end col-lg-2" tabindex="-1" id="bdNavbar" aria-labelledby="mainNavOffcanvasLabel">
+
+    <!-- Main Navigation Header - Offcanvas -->
+    <div class="offcanvas-header border-bottom">
+        <h5 class="offcanvas-title" id="mainNavOffcanvasLabel">Main Navigation</h5>
+        <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close" data-bs-target="#bdNavbar"></button>
+    </div>
+
+    <!-- Main Navigation Body - Offcanvas -->
+    <div class="offcanvas-body">
+        <ul class="navbar-nav justify-content-lg-center text-start flex-grow-1">
+            {%- for link in site.data.navigation.main -%}
+                {%- assign has_children = link.sublinks and link.sublinks.size > 0 -%}
+
+                {%- if has_children -%}
+                    <li class="nav-item dropdown d-flex align-items-center">
+                        <!-- Parent link navigates directly -->
+                        <a
+                            class="nav-link"
+                            href="{{ link.url | relative_url }}"
+                            {%- if link.url == page.url -%} aria-current="page"{%- endif -%}
+                        >
+                            {{ link.title }}
+                        </a>
+
+                        <!-- Split toggle opens the dropdown -->
+                        <a
+                            class="nav-link dropdown-toggle dropdown-toggle-split ms-2"
+                            href="#"
+                            id="dropdown-{{ link.title | slugify }}"
+                            role="button"
+                            data-bs-toggle="dropdown"
+                            aria-expanded="false"
+                            aria-label="Toggle {{ link.title }} menu"
+                        >
+                            <span class="visually-hidden">Toggle dropdown</span>
+                        </a>
+
+                        <ul class="dropdown-menu dropdown-menu-start w-100" aria-labelledby="dropdown-{{ link.title | slugify }}">
+                            {%- for sublink in link.sublinks -%}
+                                <li>
+                                    <a
+                                        class="dropdown-item"
+                                        href="{{ sublink.url | relative_url }}"
+                                        {%- if sublink.url == page.url -%} aria-current="page"{%- endif -%}
+                                    >
+                                        {{ sublink.title }}
+                                    </a>
+                                </li>
+                            {%- endfor -%}
+                        </ul>
+                    </li>
+                {%- else -%}
+                    <li class="nav-item">
+                        <a
+                            class="nav-link"
+                            href="{{ link.url | relative_url }}"
+                            {%- if link.url == page.url -%} aria-current="page"{%- endif -%}
+                        >
+                            {{ link.title }}
+                        </a>
+                    </li>
+                {%- endif -%}
+            {%- endfor -%}
+        </ul>
+    </div>
+</div>
+
+<!-- Script to handle offcanvas navigation -->
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+    // Get all navigation links in the offcanvas
+    const offcanvasLinks = document.querySelectorAll('#bdNavbar .nav-link[href]:not(.dropdown-toggle), #bdNavbar .dropdown-item[href]');
+    
+    offcanvasLinks.forEach(link => {
+        link.addEventListener('click', function(e) {
+            // Allow the navigation to happen
+            // Then close the offcanvas after a brief delay
+            setTimeout(() => {
+                const offcanvas = bootstrap.Offcanvas.getInstance(document.getElementById('bdNavbar'));
+                if (offcanvas) {
+                    offcanvas.hide();
+                }
+            }, 100);
+        });
+    });
+});
+</script>

data/_includes/navigation/sidebar-left.html

@@ -0,0 +1,83 @@
+<!--
+  ===================================================================
+  SIDEBAR LEFT - Dynamic Navigation Sidebar
+  ===================================================================
+  
+  File: sidebar-left.html 
+  Path: _includes/sidebar-left.html
+  Purpose: Left sidebar navigation with multiple content modes including
+           dynamic page listing, category browsing, and manual navigation
+  
+  Template Logic:
+  - Responsive offcanvas sidebar for mobile devices
+  - Three navigation modes based on page.sidebar.nav:
+    * "dynamic": Auto-generated folder structure from pages
+    * "searchCats": Category-based navigation from site categories
+    * Manual: Predefined navigation from _data files
+  
+  Dependencies:
+  - sidebar-folders.html: Dynamic folder structure generation
+  - sidebar-categories.html: Category-based navigation
+  - nav_list.html: Manual navigation list rendering
+  - Bootstrap 5 offcanvas component
+  
+  Navigation Modes:
+  1. Dynamic: Scans site.pages for index.md files to build folder structure
+  2. Categories: Groups content by Jekyll categories
+  3. Manual: Uses predefined navigation from _data/navigation.yml
+  ===================================================================
+-->
+
+<!-- ================================ -->
+<!-- SIDEBAR NAVIGATION CONTAINER   -->
+<!-- ================================ -->
+<!-- Responsive offcanvas sidebar - full-width on mobile, fixed on desktop -->
+<div class="offcanvas-lg offcanvas-start" tabindex="-1" id="bdSidebar" aria-labelledby="bdSidebarOffcanvasLabel">
+
+  <!-- ========================== -->
+  <!-- SIDEBAR HEADER            -->
+  <!-- ========================== -->
+  <!-- Mobile-only header with close button -->
+  <div class="offcanvas-header border-bottom">
+    <h5 class="offcanvas-title" id="bdSidebarOffcanvasLabel">Browse docs</h5>
+    <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close" data-bs-target="#bdSidebar"></button>
+  </div>
+
+  <!-- ========================== -->
+  <!-- SIDEBAR CONTENT AREA      -->
+  <!-- ========================== -->
+  <!-- Scrollable content area with dynamic navigation options -->
+  <div class="offcanvas-body overflow-auto">
+
+    <!-- ========================== -->
+    <!-- DYNAMIC PAGE LISTING      -->
+    <!-- ========================== -->
+    <!-- Auto-generates folder structure from pages containing index.md -->
+    {% if page.sidebar.nav == "dynamic" %}
+    <div class="list-group" id="sidebar-content">
+      {% assign folders = site.pages | where_exp: "item", "item.path contains 'index.md'" | sort: 'path' %}
+      {% include navigation/sidebar-folders.html folders=folders %}
+    </div>
+
+    <!-- ========================== -->
+    <!-- CATEGORY-BASED NAVIGATION -->
+    <!-- ========================== -->
+    <!-- Creates navigation from Jekyll post/page categories -->
+    {% elsif page.sidebar.nav == "searchCats" %}
+    <div class="list-group" id="sidebar-content">
+      {% assign categories = site.categories | sort %}
+      {% include navigation/sidebar-categories.html categories=categories %}
+    </div>
+    
+    <!-- ========================== -->
+    <!-- MANUAL NAVIGATION LIST    -->
+    <!-- ========================== -->
+    <!-- Uses predefined navigation structure from _data files -->
+    {% elsif page.sidebar.nav %}
+    <nav class="w-100">
+      {% include navigation/nav_list.html nav=page.sidebar.nav %}
+    </nav>
+    {% endif %}
+    
+  </div>
+</div>

data/_includes/{sidebar-right.html → navigation/sidebar-right.html}

@@ -1,7 +1,7 @@
 <!-- 
   file: sidebar-right.html 
   path: _includes/sidebar-right.html
-  includes: nav_list.html, toc.html
+  includes: nav_list.html, content/toc.html
 -->
 
 <!-- TOC button in mobile view  -->
@@ -32,16 +32,9 @@
     <!-- TOC list -->
 
     <!-- TOC list -->
-      {% include toc.html sanitize=true html=content h_min=1 h_max=3 class="list-group-flush" item_class="list-group-item" anchor_class="" skip_no_ids=true %}
+      {% include content/toc.html sanitize=true html=content h_min=1 h_max=3 class="list-group-flush" item_class="list-group-item" anchor_class="" skip_no_ids=true %}
     </nav>
   </div>
 </div>
-  <!-- Back to Top -->
-  <div>
-    <button onclick="topFunction()" id="backToTopBtn" title="Go to top">
-      <span class="arrow">&uarr;</span>
-      <span class="text">Back to Top</span>
-    </button>
-  </div>
+   
 
-  

data/_layouts/README.md

@@ -15,6 +15,7 @@ root.html (base template)
 ├── home.html (homepage)
 ├── blog.html (blog homepage)
 ├── landing.html (landing pages)
+├── stats.html (statistics dashboard)
 └── index.html (search pages)
 ```
 
@@ -82,6 +83,13 @@ root.html (base template)
 - **Dependencies**: Search engine integration
 - **Usage**: Search results, site indexes
 
+#### `stats.html`
+
+- **Purpose**: Statistics and analytics dashboard
+- **Features**: Full-width responsive layout, modular statistics components
+- **Dependencies**: Bootstrap 5, Bootstrap Icons, Jekyll data files
+- **Usage**: Site analytics, content metrics, performance dashboards
+
 #### `javascript.html`
 
 - **Purpose**: JavaScript demonstration pages

data/_layouts/blog.html

@@ -82,7 +82,7 @@ source: "https://getbootstrap.com/docs/5.3/examples/blog/#"
     <div class="nav-scroller py-1 mb-3 border-bottom">
         <nav class="nav nav-underline justify-content-between">
             {% for item in site.data.navigation.posts %}
-                <a class="nav-item nav-link link-body-emphasis" href="{{ item.url }}">
+                <a class="nav-item nav-link link-body-emphasis" href="{{ item.url | relative_url }}">
                     {{ item.title }}
                 </a>
             {% endfor %}
@@ -257,7 +257,7 @@ source: "https://getbootstrap.com/docs/5.3/examples/blog/#"
 
                 <!-- Categories Section -->
                 <div class="p-4">
-                    {% include sidebar-categories.html %}
+                    {% include navigation/sidebar-categories.html %}
                 </div>
 
                 <!-- External Links Section -->

data/_layouts/default.html

@@ -54,7 +54,7 @@ layout: root
     <!-- ================================ -->
     <!-- Site navigation, content outline, and offcanvas menu for mobile -->
     <aside class="bd-sidebar">
-        {% include sidebar-left.html %}
+        {% include navigation/sidebar-left.html %}
     </aside>
     
     <!-- ================================ -->
@@ -64,14 +64,14 @@ layout: root
     <main class="bd-main order-1" data-spy="scroll" data-bs-target="toc-content" data-offset="0">
 
         <!-- Page introduction: title, breadcrumbs, metadata -->
-        {% include intro.html %}
+        {% include content/intro.html %}
 
         <!-- =============================== -->
         <!-- RIGHT SIDEBAR - Table of Contents -->
         <!-- =============================== -->
         <!-- Page outline, shortcuts, and related links (hidden on mobile) -->
         <div class="bd-toc text-body-secondary">
-            {% include sidebar-right.html %}
+            {% include navigation/sidebar-right.html %}
         </div>
         
         <!-- =============================== -->