claude changes

assets/scripts/script.js

@@ -12,7 +12,6 @@ document.addEventListener("DOMContentLoaded", () => {
   restoreStackFromURL();
   initClearPanesButton();
   initInitialPaneControls();
-
 });
 
 /* =========================================================
@@ -21,22 +20,22 @@ document.addEventListener("DOMContentLoaded", () => {
 
 function initCopyButtons() {
   document.querySelectorAll("pre.src").forEach(codeBlock => {
-    if (codeBlock.querySelector(".copy-btn")) return; // idempotent
+    if (codeBlock.querySelector(".copy-btn")) return;
 
     const button = document.createElement("button");
     button.className = "copy-btn";
-    button.textContent = "Copy";
+    button.textContent = "copy";
     codeBlock.appendChild(button);
 
     button.addEventListener("click", async () => {
       const text = codeBlock.innerText.replace(button.innerText, "").trim();
       try {
         await navigator.clipboard.writeText(text);
-        button.textContent = "Copied!";
+        button.textContent = "copied";
-        setTimeout(() => (button.textContent = "Copy"), 1500);
+        setTimeout(() => (button.textContent = "copy"), 1600);
       } catch {
-        button.textContent = "Failed";
+        button.textContent = "failed";
-        setTimeout(() => (button.textContent = "Copy"), 1500);
+        setTimeout(() => (button.textContent = "copy"), 1600);
       }
     });
   });
@@ -103,18 +102,27 @@ function initThemeToggle() {
   const key = "theme";
   const saved = localStorage.getItem(key);
 
-  if (saved === "dark" || saved === "light") {
+  // Apply saved preference, defaulting to dark
-    root.setAttribute("data-theme", saved);
+  const initial = (saved === "dark" || saved === "light") ? saved : "dark";
-  }
+  root.setAttribute("data-theme", initial);
 
   const btn = document.getElementById("theme-toggle");
   if (!btn) return;
 
+  const updateIcon = theme => {
+    btn.textContent = theme === "dark" ? "☀" : "☽";
+    btn.setAttribute("aria-label",
+      theme === "dark" ? "Switch to light theme" : "Switch to dark theme");
+  };
+
+  updateIcon(initial);
+
   btn.addEventListener("click", () => {
     const current = root.getAttribute("data-theme");
     const next = current === "dark" ? "light" : "dark";
     root.setAttribute("data-theme", next);
     localStorage.setItem(key, next);
+    updateIcon(next);
   });
 }
 
@@ -234,7 +242,6 @@ function initTOCHighlighting() {
 
 let fullscreenSnapshot = null;
 
-
 /* =========================================================
    STACKED NAVIGATION (PANES)
    ========================================================= */
@@ -256,16 +263,34 @@ function initStackedNavigation() {
   });
 }
 
+function scrollPaneIntoView(pane) {
+  // Scroll the horizontal stack container, not the page, to avoid
+  // the browser jumping the whole viewport vertically.
+  const root = document.getElementById("stack-root");
+  if (!root) return;
+  const paneLeft = pane.offsetLeft;
+  const paneRight = paneLeft + pane.offsetWidth;
+  const viewRight = root.scrollLeft + root.offsetWidth;
+  if (paneLeft < root.scrollLeft || paneRight > viewRight) {
+    root.scrollTo({ left: paneLeft, behavior: "smooth" });
+  }
+}
+
 async function pushPane(pathname, hash = "") {
   const track = document.querySelector(".stack-track");
   if (!track) return;
 
   const existing = [...track.children].find(p => p.dataset.url === pathname);
   if (existing) {
-    existing.scrollIntoView({ behavior: "smooth", inline: "end" });
+    scrollPaneIntoView(existing);
     return;
   }
 
+  // If in fullscreen, exit first so the new pane is immediately visible
+  if (document.body.classList.contains("pane-fullscreen")) {
+    await exitFullscreen();
+  }
+
   const res = await fetch(pathname);
   const doc = new DOMParser().parseFromString(await res.text(), "text/html");
 
@@ -278,18 +303,28 @@ async function pushPane(pathname, hash = "") {
 
   pane.appendChild(content);
   track.appendChild(pane);
-  pane.scrollIntoView({ behavior: "smooth", inline: "end" });
+  scrollPaneIntoView(pane);
 
   if (hash) {
     requestAnimationFrame(() => {
-      pane.querySelector(`#${CSS.escape(hash)}`)
+      const target = pane.querySelector(`#${CSS.escape(hash)}`);
-        ?.scrollIntoView({ behavior: "smooth", block: "start" });
+      if (target) {
+        pane.scrollTop = target.offsetTop;
+      }
     });
   }
 
-  // Find the title-section and attach event listeners to the controls
+  attachPaneControls(pane);
+  updateURL();
+}
+
+function attachPaneControls(pane) {
   const titleSection = pane.querySelector(".title-section");
-  if (titleSection) {
+  if (!titleSection) return;
+
+  // Remove edit button if present
+  titleSection.querySelectorAll(".pane-edit").forEach(btn => btn.remove());
+
   const closeBtn = titleSection.querySelector(".pane-close");
   const fullscreenBtn = titleSection.querySelector(".pane-fullscreen");
 
@@ -299,8 +334,11 @@ async function pushPane(pathname, hash = "") {
         exitFullscreen({ removePane: pane });
         return;
       }
+      pane.style.animation = "pane-out var(--dur-mid) var(--ease-in) forwards";
+      setTimeout(() => {
         pane.remove();
         updateURL();
+      }, 200);
     });
   }
 
