From 9e4f037917b165fb2a476af34e0dfc31883c161e Mon Sep 17 00:00:00 2001
From: Matt <matt@letsbe.solutions>
Date: Sun, 31 Aug 2025 23:08:06 +0200
Subject: [PATCH] Fix sidebar collapse by removing CSS width overrides
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Modified main.scss to respect Vuetify 3 rail mode
- Removed !important width overrides that blocked collapse
- Added conditional CSS: 280px when expanded, 56px when in rail mode
- Sidebar now properly collapses/expands when toggle button is clicked
- Preserves glass morphism effects and smooth transitions

🤖 Generated with Claude Code

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .claude/settings.local.json |  3 ++-
 assets/scss/main.scss       | 16 ++++++++++++----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/.claude/settings.local.json b/.claude/settings.local.json
index dbe50b5..b015e60 100644
--- a/.claude/settings.local.json
+++ b/.claude/settings.local.json
@@ -41,7 +41,8 @@
       "mcp__zen__thinkdeep",
       "mcp__serena__insert_after_symbol",
       "mcp__serena__replace_symbol_body",
-      "mcp__playwright__browser_fill_form"
+      "mcp__playwright__browser_fill_form",
+      "mcp__zen__debug"
     ],
     "deny": [],
     "ask": []
diff --git a/assets/scss/main.scss b/assets/scss/main.scss
index aed3f52..5e960d3 100644
--- a/assets/scss/main.scss
+++ b/assets/scss/main.scss
@@ -929,11 +929,19 @@ $screen-xl: 1280px;
   }
 }
 
-// Sidebar fixed width enforcement
+// Sidebar width configuration - respects rail mode
 .v-navigation-drawer {
-  width: 280px !important;
-  max-width: 280px !important;
-  min-width: 280px !important;
+  // Only apply fixed width when NOT in rail mode
+  &:not(.v-navigation-drawer--rail) {
+    width: 280px;
+    max-width: 280px;
+    min-width: 280px;
+  }
+  
+  // Ensure rail mode uses correct width
+  &.v-navigation-drawer--rail {
+    width: 56px !important;
+  }
   
   &__content {
     @include glass-effect(0.95, 10px);