fix(site): initialize Tablesort from footer for reliable sorting

Move Tablesort scripts to footer_custom.html with a readyState guard.
Scope styles to main content tables. Add .gitignore for Bundler paths
under docs/ so local cache is not committed.

Made-with: Cursor

Author: Min-Yen Kan

.gitignore

@@ -0,0 +1,4 @@
+# Bundler / Jekyll (site lives in docs/)
+docs/.bundle/
+docs/.bundle-cache/
+docs/vendor/

docs/_includes/footer_custom.html

@@ -0,0 +1,27 @@
+<!-- tablesort: load at end of body so the DOM exists and init cannot miss DOMContentLoaded -->
+<script src="{{ '/assets/js/tablesort.min.js' | relative_url }}"></script>
+<script src="{{ '/assets/js/tablesort.number.min.js' | relative_url }}"></script>
+<script>
+(function () {
+  function initSortableTables() {
+    if (typeof Tablesort === 'undefined') return;
+    document.querySelectorAll('main table').forEach(function (table) {
+      if (table.dataset.tablesortInit === '1') return;
+      table.dataset.tablesortInit = '1';
+      try {
+        new Tablesort(table);
+      } catch (e) {
+        console.warn('Tablesort init failed:', e);
+      }
+    });
+  }
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initSortableTables);
+  } else {
+    initSortableTables();
+  }
+  window.addEventListener('pageshow', function (ev) {
+    if (ev.persisted) initSortableTables();
+  });
+})();
+</script>

docs/_includes/head_custom.html

@@ -1,27 +1,31 @@
-<!-- tablesort: client-side column sorting for all markdown tables -->
-<script src="{{ '/assets/js/tablesort.min.js' | relative_url }}"></script>
-<script src="{{ '/assets/js/tablesort.number.min.js' | relative_url }}"></script>
+<!-- tablesort: header affordances (Tablesort adds role="columnheader" after init) -->
 <style>
-  /* Sortable table header styling */
-  table th[role=columnheader] {
+  main table thead th {
     cursor: pointer;
     user-select: none;
     white-space: nowrap;
+    position: relative;
+    touch-action: manipulation;
   }
-  table th[role=columnheader]:not(.no-sort)::after {
-    content: ' \2195'; /* up-down arrow */
+  main table th[role='columnheader'] {
+    cursor: pointer;
+    user-select: none;
+    white-space: nowrap;
+  }
+  main table th[role='columnheader']:not(.no-sort)::after {
+    content: ' \2195';
     font-size: 0.75em;
     color: #888;
   }
-  table th[aria-sort=ascending]::after  { content: ' \2191' !important; color: #333; }
-  table th[aria-sort=descending]::after { content: ' \2193' !important; color: #333; }
-  table tbody tr:hover { background-color: rgba(0,0,0,0.04); }
+  main table th[aria-sort='ascending']::after {
+    content: ' \2191' !important;
+    color: #959396;
+  }
+  main table th[aria-sort='descending']::after {
+    content: ' \2193' !important;
+    color: #959396;
+  }
+  main table tbody tr:hover {
+    background-color: rgba(128, 128, 128, 0.12);
+  }
 </style>
-<script>
-  document.addEventListener('DOMContentLoaded', function () {
-    // Apply tablesort to every table on the page
-    document.querySelectorAll('table').forEach(function (table) {
-      new Tablesort(table);
-    });
-  });
-</script>