mirror of
https://github.com/memohai/Memoh.git
synced 2026-04-27 07:16:19 +09:00
fix(sidebar): fix desktop sidebar collapsed by default on first visit (#305)
- Fix cookie check logic: use `!includes('sidebar_state=false')` instead
of `includes('sidebar_state=true')` so sidebar defaults to open when
no cookie is set
- Add --sidebar-width CSS variable binding to desktop sidebar element
- Adjust SIDEBAR_WIDTH_MOBILE value
Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -5,7 +5,7 @@ import { Sheet, SheetContent } from '#/components/sheet'
|
||||
import SheetDescription from '#/components/sheet/SheetDescription.vue'
|
||||
import SheetHeader from '#/components/sheet/SheetHeader.vue'
|
||||
import SheetTitle from '#/components/sheet/SheetTitle.vue'
|
||||
import { SIDEBAR_WIDTH_MOBILE, useSidebar } from './utils'
|
||||
import { SIDEBAR_WIDTH, SIDEBAR_WIDTH_MOBILE, useSidebar } from './utils'
|
||||
|
||||
defineOptions({
|
||||
inheritAttrs: false,
|
||||
@@ -64,6 +64,7 @@ const { isMobile, state, openMobile, setOpenMobile } = useSidebar()
|
||||
:data-collapsible="state === 'collapsed' ? collapsible : ''"
|
||||
:data-variant="variant"
|
||||
:data-side="side"
|
||||
:style="{ '--sidebar-width': SIDEBAR_WIDTH }"
|
||||
>
|
||||
<!-- This is what handles the sidebar gap on desktop -->
|
||||
<div
|
||||
|
||||
@@ -4,7 +4,7 @@ import { createContext } from 'reka-ui'
|
||||
export const SIDEBAR_COOKIE_NAME = 'sidebar_state'
|
||||
export const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7
|
||||
export const SIDEBAR_WIDTH = '14rem'
|
||||
export const SIDEBAR_WIDTH_MOBILE = '18rem'
|
||||
export const SIDEBAR_WIDTH_MOBILE = '24rem'
|
||||
export const SIDEBAR_WIDTH_ICON = '3rem'
|
||||
export const SIDEBAR_KEYBOARD_SHORTCUT = 'b'
|
||||
|
||||
|
||||
Reference in New Issue
Block a user