diff --git a/frontend/src/components/Sidebar.tsx b/frontend/src/components/Sidebar.tsx
index 1edf35a7d..ec9a0e2e7 100644
--- a/frontend/src/components/Sidebar.tsx
+++ b/frontend/src/components/Sidebar.tsx
@@ -3,7 +3,7 @@ import { NavLink } from 'react-router-dom'
import { motion, AnimatePresence } from 'framer-motion'
import { routes } from '../routes'
import { useAuth } from './AuthContext'
-import ThemeToggle from './ThemeToggle'
+import { useTheme } from './ThemeContext'
import { useSidebar } from '../context/SidebarContext'
interface NavItemProps {
@@ -22,7 +22,7 @@ const NavItem = ({ to, icon, label, isExpanded, highlight = false }: NavItemProp
onClick={(e) => e.stopPropagation()}
className={({ isActive }) => `
relative flex items-center transition-all duration-300 group
- ${isExpanded ? 'gap-3 px-5 py-2.5 mx-2 rounded-lg' : 'justify-center py-3 px-2 mx-2 rounded-lg'}
+ ${isExpanded ? 'gap-3 px-5 py-3 mx-2 rounded-lg' : 'justify-center py-3 px-2 mx-2 rounded-lg'}
${isActive
? 'bg-accent-silver/10 text-primary shadow-[inset_0_1px_1px_rgba(255,255,255,0.05)]'
: highlight
@@ -103,6 +103,8 @@ const NavSection = ({ label, isExpanded }: { label: string, isExpanded: boolean
)
export default function Sidebar() {
+ const { theme, toggleTheme } = useTheme()
+
const { isExpanded, toggleSidebar } = useSidebar()
const { isAuthenticated, signOut } = useAuth()
@@ -157,10 +159,8 @@ export default function Sidebar() {
-
-
{/* Bottom Actions */}
@@ -183,19 +183,29 @@ export default function Sidebar() {
)}
)}
-
-
+
+
+
+