@@ -313,42 +351,16 @@ async function pushPane(pathname, hash = "") {
       }
     });
   }
-  }
-  
-  updateURL();
 }
 
 function initInitialPaneControls() {
-  // Initialize controls for the initial pane (pane-root) that's already in the HTML
   const initialPane = document.querySelector(".pane-root");
   if (!initialPane) return;
 
-  const titleSection = initialPane.querySelector(".title-section");
+  // Remove edit button
-  if (!titleSection) return;
+  initialPane.querySelectorAll(".pane-edit").forEach(btn => btn.remove());
 
-  const closeBtn = titleSection.querySelector(".pane-close");
+  attachPaneControls(initialPane);
-  const fullscreenBtn = titleSection.querySelector(".pane-fullscreen");
-  
-  if (closeBtn) {
-    closeBtn.addEventListener("click", () => {
-      if (document.body.classList.contains("pane-fullscreen")) {
-        exitFullscreen({ removePane: initialPane });
-        return;
-      }
-      initialPane.remove();
-      updateURL();
-    });
-  }
-  
-  if (fullscreenBtn) {
-    fullscreenBtn.addEventListener("click", () => {
-      if (initialPane.classList.contains("is-fullscreen")) {
-        exitFullscreen();
-      } else {
-        enterFullscreen(initialPane);
-      }
-    });
-  }
 }
 
 document.addEventListener("keydown", e => {
@@ -357,7 +369,6 @@ document.addEventListener("keydown", e => {
   }
 });
 
-
 function enterFullscreen(pane) {
   if (!fullscreenSnapshot) {
     fullscreenSnapshot = [...document.querySelectorAll(".stack-pane")]
@@ -374,7 +385,6 @@ function enterFullscreen(pane) {
   updateURL();
 }
 
-
 async function exitFullscreen({ removePane } = {}) {
   if (!fullscreenSnapshot) return;
 
@@ -386,7 +396,6 @@ async function exitFullscreen({ removePane } = {}) {
     .querySelectorAll(".stack-pane.is-fullscreen")
     .forEach(p => p.remove());
 
-  // Restore stack EXCEPT the removed pane
   for (const url of fullscreenSnapshot) {
     if (url === removeUrl) continue;
     await pushPane(url);
@@ -396,12 +405,9 @@ async function exitFullscreen({ removePane } = {}) {
   updateURL();
 }
 
-
 function clearAllPanes() {
   const panes = [...document.querySelectorAll(".stack-pane")];
-
   panes.slice(1).forEach(pane => pane.remove());
-
   updateURL();
 }
 
@@ -423,6 +429,7 @@ async function restoreStackFromURL() {
     await pushPane(url);
   }
 }
+
 function initClearPanesButton() {
   const btn = document.getElementById("close-all");
   if (!btn) return;
@@ -431,3 +438,16 @@ function initClearPanesButton() {
     clearAllPanes();
   });
 }
+
+/* =========================================================
+   PANE EXIT ANIMATION (keyframe injected at runtime)
+   ========================================================= */
+
+const style = document.createElement("style");
+style.textContent = `
+  @keyframes pane-out {
+    from { opacity: 1; transform: translateX(0); }
+    to   { opacity: 0; transform: translateX(16px); }
+  }
+`;
+document.head.appendChild(style);

lisp/build.el

@@ -96,9 +96,7 @@
            html
            nil t))
 
-    ;; Wrap title with metadata section - use lambda to properly capture title
+    ;; Wrap title with metadata section — edit button removed
-    ;; Handle titles with nested HTML tags by matching everything between opening and closing h1 tags
-    ;; Use .* to match any characters (greedy) - will match up to the last </h1> which should be our closing tag
     (setq html
           (replace-regexp-in-string
            "<h1 class=\"title\">\\(.*\\)</h1>"
@@ -107,18 +105,17 @@
                (format
                 "<div class=\"title-section\">
   <div class=\"title-controls\">
-    <button class=\"pane-fullscreen\" aria-label=\"Fullscreen\">F</button>
+    <button class=\"pane-fullscreen\" aria-label=\"Fullscreen\">⤢</button>
-    <button class=\"pane-edit\" aria-label=\"Edit pane\">E</button>
     <button class=\"pane-close\" aria-label=\"Close pane\">×</button>
   </div>
   <h1 class=\"title\">%s</h1>
   <div class=\"title-metadata\">
     <span class=\"metadata-item\">
-      <span class=\"metadata-label\">planted:</span>
+      <span class=\"metadata-label\">planted</span>
       <span class=\"metadata-value\">%s</span>
     </span>
     <span class=\"metadata-item\">
-      <span class=\"metadata-label\">last tended to:</span>
+      <span class=\"metadata-label\">tended</span>
       <span class=\"metadata-value\">%s</span>
     </span>
   </div>
@@ -175,8 +172,10 @@
     <div id=\"search-results\"></div>
   </div>
 
-<a href=\"https://zainezq.com\"> <img src=\"/assets/2_to_1.svg\" alt=\"Web logo\" class=\"web-logo\" /> </a>
+<div class=\"banner-actions\">
-<button id=\"close-all\">Close All</button>
+  <button id=\"theme-toggle\" aria-label=\"Toggle theme\" title=\"Toggle light/dark\"></button>
+  <button id=\"close-all\">close all</button>
+</div>
 </div>
 "
   )
@@ -185,7 +184,7 @@
   "<footer>
 <div class=\"copyright-container\">
 <div class=\"copyright\">
-Copyright &copy; 2022-2025 Zaine Qayyum. All rights reserved unless otherwise noted.</div></div>
+Copyright &copy; 2022-2026 Zaine Qayyum. All rights reserved unless otherwise noted.</div></div>
 <div class=\"generated\">
 Created with %c on <a href=\"https://www.archlinux.org/\">Arch</a> <a href=\"https://www.gnu.org\">GNU</a>/<a href=\"https://www.kernel.org/\">Linux</a>
 </div>
@@ -237,20 +236,6 @@ Created with %c on <a href=\"https://www.archlinux.org/\">Arch</a> <a href=\"htt
         nil))))
 
 
