Add corporate and nitro themes, inline theme banners, code palette sets

- Two new themes (corporate light/dark, nitro racing) and a purple retune; theme banner SVGs moved to pagerite/themes/, inlined by the backend, recolored per scheme via CSS classes, with scroll parallax. - pygments.css maps tokens onto --code-* variables; light and dark palette sets in the base stylesheet resolve via light-dark() from the theme's color-scheme; themes just pick a set or retint --code-bg. - Sidebar omitted unless the section has at least two published items; fetch-navigation and the site editor handle it appearing/disappearing. - Floated figures keep captions below at 30% of the text column; h1/h2 clear floats so images never overflow into the next section. - Links use --link (color-mix of text and accent), weight 500, no underlines; hover goes full accent.
2026-08-17 19:16:45 +00:00
parent dcd1e5afc9
commit c0bb3b73c1
16 changed files with 1055 additions and 177 deletions
@@ -20,7 +20,9 @@
    });
  }

-  const REGIONS = ["page-banner", "nav", "sidebar", "main"];
+  // Regions every page has. #sidebar is NOT among them: it is omitted
+  // entirely when the section has no sub-navigation, and handled below.
+  const REGIONS = ["page-banner", "nav", "main"];
  const reduceMotion = matchMedia("(prefers-reduced-motion: reduce)");
  let editorModule = null;

@@ -235,6 +237,27 @@
    currentPath = location.pathname;
  });

+  // --- Banner parallax ----------------------------------------------------
+  // The banner artwork stays windowed in place while its contents drift
+  // against the scroll. The --pry scroll parameter is also available to
+  // themes for their own effects (e.g. the purple sun rising faster than
+  // the drift). Event-driven only: perfectly still when the page is idle.
+  if (!reduceMotion.matches) {
+    let ticking = false;
+    const drift = () => {
+      ticking = false;
+      document.documentElement.style.setProperty(
+        "--pry", `${Math.min(scrollY * 0.1, 30)}px`,
+      );
+    };
+    addEventListener("scroll", () => {
+      if (!ticking) {
+        ticking = true;
+        requestAnimationFrame(drift);
+      }
+    }, { passive: true });
+  }
+
  // --- Fetch navigation ------------------------------------------------
  async function load(url, push = true, back = false) {
    // Navigating with the editor open closes it; unsaved edits are lost
@@ -264,6 +287,18 @@
        const el = document.getElementById(id);
        el.replaceWith(document.importNode(doc.getElementById(id), true));
      }
+      // #sidebar is omitted entirely when the section has no
+      // sub-navigation, so it may be absent on either side of the swap:
+      // replace, insert (as #main's preceding sibling), or remove.
+      const oldSidebar = document.getElementById("sidebar");
+      const newSidebar = doc.getElementById("sidebar");
+      if (oldSidebar && newSidebar) {
+        oldSidebar.replaceWith(document.importNode(newSidebar, true));
+      } else if (newSidebar) {
+        document.getElementById("main").before(document.importNode(newSidebar, true));
+      } else if (oldSidebar) {
+        oldSidebar.remove();
+      }
      // Site-wide custom CSS lives in <head id="pagerite-user"> and must be
      // kept in sync across fetch-navigations. It is kept last in <head>:
      // in dev Vite injects the base stylesheet after the server-rendered