feat: add center alignment option to scrollToElement and update breadcrumb navigation to center focused items

- Add "center" alignment option to scrollToElement function alongside existing top/default alignment
- Calculate centered scroll position by centering element vertically in viewport
- Update all breadcrumb navigation calls to use center alignment instead of top/false alignment
- Refactor targetTop calculation with ternary operator for cleaner conditional logic

frontend/app.js

@@ -2101,7 +2101,13 @@
 
     const currentTop = scrollContainer.scrollTop;
     const offsetTop = element.offsetTop;
-    const targetTop = alignToTop ? Math.max(0, offsetTop - 60) : Math.max(0, currentTop + (elementRect.top - containerRect.top) - containerRect.height * 0.35);
+    const shouldCenter = alignToTop === "center";
+    const centeredTop = Math.max(0, currentTop + (elementRect.top - containerRect.top) - (containerRect.height / 2) + (elementRect.height / 2));
+    const targetTop = shouldCenter
+      ? centeredTop
+      : alignToTop
+        ? Math.max(0, offsetTop - 60)
+        : Math.max(0, currentTop + (elementRect.top - containerRect.top) - containerRect.height * 0.35);
 
     scrollContainer.scrollTo({
       top: targetTop,
@@ -2970,7 +2976,7 @@
     const breadcrumbEls = [];
     breadcrumbEls.push(
       makeBreadcrumbSpan(data.vault, () => {
-        focusPathInSidebar(data.vault, "", { alignToTop: true });
+        focusPathInSidebar(data.vault, "", { alignToTop: "center" });
       }),
     );
     let accumulated = "";
@@ -2981,13 +2987,13 @@
       if (i < parts.length - 1) {
         breadcrumbEls.push(
           makeBreadcrumbSpan(part, () => {
-            focusPathInSidebar(data.vault, p, { alignToTop: true });
+            focusPathInSidebar(data.vault, p, { alignToTop: "center" });
           }),
         );
       } else {
         breadcrumbEls.push(
           makeBreadcrumbSpan(part.replace(/\.md$/i, ""), () => {
-            focusPathInSidebar(data.vault, data.path, { alignToTop: false });
+            focusPathInSidebar(data.vault, data.path, { alignToTop: "center" });
           }),
         );
       }