Make sidebar toggle button more visible - blue with white chevron

This commit is contained in:
OpenClaw Bot 2026-02-21 23:16:17 -06:00
parent 246ebd8e65
commit 3194737499

View File

@ -124,21 +124,20 @@ export function DashboardLayout({ children }: { children: React.ReactNode }) {
)} )}
> >
{/* Collapse Toggle Button */} {/* Collapse Toggle Button */}
<Button <button
variant="ghost"
size="icon"
onClick={() => setCollapsed(!collapsed)} onClick={() => setCollapsed(!collapsed)}
className={cn( className={cn(
"absolute -right-3 top-6 w-6 h-6 rounded-full border border-border bg-card shadow-sm", "absolute -right-4 top-8 w-8 h-8 rounded-full border-2 border-blue-500 bg-blue-500 text-white shadow-lg",
"hover:bg-accent z-50" "hover:bg-blue-600 hover:scale-110 transition-all z-50 flex items-center justify-center"
)} )}
title={collapsed ? "Expand sidebar" : "Collapse sidebar"}
> >
{collapsed ? ( {collapsed ? (
<ChevronRight className="w-3 h-3" /> <ChevronRight className="w-5 h-5" />
) : ( ) : (
<ChevronLeft className="w-3 h-3" /> <ChevronLeft className="w-5 h-5" />
)} )}
</Button> </button>
<SidebarContent pathname={pathname} collapsed={collapsed} /> <SidebarContent pathname={pathname} collapsed={collapsed} />
</div> </div>