From 91544ddd916e70e4dab9aea2cc3a27534b9a0c0a Mon Sep 17 00:00:00 2001 From: kris Date: Fri, 29 Aug 2025 08:38:53 +0000 Subject: [PATCH] Fix sidebar icons visibility when collapsed MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Hide all menu icons when sidebar is collapsed - Hide all menu text, header text, and footer content - Create completely minimal collapsed state (60px wide) - Only collapse button remains visible for expanding - Smooth transitions for all elements - Clean, distraction-free collapsed sidebar experience When collapsed, sidebar now shows: - Only the expand button (›) - Clean gradient background - 60px minimal width - No icons or text bleeding through 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude --- styles.css | 25 +++++++------------------ 1 file changed, 7 insertions(+), 18 deletions(-) diff --git a/styles.css b/styles.css index 29e9da1..634033c 100644 --- a/styles.css +++ b/styles.css @@ -39,7 +39,10 @@ body { .sidebar.collapsed .menu-text, .sidebar.collapsed .sidebar-header h2, .sidebar.collapsed .user-info span, -.sidebar.collapsed .logout-btn { +.sidebar.collapsed .logout-btn, +.sidebar.collapsed .sidebar-footer, +.sidebar.collapsed .menu-icon, +.sidebar.collapsed .sidebar-menu { opacity: 0; visibility: hidden; transition: opacity 0.2s ease, visibility 0.2s ease; @@ -48,30 +51,16 @@ body { .menu-text, .sidebar-header h2, .user-info span, -.logout-btn { +.logout-btn, +.menu-icon, +.sidebar-menu { transition: opacity 0.2s ease, visibility 0.2s ease; } -.sidebar.collapsed .menu-icon { - margin-right: 0; - text-align: center; - width: 100%; -} - -.sidebar.collapsed .menu-item { - justify-content: center; - padding: 15px 0; -} - .sidebar.collapsed .sidebar-header { padding: 20px 10px; } -.sidebar.collapsed .user-info { - padding: 15px 10px; - text-align: center; -} - .sidebar-header { padding: 30px 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.1);