jekyll-theme-zer0 1.26.0 → 1.28.0

data/_layouts/404.html

@@ -0,0 +1,260 @@
+---
+# Feature: ZER0-047
+layout: root
+---
+<!--
+  ===================================================================
+  404 LAYOUT - Not-found page with unconfigured-site setup mode
+  ===================================================================
+
+  File: 404.html
+  Path: _layouts/404.html
+  Inherits: root.html
+  Purpose: Full 404 experience as a THEME layout so consumer sites only
+           vendor a tiny stub. Jekyll cannot deliver root pages from a
+           (remote) theme, but it can deliver layouts — a consumer's
+           /404.html shrinks to:
+
+             ---
+             permalink: /404.html
+             layout: "404"
+             sitemap: false
+             ---
+
+  Behavior:
+  - Unconfigured site (per components/setup-check.html): step-by-step
+    setup guide, branded with site.title when set.
+  - Configured site: standard 404 with search, existence-checked quick
+    links, and an optional GitHub issue shortcut.
+
+  Extra content: anything in the stub page's body renders below the
+  standard 404 content ({{ content }} at the bottom).
+  ===================================================================
+-->
+
+{% include components/setup-check.html %}
+
+{% if site_needs_setup %}
+<!-- ================================================================== -->
+<!-- SETUP MODE: Site is not yet configured — guide the user            -->
+<!-- ================================================================== -->
+<div class="container-lg py-5">
+  <div class="text-center mb-5">
+    <i class="bi bi-gear-wide-connected display-1 text-primary"></i>
+    <h1 class="display-4 fw-bold mt-3">Welcome to {{ site.title | default: "your new site" }}</h1>
+    <p class="lead text-body-secondary">
+      Your site is live but needs a little configuration.
+      Follow the steps below to make it yours.
+    </p>
+  </div>
+
+  <!-- Quick-detect: user site vs project site -->
+  <div class="row justify-content-center mb-4">
+    <div class="col-lg-8">
+      <div class="alert alert-info d-flex align-items-start" role="alert">
+        <i class="bi bi-info-circle-fill me-3 fs-4 mt-1"></i>
+        <div>
+          <strong>Detected deployment type:</strong>
+          {% if site_is_user_repo %}
+            <span class="badge bg-success">User / Org Site</span>
+            <code>{{ site.url }}</code>
+            <br><small>Your site resolves at the root — <code>baseurl</code> should be <code>""</code>.</small>
+          {% else %}
+            <span class="badge bg-warning text-dark">Project Site</span>
+            <code>{{ site.url }}{{ site.baseurl }}</code>
+            <br><small>Your site lives under a subpath — <code>baseurl</code> should be <code>"{{ site.baseurl | default: '/your-repo' }}"</code>.</small>
+          {% endif %}
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Step-by-step setup instructions -->
+  <div class="row justify-content-center">
+    <div class="col-lg-8">
+
+      <div class="card mb-4 border-primary">
+        <div class="card-header bg-primary text-white">
+          <i class="bi bi-1-circle me-2"></i>Step 1 — Update <code class="text-white">_config.yml</code>
+        </div>
+        <div class="card-body">
+          <p>Open <code>_config.yml</code> in your repository and update these essential fields:</p>
+<pre class="bg-dark text-light p-3 rounded"><code># ── Site Identity
+title:       "Your Site Name"
+description: "A short description of your site"
+founder:     "Your Name"
+email:       "you@example.com"
+
+# ── GitHub
+github_user:      "{{ 'your-username' }}"
+repository_name:  "{{ 'your-repo' }}"
+
+# ── URLs &amp; Deployment
+{% if site_is_user_repo -%}
+# User/Org site (username.github.io)
+url:      "https://your-username.github.io"
+baseurl:  ""
+{%- else -%}
+# Project site (username.github.io/repo-name)
+url:      "https://your-username.github.io"
+baseurl:  "/your-repo-name"
+{%- endif %}
+
+remote_theme: "bamr87/zer0-mistakes"
+
+# ── Mark as configured (removes this setup page)
+site_configured: true</code></pre>
+        </div>
+      </div>
+
+      <div class="card mb-4">
+        <div class="card-header">
+          <i class="bi bi-2-circle me-2"></i>Step 2 — Add a Home Page
+        </div>
+        <div class="card-body">
+          <p>If you don't have one yet, create <code>pages/index.html</code> (or <code>index.md</code>) with:</p>
+<pre class="bg-dark text-light p-3 rounded"><code>---
+layout: home
+title: Home
+---
+
+Welcome to my site!</code></pre>
+        </div>
+      </div>
+
+      <div class="card mb-4">
+        <div class="card-header">
+          <i class="bi bi-3-circle me-2"></i>Step 3 — Commit &amp; Push
+        </div>
+        <div class="card-body">
+<pre class="bg-dark text-light p-3 rounded"><code>git add _config.yml pages/index.html
+git commit -m "feat: configure site identity and home page"
+git push origin main</code></pre>
+          <p class="mb-0 mt-2">
+            GitHub Pages will rebuild your site automatically. Within a few
+            minutes, your configured site will be live.
+          </p>
+        </div>
+      </div>
+
+      <div class="card mb-4 border-secondary">
+        <div class="card-header">
+          <i class="bi bi-lightbulb me-2"></i>Optional — Advanced Setup
+        </div>
+        <div class="card-body">
+          <div class="row g-3">
+            <div class="col-md-6">
+              <h6><i class="bi bi-palette me-1"></i> Personalization</h6>
+              <p class="small text-body-secondary mb-0">
+                Customise colors, navigation, analytics, and more.
+              </p>
+              <a href="{{ '/quickstart/personalization/' | relative_url }}" class="btn btn-sm btn-outline-primary mt-2">Personalization Guide</a>
+            </div>
+            <div class="col-md-6">
+              <h6><i class="bi bi-collection me-1"></i> Content Collections</h6>
+              <p class="small text-body-secondary mb-0">
+                Set up posts, docs, quests, and more content types.
+              </p>
+              <a href="{{ '/quickstart/' | relative_url }}" class="btn btn-sm btn-outline-primary mt-2">Quick Start Guide</a>
+            </div>
+          </div>
+          {% if jekyll.environment == "development" %}
+          <hr>
+          <p class="mb-0 small">
+            <i class="bi bi-tools me-1"></i>
+            <strong>Dev mode:</strong> You can use the
+            <a href="{{ '/setup/' | relative_url }}">interactive Setup Wizard</a>
+            to generate your config file.
+          </p>
+          {% endif %}
+        </div>
+      </div>
+
+      <!-- Resources -->
+      <div class="text-center mt-4">
+        <a href="https://github.com/bamr87/zer0-mistakes" class="btn btn-dark me-2" target="_blank" rel="noopener">
+          <i class="bi bi-github me-1"></i> Theme Repository
+        </a>
+        <a href="https://github.com/bamr87/zer0-mistakes/blob/main/README.md" class="btn btn-outline-secondary me-2" target="_blank" rel="noopener">
+          <i class="bi bi-book me-1"></i> Documentation
+        </a>
+        <a href="https://github.com/bamr87/zer0-mistakes/issues" class="btn btn-outline-danger" target="_blank" rel="noopener">
+          <i class="bi bi-bug me-1"></i> Report Issue
+        </a>
+      </div>
+
+    </div>
+  </div>
+</div>
+
+{% else %}
+<!-- ================================================================== -->
+<!-- NORMAL 404: Site is configured — show standard error page          -->
+<!-- ================================================================== -->
+<div class="container text-center mt-5">
+  <h1 class="display-1 text-danger">404</h1>
+
+  <p class="h4 mt-4"><strong>Page not found 😿</strong></p>
+  <p class="lead">The requested page could not be found.</p>
+
+  <div class="my-4">
+    <p class="h5">Try searching for what you are looking for:</p>
+    <button class="btn btn-danger" type="button" data-search-toggle aria-label="Open search">
+      <i class="bi bi-search me-1"></i> Search
+    </button>
+  </div>
+
+  <div class="my-4">
+    <p class="h5">Or navigate to one of these pages:</p>
+    <div class="nav justify-content-center">
+      {% assign _404_candidates = "Home,/|About,/about/|Contact,/contact/" | split: "|" %}
+      {% for entry in _404_candidates %}
+        {% assign _parts = entry | split: "," %}
+        {% assign _label = _parts[0] %}
+        {% assign _url   = _parts[1] %}
+        {% assign _page  = site.html_pages | where: "url", _url | first %}
+        {% unless _page %}
+          {% for col in site.collections %}
+            {% assign _page = col.docs | where: "url", _url | first %}
+            {% if _page %}{% break %}{% endif %}
+          {% endfor %}
+        {% endunless %}
+        {% if _page or _url == "/" %}
+          <a class="nav-link" href="{{ _url | relative_url }}">{{ _label }}</a>
+        {% endif %}
+      {% endfor %}
+    </div>
+  </div>
+
+  <a class="btn btn-danger mt-4" href="{{ '/' | relative_url }}">Return to Homepage</a>
+  {% if site.github_user and site.repository_name %}
+  <div class="mt-3">
+    {% capture _issue_title %}404 Error{% endcapture %}
+    {% capture _issue_body %}I encountered a 404 error on this site. Please investigate.{% endcapture %}
+    <a id="github-issue-link"
+       class="btn btn-secondary"
+       href="https://github.com/{{ site.github_user }}/{{ site.repository_name }}/issues/new?title={{ _issue_title | uri_escape }}&body={{ _issue_body | uri_escape }}"
+       target="_blank"
+       rel="noopener noreferrer">
+      Submit an Issue on GitHub
+    </a>
+  </div>
+  <script>
+    document.addEventListener('DOMContentLoaded', function() {
+      var githubIssueLink = document.getElementById('github-issue-link');
+      if (!githubIssueLink) return;
+      var currentUrl = window.location.href;
+      var repoSlug = '{{ site.github_user }}/{{ site.repository_name }}';
+      githubIssueLink.href = 'https://github.com/' + repoSlug + '/issues/new?title=' + encodeURIComponent('404 Error on ' + currentUrl) + '&body=' + encodeURIComponent('I encountered a 404 error on the following page: ' + currentUrl + '. Please investigate.');
+    });
+  </script>
+  {% endif %}
+</div>
+{% endif %}
+
+{% if content != blank %}
+<!-- Extra content from the consumer's 404 stub body -->
+<div class="container mt-4">
+  {{ content }}
+</div>
+{% endif %}

