fix(bug-2): mobile hamburger — use CSS translate property to override Tailwind v4

Tailwind v4 compiles -translate-x-full to `translate: -100%` (CSS translate
shorthand), not `transform`. The old :style set `transform: translateX(0)` —
a different property — so the sidebar stayed hidden regardless of mobileOpen.

Fix: use `translate: 0` in inline style so it overrides the same property.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
main
boban 2026-05-16 19:01:26 +02:00
parent b077c8652b
commit 90bf5a0c53
1 changed files with 1 additions and 1 deletions

View File

@ -100,7 +100,7 @@
x-data="{ wsOpen: false }"
:class="$store.sidebar.collapsed ? 'w-16' : 'w-60'"
class="fixed inset-y-0 left-0 h-screen flex flex-col bg-s1 border-r border-white/[.06] z-40 -translate-x-full md:translate-x-0 transition-[width,transform] duration-200 ease-in-out"
:style="$store.sidebar?.mobileOpen ? 'transform: translateX(0)' : null"
:style="$store.sidebar?.mobileOpen ? 'translate: 0' : null"
>
<!-- Header: Logo + Workspace Switcher -->
<div class="flex-shrink-0 relative" @click.outside="wsOpen = false">