jekyll-theme-zer0 1.19.1 → 1.20.2

data/_sass/layouts/_global-chrome.scss

@@ -0,0 +1,59 @@
+// ============================================================================
+
+// Global page chrome — base element resets + sticky/shadow/min-height helpers
+
+// ----------------------------------------------------------------------------
+
+// Extracted from custom.scss (Phase 5). Imported via the custom.scss barrel at
+
+// its original position so the cascade is unchanged.
+
+// ============================================================================
+
+html, body {
+    max-width: 100%;
+  }
+
+  // Theme-wide horizontal-overflow safety net.
+  // A stray wide element (an unwrapped Bootstrap `.row`, a long code token, a
+  // markdown table) creates a horizontal page scrollbar. Because the header is
+  // `position: fixed` it only spans the viewport, so any page-level h-scroll
+  // makes the navbar look "cut off" on the right. `overflow-x: clip` removes
+  // that scrollbar at the root WITHOUT breaking `position: sticky` descendants
+  // (the docs sidebar / TOC) the way `overflow-x: hidden` would — clip does not
+  // create a scroll container. Genuinely wide content (tables, code blocks)
+  // keeps its own local `overflow-x: auto` so nothing is hidden by this clip.
+  html {
+    overflow-x: clip;
+  }
+
+  * {
+    box-sizing: border-box;
+  }
+  
+.make-me-sticky {
+    position: -webkit-sticky;
+	position: sticky;
+	top: 0;
+    padding: 0 15px;
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.bottom-shadow {
+    // background-color: rgba(255,255,255,0.95);
+    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .35), inset 0 -1px 0 rgba(0, 0, 0, .15);
+}
+
+// Vendored Bootstrap build may omit vh utilities; landing hero uses this for stable min height
+.min-vh-50 {
+    min-height: 50vh;
+}
+
+// MOVED → _sass/layouts/_landing.scss (token-aware version)
+// Retained shim: keeps the inline-loading aspect-ratio fallback for the hero
+// media slot so existing inline `aspect-ratio` markup in landing.html still
+// has a visible placeholder background while the image streams in.
+.landing-hero .landing-hero-media {
+    background-color: rgba(255, 255, 255, 0.06);
+}

data/assets/css/main.scss

@@ -18,6 +18,9 @@
 
 // 3. Bootstrap-docs-style layout (trimmed; was ~3.2k-line vendor snapshot)
 @import "core/docs-layout";
+//    Code-example chrome split out of docs-layout; imported immediately after
+//    it so the concatenated cascade order is unchanged.
+@import "core/docs-code-examples";
 
 // 4. Reusable utilities (motion, focus rings) — used by components below
 @import "utilities/motion";
@@ -30,9 +33,11 @@
 @import "components/skeleton";
 @import "components/callout";
 @import "components/post-navigation";
+@import "components/author";
 @import "components/footer";
 @import "components/theme-preview";
 @import "components/content-tables";
+@import "components/search-modal";
 
 // 6. Layout partials
 @import "layouts/landing";
@@ -42,8 +47,20 @@
 // 7. Bootstrap Styles
 // @import "bootstrap.scss";
 
-// 8. Remaining custom styles (thin barrel — see _sass/custom.scss header).
-//    Slated for full decomposition in a follow-up release.
+// 7b. Core nav/content partials formerly imported from the top of custom.scss.
+//     Lifted here so assets/css/main.scss is the single assembly manifest; kept
+//     in their original relative order (immediately before the custom layer) so
+//     the compiled cascade is unchanged.
+@import "notebooks";
+@import "core/nav-tree";
+@import "core/sidebar-categories";
+@import "core/navbar";
+@import "core/offcanvas-panels";
+@import "core/obsidian";
+
+// 8. Custom layer — thin barrel that imports the focused partials the old
+//    custom.scss monolith was decomposed into (global-chrome, toc,
+//    sidebar-extras, ui-enhancements, notes-index). See _sass/custom.scss.
 @import "custom.scss";
 
 // 9. Custom Features