data/_layouts/README.md

@@ -16,6 +16,8 @@ root.html (base template)
 ├── home.html (homepage)
 ├── news.html (news homepage - magazine/grid/list styles)
 ├── landing.html (landing pages)
+├── book.html (book landing page - cover hero + table of contents)
+├── book-story.html (immersive picture-book story pages)
 ├── stats.html (statistics dashboard)
 └── index.html (search pages)
 ```

data/_layouts/article.html

@@ -15,6 +15,9 @@ layout: default
   Front Matter Variables:
   - post_type: Article type (standard, featured, breaking, opinion, review, tutorial, listicle, interview)
   - sidebar: Override sidebar visibility (true/false)
+  - show_hero: Opt into the top-of-article hero image (page.preview) for any
+    post_type without changing layout/sidebar/badges (true; featured and
+    breaking posts show the hero automatically)
   
   Post Type Variations:
   - standard (default): Normal article with sidebar
@@ -221,12 +224,15 @@ layout: default
     preview image is set. Breaking stories were previously skipped because the
     condition checked only post_type == "featured"; since breaking is mapped
     before featured (see top of file), breaking+featured posts showed no hero.
+    Any other post type can opt in with `show_hero: true` in front matter —
+    this flips only the hero, leaving sidebar, typography, and badges at their
+    post_type defaults (issue #303).
     Nested ifs keep the "only when page.preview exists" guard intact (Liquid has
     no parentheses, so a flat `a or b and c` would misgroup).
   {% endcomment %}
   {% assign show_hero = false %}
   {% if page.preview %}
-    {% if post_type == "featured" or post_type == "breaking" %}
+    {% if post_type == "featured" or post_type == "breaking" or page.show_hero %}
       {% assign show_hero = true %}
     {% endif %}
   {% endif %}

data/_layouts/book-abc.html

@@ -0,0 +1,106 @@
+---
+# Feature: ZER0-081
+layout: root
+---
+{%- comment -%}
+  Layout: book-abc.html
+  Extends: root.html
+  Purpose: Immersive single-scroll toddler ABC / alphabet "board book". One big
+           friendly letter per card — a picture, the word, and a read-aloud line
+           — built entirely from an `alphabet:` front-matter list (no per-letter
+           pages). Generated by the zer0-CMS ABC wizard.
+  Front matter required: layout, title, book (slug), alphabet (list of
+    {letter, word, tagline, image, alt, prompt, status})
+  Front matter optional: subtitle, series, audience, art_style (maps to a
+    abc-style--<id> skin), art_style_prompt, palette, cover_image, generator
+  Notes: Extends root directly (like book.html) for a sidebar-free surface.
+         Each card is anchored (#letter-a … #letter-z) for deep links.
+{%- endcomment -%}
+
+{%- assign _series = site.data.series[page.series] -%}
+{%- assign _cover = page.cover_image | default: page.preview -%}
+{%- assign _first = page.alphabet | first -%}
+
+<article class="book-abc" itemscope itemtype="https://schema.org/Book">
+  <!-- ================================ -->
+  <!-- COVER HERO                       -->
+  <!-- ================================ -->
+  <header class="book-hero zer0-bg-hero py-5">
+    <div class="container-xl">
+      <div class="row g-5 align-items-center justify-content-center">
+        {%- if _cover -%}
+        <div class="col-8 col-sm-6 col-md-4 col-lg-3">
+          <div class="book-hero-cover mx-auto">
+            <div class="book-cover-frame">
+              {%- include components/preview-image.html src=_cover alt=page.title class="" loading="eager" -%}
+            </div>
+          </div>
+        </div>
+        {%- endif -%}
+        <div class="col-md-8 col-lg-7 text-center text-md-start">
+          {%- if _series -%}
+          <a class="badge text-bg-primary text-decoration-none mb-2" href="{{ '/books/' | relative_url }}#series-{{ page.series }}">
+            <i class="bi {{ _series.icon | default: 'bi-type' }} me-1" aria-hidden="true"></i>{{ _series.title | escape }}
+          </a>
+          {%- endif -%}
+          <h1 id="page-title" class="book-hero-title display-4 fw-bold" itemprop="name">{{ page.title }}</h1>
+          {%- if page.subtitle -%}
+          <p class="lead" itemprop="alternativeHeadline">{{ page.subtitle }}</p>
+          {%- endif -%}
+          <p class="text-body-secondary small mb-4">
+            <i class="bi bi-type me-1" aria-hidden="true"></i>{{ page.alphabet | size }} letters
+            {%- if page.audience %} <span class="mx-1" aria-hidden="true">•</span> {{ page.audience }}{% endif -%}
+          </p>
+          {%- assign _body = content | strip -%}
+          {%- if _body != "" -%}
+          <div class="fs-5" itemprop="abstract">{{ content }}</div>
+          {%- endif -%}
+          {%- if _first -%}
+          <a class="btn btn-primary btn-lg mt-2" href="#letter-{{ _first.letter | downcase }}">
+            <i class="bi bi-book-half me-2" aria-hidden="true"></i>Start at {{ _first.letter }}
+          </a>
+          {%- endif -%}
+        </div>
+      </div>
+    </div>
+  </header>
+
+  <div class="container-xl py-5">
+
+    <!-- ================================ -->
+    <!-- A–Z QUICK JUMP                   -->
+    <!-- ================================ -->
+    <nav class="abc-jump" aria-label="Jump to a letter">
+      {%- for _e in page.alphabet -%}
+      <a class="abc-jump-link" href="#letter-{{ _e.letter | downcase }}">{{ _e.letter }}</a>
+      {%- endfor -%}
+    </nav>
+
+    <!-- ================================ -->
+    <!-- THE ALPHABET BOARD               -->
+    <!-- ================================ -->
+    <div class="abc-board abc-style--{{ page.art_style | default: 'isometric-tech-toy' }}">
+      {%- for _e in page.alphabet -%}
+        {%- include components/abc-letter.html entry=_e -%}
+      {%- endfor -%}
+    </div>
+
+    <!-- ================================ -->
+    <!-- AI COLOPHON                      -->
+    <!-- ================================ -->
+    {%- if page.art_style_prompt or page.generator -%}
+    <aside class="book-colophon card border-0 bg-body-tertiary mt-5 mx-auto" style="max-width: var(--zer0-book-measure);">
+      <div class="card-body">
+        <h2 class="h6 mb-2"><i class="bi bi-stars me-2" aria-hidden="true"></i>How this book was made</h2>
+        {%- if page.generator -%}
+        <p class="small text-body-secondary mb-2">{{ page.generator }}</p>
+        {%- endif -%}
+        {%- if page.art_style_prompt -%}
+        <p class="small text-body-secondary mb-0"><strong>Art style ({{ page.art_style }}):</strong> {{ page.art_style_prompt }}</p>
+        {%- endif -%}
+      </div>
+    </aside>
+    {%- endif -%}
+
+  </div>
+</article>

data/_layouts/book-story.html

@@ -0,0 +1,91 @@
+---
+# Feature: ZER0-080
+layout: root
+---
+{%- comment -%}
+  Layout: book-story.html
+  Extends: root.html
+  Purpose: Immersive picture-book reading page for one story/chapter — big
+           friendly type, illustration plates, prev/next story navigation,
+           and a collapsed illustration-prompt colophon.
+  Front matter required: layout, title, book (slug), chapter (number)
+  Front matter optional: chapter_label (e.g. "January"), description, preview,
+    illustrations (list of {beat, title, prompt, image}), the_end (false to
+    hide the closing flourish), comments
+  Notes: Extends root directly for a sidebar-free reading surface. Prev/next
+         come from numeric `chapter:` ordering via components/book-nav.html.
+{%- endcomment -%}
+
+{%- assign _slug = page.book -%}
+{%- assign _book_page = site.books | where: "book", _slug | where: "layout", "book" | first -%}
+
+<article class="book-story container-xl py-4 py-md-5" itemscope itemtype="https://schema.org/Chapter">
+  <!-- ================================ -->
+  <!-- STORY HEADER                     -->
+  <!-- ================================ -->
+  <header class="book-story-header text-center mb-4 mb-md-5">
+    {%- if _book_page -%}
+    <nav aria-label="Book">
+      <a class="text-decoration-none small" href="{{ _book_page.url | relative_url }}">
+        <i class="bi bi-book me-1" aria-hidden="true"></i>{{ _book_page.title }}
+      </a>
+    </nav>
+    {%- endif -%}
+    {%- if page.chapter_label -%}
+    <p class="text-uppercase small text-body-secondary mt-2 mb-1">{{ page.chapter_label }}</p>
+    {%- endif -%}
+    <h1 id="page-title" class="book-hero-title display-5 fw-bold" itemprop="name">{{ page.title }}</h1>
+    {%- if page.description -%}
+    <p class="lead text-body-secondary mx-auto" style="max-width: 42rem;">{{ page.description }}</p>
+    {%- endif -%}
+  </header>
+
+  <!-- ================================ -->
+  <!-- STORY BODY                       -->
+  <!-- ================================ -->
+  <div class="book-story-content" itemprop="text">
+    {{ content }}
+  </div>
+
+  {%- unless page.the_end == false -%}
+  <p class="book-the-end fs-4 mt-5">The End</p>
+  {%- endunless -%}
+
+  <!-- ================================ -->
+  <!-- STORY NAVIGATION                 -->
+  <!-- ================================ -->
+  {%- if page.chapter -%}
+    {%- include components/book-nav.html book=_slug chapter=page.chapter -%}
+  {%- endif -%}
+
+  <!-- ================================ -->
+  <!-- ILLUSTRATION COLOPHON            -->
+  <!-- ================================ -->
+  {%- if page.illustrations and page.illustrations.size > 0 -%}
+  <details class="book-colophon mt-4">
+    <summary class="small"><i class="bi bi-stars me-1" aria-hidden="true"></i>How the illustrations in this story were made</summary>
+    <div class="mt-3 d-flex flex-column gap-3">
+      {%- for _ill in page.illustrations -%}
+      <div class="book-colophon-prompt">
+        <p class="mb-1 fw-semibold">
+          {%- if _ill.beat -%}{{ _ill.beat }}{%- if _ill.title %} — {% endif -%}{%- endif -%}
+          {{- _ill.title -}}
+          {%- if _ill.image == nil or _ill.status == "planned" %} <span class="badge text-bg-secondary ms-1">not yet generated</span>{% endif -%}
+        </p>
+        <p class="mb-0">{{ _ill.prompt | escape }}</p>
+      </div>
+      {%- endfor -%}
+    </div>
+  </details>
+  {%- endif -%}
+
+  <!-- ================================ -->
+  <!-- COMMENTS                         -->
+  <!-- ================================ -->
+  {%- if page.comments and site.giscus.enabled -%}
+  <section class="post-comments mt-5 pt-4 border-top" id="comments">
+    <h2 class="h4 mb-4"><i class="bi bi-chat-dots me-2" aria-hidden="true"></i>Comments</h2>
+    {%- include content/giscus.html -%}
+  </section>
+  {%- endif -%}
+</article>

data/_layouts/book.html

@@ -0,0 +1,113 @@
+---
+# Feature: ZER0-080
+layout: root
+---
+{%- comment -%}
+  Layout: book.html
+  Extends: root.html
+  Purpose: Landing page for one book in the `books` collection — cover hero,
+           synopsis, table of contents, and an AI-provenance colophon.
+  Front matter required: layout, title, book (slug shared with its chapters)
+  Front matter optional: subtitle, author, illustrator, audience, synopsis,
+    cover_image, back_cover_image, illustration_style, status
+  Notes: Extends root directly (like landing.html) for an immersive,
+         sidebar-free presentation. Chapters are books-collection docs whose
+         `book:` matches and that set a numeric `chapter:`.
+{%- endcomment -%}
+
+{%- assign _slug = page.book | default: page.slug -%}
+{%- assign _chapters = site.books | where: "book", _slug | where_exp: "doc", "doc.chapter" | sort: "chapter" -%}
+{%- assign _first_chapter = _chapters | first -%}
+{%- assign _cover = page.cover_image | default: page.preview -%}
+
+<article class="book-landing" itemscope itemtype="https://schema.org/Book">
+  <!-- ================================ -->
+  <!-- COVER HERO                       -->
+  <!-- ================================ -->
+  <header class="book-hero zer0-bg-hero py-5">
+    <div class="container-xl">
+      <div class="row g-5 align-items-center justify-content-center">
+        {%- if _cover -%}
+        <div class="col-8 col-sm-6 col-md-4 col-lg-3">
+          <div class="book-hero-cover mx-auto">
+            <div class="book-cover-frame">
+              {%- include components/preview-image.html src=_cover alt=page.title class="" loading="eager" -%}
+            </div>
+          </div>
+        </div>
+        {%- endif -%}
+        <div class="col-md-8 col-lg-7 text-center text-md-start">
+          {%- if page.status and page.status != "complete" -%}
+          <span class="badge text-bg-warning mb-2">{{ page.status | capitalize }}</span>
+          {%- endif -%}
+          <h1 id="page-title" class="book-hero-title display-4 fw-bold" itemprop="name">{{ page.title }}</h1>
+          {%- if page.subtitle -%}
+          <p class="lead" itemprop="alternativeHeadline">{{ page.subtitle }}</p>
+          {%- endif -%}
+          <p class="text-body-secondary mb-1">
+            {%- if page.author -%}<span itemprop="author">{{ page.author }}</span>{%- endif -%}
+            {%- if page.illustrator %} <span class="mx-1" aria-hidden="true">•</span> Illustrated by {{ page.illustrator }}{%- endif -%}
+          </p>
+          <p class="text-body-secondary small mb-4">
+            <i class="bi bi-book me-1" aria-hidden="true"></i>{{ _chapters.size }} {% if _chapters.size == 1 %}story{% else %}stories{% endif %}
+            {%- if page.audience %} <span class="mx-1" aria-hidden="true">•</span> {{ page.audience }}{% endif -%}
+          </p>
+          {%- if page.synopsis -%}
+          <p class="fs-5" itemprop="abstract">{{ page.synopsis }}</p>
+          {%- endif -%}
+          {%- if _first_chapter -%}
+          <a class="btn btn-primary btn-lg mt-2" href="{{ _first_chapter.url | relative_url }}">
+            <i class="bi bi-book-half me-2" aria-hidden="true"></i>Start reading
+          </a>
+          {%- endif -%}
+        </div>
+      </div>
+    </div>
+  </header>
+
+  <div class="container-xl py-5">
+    <div class="row justify-content-center">
+      <div class="col-lg-9 col-xl-8">
+
+        <!-- ================================ -->
+        <!-- ABOUT THIS BOOK (page body)      -->
+        <!-- ================================ -->
+        {%- assign _body = content | strip -%}
+        {%- if _body != "" -%}
+        <section class="book-about mb-5">
+          {{ content }}
+        </section>
+        {%- endif -%}
+
+        <!-- ================================ -->
+        <!-- TABLE OF CONTENTS                -->
+        <!-- ================================ -->
+        {%- include components/book-toc.html book=_slug -%}
+
+        <!-- ================================ -->
+        <!-- AI COLOPHON                      -->
+        <!-- ================================ -->
+        {%- if page.illustration_style or page.generator -%}
+        <aside class="book-colophon card border-0 bg-body-tertiary mt-5">
+          <div class="card-body">
+            <h2 class="h6 mb-2"><i class="bi bi-stars me-2" aria-hidden="true"></i>How this book was made</h2>
+            {%- if page.generator -%}
+            <p class="small text-body-secondary mb-2">{{ page.generator }}</p>
+            {%- endif -%}
+            {%- if page.illustration_style -%}
+            <p class="small text-body-secondary mb-0"><strong>Illustration style:</strong> {{ page.illustration_style }}</p>
+            {%- endif -%}
+          </div>
+        </aside>
+        {%- endif -%}
+
+        {%- if page.back_cover_image -%}
+        <figure class="book-plate mt-5">
+          {%- include components/preview-image.html src=page.back_cover_image alt="Back cover" class="book-plate-img" -%}
+        </figure>
+        {%- endif -%}
+
+      </div>
+    </div>
+  </div>
+</article>

data/_layouts/collection.html

@@ -53,13 +53,25 @@ layout: default
 <!-- ========================== -->
 <!-- COLLECTION DATA PROCESSING -->
 <!-- ========================== -->
-<!-- Extract and sort collection entries based on page configuration -->
+<!-- Extract and sort collection entries based on page configuration.
+
+     Jekyll sets page.collection automatically for a document inside a
+     collection, but a standalone page can also select this layout in its front
+     matter. When it does — or when it names a collection the site does not
+     declare — site[page.collection] is nil, and `sort` on nil raises
+     "Cannot sort a null object.", which aborts the ENTIRE build rather than
+     just this page. Resolve to an empty list instead so one misconfigured page
+     cannot take the site down. -->
 {% assign entries = site[page.collection] %}
-{% assign entries = entries | sort: page.sort_order %}
+{% if entries %}
+    {% assign entries = entries | sort: page.sort_order %}
 
-<!-- Handle reverse sorting if specified -->
-{% if page.sort_order == 'reverse' %}
-    {% assign entries = entries | reverse %}
+    <!-- Handle reverse sorting if specified -->
+    {% if page.sort_order == 'reverse' %}
+        {% assign entries = entries | reverse %}
+    {% endif %}
+{% else %}
+    {% assign entries = "" | split: "" %}
 {% endif %}
 
 <!-- ========================== -->

data/_layouts/default.html

@@ -86,8 +86,10 @@ layout: root
     <!-- ================================ -->
     <!-- MAIN CONTENT AREA               -->
     <!-- ================================ -->
-    <!-- Primary content section with scroll spy for table of contents navigation -->
-    <main class="bd-main order-1" data-bs-spy="scroll" data-bs-target="#TableOfContents" data-bs-offset="100" data-bs-smooth-scroll="true">
+    <!-- Primary content section with scroll spy for table of contents navigation.
+         Not a <main>: root.html already provides the single <main id="main-content">
+         landmark; a nested <main> here would duplicate it (issue #299). -->
+    <div class="bd-main order-1" data-bs-spy="scroll" data-bs-target="#TableOfContents" data-bs-offset="100" data-bs-smooth-scroll="true">
 
         {%- comment -%}
           Page introduction: title, breadcrumbs, metadata.
@@ -129,5 +131,5 @@ layout: root
               {% include content/backlinks.html %}
             {% endif %}
         </div>
-      </main>
+      </div>
     </div>