docs: Document Checker expansion & Guides update

site/_extensions/validbeck/sidebar-slim/README.md

@@ -0,0 +1,72 @@
+# Sidebar slim
+
+When `sidebar-slim: true` is set, users can collapse the docked side navigation to a narrow vertical strip to reduce visual clutter. State is kept for the browser tab (`sessionStorage`).
+
+## Usage
+
+### Setup
+
+Enable the filter globally in the project `format` section (`site/_quarto.yml`) so that its functionality can be called:
+
+```yaml
+filters:
+  - tachyons
+  - preview
+  - validbeck/sidebar-slim
+```
+
+This is the currently applied functionality.
+
+### Enabling
+
+#### Enable for a single page
+
+In the `.qmd` YAML frontmatter set:
+
+```yaml
+sidebar-slim: true
+```
+
+#### Enable for an entire section (directory)
+
+In that directory's `_metadata.yml` set:
+
+```yaml
+sidebar-slim: true
+```
+
+Any `.qmd` under that directory inherits this unless overridden per file.
+
+This is the current functionality that applies to `site/guide/`.
+
+#### Enable for the entire project
+
+In the project configuration (`site/_quarto.yml`), set default metadata so every page inherits it:
+
+```yaml
+metadata:
+  sidebar-slim: true
+```
+
+Per-directory `_metadata.yml` or a single document’s YAML can still override this (for example, `sidebar-slim: false` on one page).
+
+### Configuration
+
+#### Default to collapsed (narrow) sidebar
+
+Use **`sidebar-narrow: true`** so the first visit in a tab starts **collapsed** (until the user toggles). Preference is stored in `sessionStorage` (`1` = collapsed, `0` = expanded).
+
+Example:
+
+```yaml
+sidebar-narrow: true
+```
+
+This is the functionality currently set on `site/guide/guides.qmd`.
+
+## Notes
+
+- Extension only applies to **HTML** (`html:js`) output.
+- Toolbar appears at **≥992px** width; below that, Quarto’s own responsive sidebar behavior applies and this extension removes its UI.
+- When collapsed, the **main column width stays the same**; only the sidebar UI narrows inside its layout area (the grid tracks for the article are unchanged).
+- Does not replace Quarto’s built-in **reader mode** (`website: reader-mode`); you can use either or both.

site/_extensions/validbeck/sidebar-slim/_extension.yml

@@ -0,0 +1,7 @@
+title: Sidebar slim toggle
+author: validbeck
+version: 1.0.4
+quarto-required: ">=1.4.0"
+contributes:
+  filters:
+    - sidebar-slim.lua

site/_extensions/validbeck/sidebar-slim/sidebar-slim.css

@@ -0,0 +1,89 @@
+/*
+  Collapsible site sidebar: narrows to a slim vertical strip (desktop).
+  Activated when sidebar-slim metadata is true (see sidebar-slim.lua).
+*/
+
+@media (min-width: 992px) {
+  .quarto-sidebar-slim-toolbar {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 0.25rem;
+    padding: 0.35rem 0.4rem 0.45rem;
+    flex-shrink: 0;
+  }
+
+  body.quarto-sidebar-slim-enabled #quarto-sidebar.sidebar {
+    display: flex;
+    flex-direction: column;
+    transition:
+      width 0.22s ease,
+      min-width 0.22s ease,
+      max-width 0.22s ease,
+      flex 0.22s ease;
+  }
+
+  body.quarto-sidebar-slim-enabled #quarto-sidebar .quarto-sidebar-slim-toolbar {
+    order: -1;
+  }
+
+  /*
+    Collapsed: narrow the sidebar element inside its grid cell only — do not change
+    grid-column on the sidebar or main content, so the article column does not widen.
+  */
+  body.quarto-sidebar-slim-enabled.quarto-sidebar-slim-collapsed
+    #quarto-sidebar.sidebar {
+    width: 100% !important;
+    max-width: 2.75rem !important;
+    min-width: 0 !important;
+    justify-self: start;
+    overflow: hidden;
+  }
+
+  /*
+    #quarto-sidebar is <nav class="sidebar sidebar-navigation"> — hide every direct
+    child except our injected toolbar so only the expand control shows when collapsed.
+  */
+  body.quarto-sidebar-slim-enabled.quarto-sidebar-slim-collapsed
+    #quarto-sidebar.sidebar
+    > *:not(.quarto-sidebar-slim-toolbar) {
+    display: none !important;
+  }
+
+  body.quarto-sidebar-slim-enabled.quarto-sidebar-slim-collapsed .quarto-sidebar-slim-toolbar {
+    justify-content: center;
+    padding-left: 0;
+    padding-right: 0;
+  }
+
+  .quarto-sidebar-slim-toggle {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0;
+    padding: 0.2rem;
+    border: none;
+    border-radius: 0.25rem;
+    background: transparent;
+    color: #196972;
+    cursor: pointer;
+    font: inherit;
+    line-height: 1;
+  }
+
+  .quarto-sidebar-slim-toggle:hover {
+    background: rgba(0, 0, 0, 0.06);
+  }
+
+  .quarto-sidebar-slim-toggle:focus-visible {
+    outline: 2px solid #196972;
+    outline-offset: 2px;
+  }
+
+  .quarto-sidebar-slim-icon {
+    display: block;
+    font-size: 1.15rem;
+    font-weight: 600;
+    user-select: none;
+  }
+}