data/assets/js/author-profile.js

@@ -0,0 +1,190 @@
+/*
+ * author-profile.js
+ * ---------------------------------------------------------------------------
+ * Progressive-enhancement controller for the interactive author profile page
+ * (_layouts/author.html). Self-activates on any [data-author-profile] container,
+ * so it is safe to load globally and is a no-op everywhere else.
+ *
+ * Powers: type filters (the stat cards), free-text search (title + tags),
+ * sort (newest / oldest / A–Z), topic/tag chips, a live result count, a
+ * clear-filters control, deep-linkable type filter via the URL hash
+ * (#type=posts), and a reduced-motion-aware count-up on the stat numbers.
+ *
+ * No dependencies. With JS disabled every item stays visible (crawlable).
+ * ---------------------------------------------------------------------------
+ */
+(function () {
+  'use strict';
+
+  function init(root) {
+    var grid = root.querySelector('[data-author-grid]');
+    if (!grid) return;
+
+    var items = Array.prototype.slice.call(grid.querySelectorAll('.author-item'));
+    var filterBtns = Array.prototype.slice.call(root.querySelectorAll('[data-filter]'));
+    var tagBtns = Array.prototype.slice.call(root.querySelectorAll('[data-tag-filter]'));
+    var searchInput = root.querySelector('[data-author-search]');
+    var sortSelect = root.querySelector('[data-author-sort]');
+    var clearBtns = Array.prototype.slice.call(root.querySelectorAll('[data-author-clear]'));
+    var countEl = root.querySelector('[data-author-count]');
+    var noResults = root.querySelector('[data-author-noresults]');
+    var total = items.length;
+
+    var state = {
+      filter: 'all',
+      query: '',
+      sort: sortSelect ? sortSelect.value : 'newest',
+      tag: null
+    };
+
+    function matches(item) {
+      if (state.filter !== 'all' && item.getAttribute('data-collection') !== state.filter) {
+        return false;
+      }
+      if (state.tag) {
+        var bag = '|' + (item.getAttribute('data-tags') || '') + '|';
+        if (bag.indexOf('|' + state.tag + '|') === -1) return false;
+      }
+      if (state.query) {
+        var hay = (item.getAttribute('data-title') || '') + '|' + (item.getAttribute('data-tags') || '');
+        if (hay.indexOf(state.query) === -1) return false;
+      }
+      return true;
+    }
+
+    function sortItems() {
+      var ordered = items.slice();
+      ordered.sort(function (a, b) {
+        if (state.sort === 'az') {
+          return (a.getAttribute('data-title') || '').localeCompare(b.getAttribute('data-title') || '');
+        }
+        var da = parseInt(a.getAttribute('data-date') || '0', 10) || 0;
+        var db = parseInt(b.getAttribute('data-date') || '0', 10) || 0;
+        return state.sort === 'oldest' ? da - db : db - da;
+      });
+      ordered.forEach(function (el) { grid.appendChild(el); });
+    }
+
+    function apply() {
+      sortItems();
+      var visible = 0;
+      items.forEach(function (item) {
+        if (matches(item)) { item.classList.remove('d-none'); visible++; }
+        else { item.classList.add('d-none'); }
+      });
+      if (countEl) countEl.textContent = 'Showing ' + visible + ' of ' + total;
+      if (noResults) noResults.classList.toggle('d-none', visible !== 0);
+      var active = state.filter !== 'all' || state.query !== '' || state.tag !== null;
+      clearBtns.forEach(function (b) { b.hidden = !active; });
+    }
+
+    function setFilter(type) {
+      state.filter = type;
+      filterBtns.forEach(function (b) {
+        var on = b.getAttribute('data-filter') === type;
+        b.classList.toggle('is-active', on);
+        b.setAttribute('aria-pressed', on ? 'true' : 'false');
+      });
+      writeHash();
+      apply();
+    }
+
+    function setTag(tag) {
+      state.tag = (state.tag === tag) ? null : tag;
+      tagBtns.forEach(function (b) {
+        var on = b.getAttribute('data-tag-filter') === state.tag;
+        b.classList.toggle('is-active', on);
+        b.setAttribute('aria-pressed', on ? 'true' : 'false');
+      });
+      apply();
+    }
+
+    function clearAll() {
+      state.query = '';
+      state.tag = null;
+      if (searchInput) searchInput.value = '';
+      tagBtns.forEach(function (b) {
+        b.classList.remove('is-active');
+        b.setAttribute('aria-pressed', 'false');
+      });
+      setFilter('all'); // also re-applies + resets hash
+    }
+
+    function writeHash() {
+      if (!window.history || !window.history.replaceState) return;
+      try {
+        if (state.filter && state.filter !== 'all') {
+          window.history.replaceState(null, '', '#type=' + state.filter);
+        } else {
+          window.history.replaceState(null, '', window.location.pathname + window.location.search);
+        }
+      } catch (e) { /* no-op */ }
+    }
+
+    function readHash() {
+      var m = /[#&]type=([a-z0-9_-]+)/i.exec(window.location.hash);
+      if (m && filterBtns.some(function (b) { return b.getAttribute('data-filter') === m[1]; })) {
+        setFilter(m[1]);
+        return true;
+      }
+      return false;
+    }
+
+    // ---- Wire events ----
+    filterBtns.forEach(function (b) {
+      b.addEventListener('click', function () { setFilter(b.getAttribute('data-filter')); });
+    });
+    tagBtns.forEach(function (b) {
+      b.addEventListener('click', function () { setTag(b.getAttribute('data-tag-filter')); });
+    });
+    clearBtns.forEach(function (b) { b.addEventListener('click', clearAll); });
+    if (sortSelect) {
+      sortSelect.addEventListener('change', function () { state.sort = sortSelect.value; apply(); });
+    }
+    if (searchInput) {
+      var t;
+      searchInput.addEventListener('input', function () {
+        clearTimeout(t);
+        t = setTimeout(function () {
+          state.query = searchInput.value.trim().toLowerCase();
+          apply();
+        }, 150);
+      });
+    }
+
+    countUp(root);
+
+    // Deep link (e.g. /authors/bamr87/#type=docs); falls back to a plain apply.
+    if (!readHash()) apply();
+  }
+
+  // Reduced-motion-aware count-up for the stat numbers.
+  function countUp(root) {
+    var reduce = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+    var nums = root.querySelectorAll('.author-stat__num');
+    if (reduce || !nums.length || !window.requestAnimationFrame) return;
+    Array.prototype.forEach.call(nums, function (el) {
+      var target = parseInt(el.textContent, 10);
+      if (isNaN(target) || target <= 0) return;
+      var duration = 600, start = null;
+      el.textContent = '0';
+      function step(ts) {
+        if (start === null) start = ts;
+        var p = Math.min((ts - start) / duration, 1);
+        el.textContent = String(Math.round(p * target));
+        if (p < 1) window.requestAnimationFrame(step);
+      }
+      window.requestAnimationFrame(step);
+    });
+  }
+
+  function boot() {
+    Array.prototype.forEach.call(document.querySelectorAll('[data-author-profile]'), init);
+  }
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', boot);
+  } else {
+    boot();
+  }
+})();

