First commit

frontend/app/composables/useSidebar.ts

@@ -0,0 +1,27 @@
+/* Shared collapse state for the site sidebar. The choice is remembered in
+   localStorage, and the flag is also set on <html> so the fixed reading
+   surface (--sidebar-w) and the rail itself follow it together. Mobile's
+   top bar is always expanded — the collapsed styles only apply above the
+   900px breakpoint. */
+export function useSidebar() {
+  const collapsed = useState<boolean>('sidebar:collapsed', () => false)
+
+  if (import.meta.client) {
+    watch(collapsed, (is) => {
+      document.documentElement.classList.toggle('sidebar-collapsed', is)
+    })
+  }
+
+  function restoreSidebar() {
+    if (import.meta.client)
+      collapsed.value = localStorage.getItem('mathew:sidebar-collapsed') === '1'
+  }
+
+  function toggleSidebar() {
+    collapsed.value = !collapsed.value
+    if (import.meta.client)
+      localStorage.setItem('mathew:sidebar-collapsed', collapsed.value ? '1' : '0')
+  }
+
+  return { collapsed: readonly(collapsed), toggleSidebar, restoreSidebar }
+}