site/_extensions/validbeck/sidebar-slim/sidebar-slim.js

@@ -0,0 +1,139 @@
+(function () {
+  "use strict";
+
+  var STORAGE_KEY = "validbeck:quarto:sidebar-slim-collapsed";
+  var MQ = "(min-width: 992px)";
+
+  function getConfig() {
+    var el = document.getElementById("validbeck-sidebar-slim-config");
+    if (!el) {
+      return { sidebarNarrow: false };
+    }
+    try {
+      var cfg = JSON.parse(el.textContent || "{}");
+      return { sidebarNarrow: !!cfg.sidebarNarrow };
+    } catch (_e) {
+      return { sidebarNarrow: false };
+    }
+  }
+
+  /**
+   * "1" = collapsed, "0" = expanded (explicit user choice).
+   * Missing key = use default from sidebar-narrow metadata.
+   */
+  function readCollapsed(cfg) {
+    try {
+      var v = window.sessionStorage.getItem(STORAGE_KEY);
+      if (v === "1") return true;
+      if (v === "0") return false;
+      return !!cfg.sidebarNarrow;
+    } catch (_e) {
+      return !!cfg.sidebarNarrow;
+    }
+  }
+
+  function writeCollapsed(collapsed) {
+    try {
+      window.sessionStorage.setItem(STORAGE_KEY, collapsed ? "1" : "0");
+    } catch (_e) {
+      /* ignore */
+    }
+  }
+
+  function applyCollapsed(body, collapsed) {
+    if (collapsed) {
+      body.classList.add("quarto-sidebar-slim-collapsed");
+    } else {
+      body.classList.remove("quarto-sidebar-slim-collapsed");
+    }
+  }
+
+  function setIcon(btn, collapsed) {
+    var span = btn.querySelector(".quarto-sidebar-slim-icon");
+    if (!span) return;
+    span.textContent = collapsed ? "\u00bb" : "\u00ab";
+    btn.setAttribute(
+      "aria-label",
+      collapsed ? "Expand site sidebar" : "Collapse site sidebar"
+    );
+    btn.setAttribute("title", collapsed ? "Expand sidebar" : "Collapse sidebar");
+  }
+
+  function init() {
+    var mq = window.matchMedia(MQ);
+    var sidebar = document.getElementById("quarto-sidebar");
+    if (!sidebar || !sidebar.classList.contains("sidebar")) {
+      return;
+    }
+
+    function teardown() {
+      document.body.classList.remove(
+        "quarto-sidebar-slim-enabled",
+        "quarto-sidebar-slim-collapsed"
+      );
+      var existing = sidebar.querySelector(".quarto-sidebar-slim-toolbar");
+      if (existing) {
+        existing.remove();
+      }
+    }
+
+    function setupDesktop() {
+      teardown();
+      document.body.classList.add("quarto-sidebar-slim-enabled");
+      var cfg = getConfig();
+      var collapsed = readCollapsed(cfg);
+      applyCollapsed(document.body, collapsed);
+
+      var toolbar = document.createElement("div");
+      toolbar.className =
+        "sidebar-header quarto-sidebar-slim-toolbar";
+      toolbar.setAttribute("role", "group");
+
+      var btn = document.createElement("button");
+      btn.type = "button";
+      btn.className = "quarto-sidebar-slim-toggle";
+      btn.setAttribute("type", "button");
+
+      var icon = document.createElement("span");
+      icon.className = "quarto-sidebar-slim-icon";
+      icon.setAttribute("aria-hidden", "true");
+      btn.appendChild(icon);
+
+      setIcon(btn, collapsed);
+
+      btn.addEventListener("click", function () {
+        var next = !document.body.classList.contains(
+          "quarto-sidebar-slim-collapsed"
+        );
+        applyCollapsed(document.body, next);
+        setIcon(btn, next);
+        writeCollapsed(next);
+      });
+
+      toolbar.appendChild(btn);
+      sidebar.insertBefore(toolbar, sidebar.firstChild);
+    }
+
+    function onMqChange() {
+      if (mq.matches) {
+        setupDesktop();
+      } else {
+        teardown();
+      }
+    }
+
+    if (mq.addEventListener) {
+      mq.addEventListener("change", onMqChange);
+    } else {
+      mq.addListener(onMqChange);
+    }
+
+    onMqChange();
+  }
+
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", init);
+  } else {
+    init();
+  }
+})();

