From 0a6d733be5dc87c314ab2ad58d270d2e3d6e2a13 Mon Sep 17 00:00:00 2001 From: BillionClaw Date: Tue, 17 Mar 2026 06:25:35 +0800 Subject: [PATCH] fix(ui): resolve broken menu navigation The sidebar CSS had incorrect :nth-child() selectors for nav item colors. When the Photos menu item was added, the CSS wasn't updated to account for the new 6th position of the Trash item. Changes: - Add color styling for Photos nav item (5th child, pink) - Update Trash nav item to use :nth-child(6) instead of :nth-child(5) - Add active state colors for both Photos and updated Trash positions Fixes #194 --- static/css/layout/sidebar.css | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/static/css/layout/sidebar.css b/static/css/layout/sidebar.css index a6ec7dd0..b7aa5b08 100755 --- a/static/css/layout/sidebar.css +++ b/static/css/layout/sidebar.css @@ -166,13 +166,15 @@ .nav-item:nth-child(2) i, .nav-item:nth-child(2) .oxi-icon { color: #74b9ff; } /* Shared - blue */ .nav-item:nth-child(3) i, .nav-item:nth-child(3) .oxi-icon { color: #81ecec; } /* Recent - teal */ .nav-item:nth-child(4) i, .nav-item:nth-child(4) .oxi-icon { color: #ffd43b; } /* Favorites - gold */ -.nav-item:nth-child(5) i, .nav-item:nth-child(5) .oxi-icon { color: #ff7675; } /* Trash - red */ +.nav-item:nth-child(5) i, .nav-item:nth-child(5) .oxi-icon { color: #ff6b9d; } /* Photos - pink */ +.nav-item:nth-child(6) i, .nav-item:nth-child(6) .oxi-icon { color: #ff7675; } /* Trash - red */ .nav-item.active:nth-child(1) i, .nav-item.active:nth-child(1) .oxi-icon { color: #ff5e3a; } .nav-item.active:nth-child(2) i, .nav-item.active:nth-child(2) .oxi-icon { color: #0984e3; } .nav-item.active:nth-child(3) i, .nav-item.active:nth-child(3) .oxi-icon { color: #00cec9; } .nav-item.active:nth-child(4) i, .nav-item.active:nth-child(4) .oxi-icon { color: #f0c800; } -.nav-item.active:nth-child(5) i, .nav-item.active:nth-child(5) .oxi-icon { color: #e74c3c; } +.nav-item.active:nth-child(5) i, .nav-item.active:nth-child(5) .oxi-icon { color: #e84393; } +.nav-item.active:nth-child(6) i, .nav-item.active:nth-child(6) .oxi-icon { color: #e74c3c; } .nav-item:hover i, .nav-item:hover .oxi-icon {