28 lines
976 B
TypeScript
28 lines
976 B
TypeScript
/* 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 }
|
|
}
|