-(defun my/org-export-insert-backlinks (_backend)
-  "Insert Org-roam backlinks before export, with HTML attributes."
-  (when (and (featurep 'org-roam)
-             (org-roam-node-at-point))
-    (let ((backlinks (my/get-org-roam-backlinks (buffer-file-name))))
-      (when backlinks
-        (goto-char (point-max))
-        (insert "\n#+ATTR_HTML: :class backlinks-section :id backlinks\n Backlinks\n")
-        (insert "#+ATTR_HTML: :class backlinks-list\n")
-        (dolist (bl backlinks)
-          (insert (format "- %s\n"
-                          (plist-get bl :link))))))))
-
-
 (defun my/org-export-insert-backlinks (_backend)
   "Insert Org-roam backlinks before export."
   (when (and (buffer-file-name)

orgroam-build.log

@@ -9,5 +9,5 @@ Generating the JSON output...
 Building project (full rebuild with search index)...
 emacs -Q --script lisp/build.el
 Loading /home/zaine/master-folder/org_files/org_roam/lisp/macros.el (source)...
-Starting full rebuild at 2026-03-08 12:44:25
+Starting full rebuild at 2026-03-08 13:37:37
-✅ Full rebuild complete in 6.49 seconds
+✅ Full rebuild complete in 6.37 seconds