data/assets/js/modules/navigation/navbar.js

@@ -31,6 +31,8 @@ export class Navbar {
         this._tooltips = [];
         this._listeners = [];
         this._resizeTimer = null;
+        this._fitTimer = null;
+        this._lastFitWarnings = new Set();
     }
 
     // -----------------------------------------------------------------
@@ -57,6 +59,7 @@ export class Navbar {
         this._setupDropdownHoverDelay();
         this._setupFocusTrap();
         this._setupResponsiveReset();
+        this._setupFitWarnings();
     }
 
     destroy() {
@@ -277,4 +280,105 @@ export class Navbar {
             }, 250);
         });
     }
+
+    // -----------------------------------------------------------------
+    // Dev-only constraint warnings
+    // -----------------------------------------------------------------
+    // Surfaces two failure modes that otherwise pass silently until a user
+    // hits a specific viewport: (1) the inline menubar has more items than can
+    // fit even icon-only, and (2) page content overflows the viewport, which
+    // makes the fixed-top navbar look "cut off" on the right. Logged to the
+    // console only on local/dev hosts — never on a deployed (e.g. *.github.io)
+    // site — so production consoles stay clean.
+    // -----------------------------------------------------------------
+    _isDevHost() {
+        try {
+            const h = window.location.hostname;
+            return h === 'localhost' || h === '127.0.0.1' || h === '0.0.0.0' ||
+                   h === '::1' || h === '[::1]' || h === '' ||
+                   /\.(local|test|localhost)$/.test(h);
+        } catch (e) {
+            return false;
+        }
+    }
+
+    _setupFitWarnings() {
+        if (!this._isDevHost()) return;
+        const run = () => this._checkFit();
+        // Let first paint + async chrome settle before the first check.
+        setTimeout(run, 600);
+        this._on(window, 'resize', () => {
+            clearTimeout(this._fitTimer);
+            this._fitTimer = setTimeout(run, 400);
+        });
+    }
+
+    /** Emit a warning at most once per distinct message until conditions change. */
+    _warnOnce(key, message, ...extra) {
+        if (this._lastFitWarnings.has(key)) return;
+        this._lastFitWarnings.add(key);
+        console.warn(message, ...extra);
+    }
+
+    _checkFit() {
+        const PREFIX = '[zer0-mistakes navbar]';
+        const vw = window.innerWidth;
+        // Re-evaluate from scratch each pass so a fixed layout stops warning.
+        this._lastFitWarnings.clear();
+
+        // 1) Inline menubar overflow at lg+ — more/wider items than the track holds.
+        if (vw >= this.config.breakpoints.lg) {
+            const navList = document.querySelector('#bdNavbar .navbar-nav');
+            if (navList && navList.scrollWidth > navList.clientWidth + 2) {
+                const items = navList.querySelectorAll(':scope > li:not(.d-lg-none)').length;
+                this._warnOnce(
+                    'menu-overflow',
+                    `${PREFIX} Top navigation overflows the bar at ${vw}px (~${items} ` +
+                    `visible items). Items are already icon-only here and may still clip. ` +
+                    `Reduce top-level entries, shorten titles, or group them under ` +
+                    `dropdowns in _data/navigation/main.yml.`
+                );
+            }
+        }
+
+        // 2) Page-level horizontal overflow (the usual "navbar looks cut off" cause).
+        //    `main.scrollWidth` only exceeds its clientWidth when something overflows
+        //    WITHOUT its own scroll container — locally-scrollable wide content
+        //    (tables/code) does not trip this. Cheap gate before the DOM scan.
+        const main = document.getElementById('main-content');
+        if (main && main.scrollWidth > main.clientWidth + 2) {
+            const cw = document.documentElement.clientWidth;
+            let worst = null;
+            main.querySelectorAll('*').forEach((el) => {
+                const r = el.getBoundingClientRect();
+                if (r.width === 0 || r.right <= cw + 2) return;
+                if (getComputedStyle(el).position === 'fixed') return;
+                // Overflow contained by an ancestor clip/scroll box never reaches
+                // the page. Exclude the root <html> clip so we still report what
+                // the safety net is hiding.
+                let contained = false, n = el.parentElement;
+                while (n && n !== document.body && n !== document.documentElement) {
+                    if (getComputedStyle(n).overflowX !== 'visible') { contained = true; break; }
+                    n = n.parentElement;
+                }
+                if (contained) return;
+                if (!worst || r.right > worst.right) worst = { el, right: r.right };
+            });
+            if (worst) {
+                const el = worst.el;
+                const sel = el.tagName.toLowerCase() +
+                    (el.id ? `#${el.id}` : '') +
+                    (el.className && typeof el.className === 'string'
+                        ? '.' + el.className.trim().split(/\s+/).slice(0, 2).join('.') : '');
+                this._warnOnce(
+                    'page-overflow',
+                    `${PREFIX} Content overflows the viewport by ` +
+                    `${Math.round(worst.right - cw)}px at ${vw}px (widest: ${sel}). This ` +
+                    `forces a horizontal scrollbar and can make the fixed navbar look cut ` +
+                    `off. Wrap wide content in a scroll container or a Bootstrap .container.`,
+                    el
+                );
+            }
+        }
+    }
 }