site/_extensions/validbeck/sidebar-slim/sidebar-slim.lua

@@ -0,0 +1,53 @@
+-- Enables optional sidebar minimize/expand UI when `sidebar-slim: true`
+-- is set in document or directory metadata.
+
+local function sidebar_slim_enabled(meta)
+  local v = meta.sidebar_slim or meta["sidebar-slim"]
+  if v == nil then
+    return false
+  end
+  if type(v) == "boolean" then
+    return v
+  end
+  local s = pandoc.utils.stringify(v):lower()
+  return s == "true" or s == "1" or s == "yes"
+end
+
+local function truthy_meta(meta, key_hyphen, key_underscore)
+  local v = meta[key_underscore] or meta[key_hyphen]
+  if v == nil then
+    return false
+  end
+  if type(v) == "boolean" then
+    return v
+  end
+  local s = pandoc.utils.stringify(v):lower()
+  return s == "true" or s == "1" or s == "yes"
+end
+
+function Pandoc(doc)
+  if not sidebar_slim_enabled(doc.meta) then
+    return doc
+  end
+  if not quarto.doc.is_format("html:js") then
+    return doc
+  end
+
+  local narrow_default = truthy_meta(doc.meta, "sidebar-narrow", "sidebar_narrow")
+  local cfg = { sidebarNarrow = narrow_default }
+  quarto.doc.include_text(
+    "in-header",
+    '<script type="application/json" id="validbeck-sidebar-slim-config">'
+      .. quarto.json.encode(cfg)
+      .. "</script>"
+  )
+
+  quarto.doc.add_html_dependency({
+    name = "validbeck-sidebar-slim",
+    version = "1.0.4",
+    stylesheets = { "sidebar-slim.css" },
+    scripts = { "sidebar-slim.js" },
+  })
+
+  return doc
+end

site/_quarto.yml

@@ -184,8 +184,8 @@ website:
             <div class="footer-heading">Get started</div>
             <div class="footer-user-guides-columns">
               <ul class="footer-user-guides-column-1">
-                <li><a href="/get-started/developer/quickstart-developer.qmd">Model development</a></li>
-                <li><a href="/get-started/validator/quickstart-validator.qmd">Model validation</a></li>
+                <li><a href="/get-started/developer/quickstart-developer.qmd">Development</a></li>
+                <li><a href="/get-started/validator/quickstart-validator.qmd">Validation</a></li>
                 <li><a href="/get-started/administrator/quickstart-administrator.qmd">Setup & admin</a></li>
               </ul>
             </div>
@@ -197,12 +197,13 @@ website:
               <ul class="footer-user-guides-column-1">
                 <li><a href="/guide/guides.qmd#access">Access</a></li>
                 <li><a href="/guide/guides.qmd#configuration">Configuration</a></li>
-                <li><a href="/guide/guides.qmd#model-inventory">Model inventory</a></li>
+                <li><a href="/guide/guides.qmd#integrations">Integrations</a></li>
+                <li><a href="/guide/guides.qmd#workflows">Workflows</a></li>
               </ul>
               <ul class="footer-user-guides-column-2">
+                <li><a href="/guide/guides.qmd#model-inventory">Model inventory</a></li>
+                <li><a href="/guide/guides.qmd#documents-templates">Documents & templates</a></li>
                 <li><a href="/guide/guides.qmd#model-documentation">Model documentation</a></li>
-                <li><a href="/guide/guides.qmd#model-validation">Model validation</a></li>
-                <li><a href="/guide/guides.qmd#workflows">Workflows</a></li>
               </ul>
               <ul class="footer-user-guides-column-3">
                 <li><a href="/guide/guides.qmd#reporting">Reporting</a></li>
@@ -276,3 +277,4 @@ format:
 filters:
   - tachyons
   - preview
+  - validbeck/sidebar-slim