data/assets/js/obsidian-graph.js

@@ -5,8 +5,8 @@
  * /assets/data/wiki-index.json into the element with id `obsidian-graph`.
  *
  * Loaded only on the graph page (pages/_docs/obsidian/graph.md), which
- * also pulls in cytoscape.js from a CDN. No runtime dependencies are
- * added to the rest of the site.
+ * also pulls in the vendored cytoscape.js (assets/vendor/cytoscape/). No
+ * runtime CDN dependencies are added to the rest of the site.
  *
  * Nodes:   one per indexed entry (collection doc or standalone page)
  * Edges:   directed, source -> target, derived from `entry.outgoing`

data/assets/js/obsidian-local-graph.js

@@ -7,7 +7,7 @@
  *
  * Loaded by _includes/navigation/local-graph.html inside a dedicated
  * collapsible side panel. Cytoscape.js is loaded lazily (and only once) from
- * the same CDN as the full graph page.
+ * the vendored copy under assets/vendor/cytoscape/ (no CDN).
  *
  * Subgraph:
  *   - center  = current page (matched against entry.url, falling back to
@@ -26,8 +26,16 @@
   var PANEL_SELECTOR = '[data-obsidian-local-graph-panel]';
   var TOGGLE_SELECTOR = '[data-obsidian-local-graph-toggle]';
   var STATUS_SELECTOR = '[data-obsidian-local-graph-status]';
-  var CYTOSCAPE_URL = 'https://cdn.jsdelivr.net/npm/cytoscape@3.30.0/dist/cytoscape.min.js';
-  var CYTOSCAPE_SRI = 'sha384-kpMsYllYzyaWU69Piok08rPNktpnjqAoDMdB00fjqUkEk3lkuUbSuwJ+oXrjvN6B';
+  // Cytoscape is vendored locally (assets/vendor/cytoscape/) — no CDN, so the
+  // graph works under strict CSP and offline. Resolve the vendored URL from this
+  // script's own (trusted) src so it stays correct under any site baseurl,
+  // without flowing DOM-supplied text into a script element. See issues #152, #205.
+  var SELF_SRC = (document.currentScript && document.currentScript.src) || '';
+  var CYTOSCAPE_URL = '/assets/vendor/cytoscape/cytoscape.min.js';
+  var _selfMatch = SELF_SRC.match(/^(.*\/)assets\/js\/obsidian-local-graph\.js(?:[?#].*)?$/);
+  if (_selfMatch) {
+    CYTOSCAPE_URL = _selfMatch[1] + 'assets/vendor/cytoscape/cytoscape.min.js';
+  }
 
   function companionElements(container) {
     return {
@@ -256,8 +264,6 @@
     }
     var s = document.createElement('script');
     s.src = CYTOSCAPE_URL;
-    s.integrity = CYTOSCAPE_SRI;
-    s.crossOrigin = 'anonymous';
     s.defer = true;
     s.onload = function () {
       window.__obsidianCytoscapeLoading.forEach(function (fn) { fn(); });