* feat(web): add collapsible sidebar for the dashboard The desktop sidebar can now be collapsed to an icon-only rail via a toggle button in the sidebar header. State is persisted in localStorage so it survives page reloads. When collapsed (lg+ only): - Sidebar shrinks from w-64 to w-14 with a smooth width transition - Nav items show only their icon with a native title tooltip - Brand text, plugin headings, system actions, theme/language switchers, auth widget, and footer are hidden - Mobile drawer behavior is unchanged (always full-width) Co-authored-by: Cursor <cursoragent@cursor.com> * fix(web): align sidebar tooltips to sidebar edge consistently Tooltip left position now uses the sidebar's right edge instead of the anchor element's right edge, so narrow anchors (theme/language switchers) align with full-width anchors (nav links, system actions). Co-authored-by: Cursor <cursoragent@cursor.com> * feat(web): add tooltip animations, restore theme label, rename Sessions tab - Sidebar tooltips now animate in with a subtle 120ms ease-out slide; subsequent tooltips within the same hover sequence appear instantly (no delay/animation) following Emil Kowalski's tooltip pattern - Restore theme name label when sidebar is expanded - Rename Sessions segment tab to "History" across all 16 locales Co-authored-by: Cursor <cursoragent@cursor.com> * fix(web): smooth sidebar collapse animation - Remove icon centering on collapse; icons stay left-aligned at px-5 so they don't jump during the width transition - Text labels fade out with opacity transition instead of instant display:none, clipped naturally by overflow-hidden - Slow collapse duration from 450ms to 600ms for a more relaxed feel - Gateway dot always rendered with opacity toggle so it doesn't slide in from the right on collapse - Pin gateway dot at fixed left offset (pl-[1.625rem]) to align with nav icons - Align header toggle button with justify-center when collapsed - Bottom switchers use items-start when collapsed to prevent reflow Co-authored-by: Cursor <cursoragent@cursor.com> --------- Co-authored-by: Cursor <cursoragent@cursor.com>
42 lines
1.2 KiB
TypeScript
42 lines
1.2 KiB
TypeScript
import { Typography } from "@/components/NouiTypography";
|
|
import type { StatusResponse } from "@/lib/api";
|
|
import { cn } from "@/lib/utils";
|
|
import { useI18n } from "@/i18n";
|
|
|
|
export function SidebarFooter({ status }: SidebarFooterProps) {
|
|
const { t } = useI18n();
|
|
|
|
return (
|
|
<div
|
|
className={cn(
|
|
"flex shrink-0 items-center justify-between gap-2",
|
|
"px-5 py-2.5",
|
|
"border-t border-current/10",
|
|
)}
|
|
>
|
|
<Typography
|
|
className="font-mono-ui text-xs tabular-nums tracking-[0.08em] text-text-tertiary lowercase"
|
|
>
|
|
{status?.version != null ? `v${status.version}` : "—"}
|
|
</Typography>
|
|
|
|
<a
|
|
href="https://nousresearch.com"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className={cn(
|
|
"font-mondwest text-display text-xs tracking-[0.12em] text-midground",
|
|
"transition-opacity hover:opacity-90",
|
|
"focus-visible:rounded-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-midground/40",
|
|
)}
|
|
style={{ mixBlendMode: "plus-lighter" }}
|
|
>
|
|
{t.app.footer.org}
|
|
</a>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
interface SidebarFooterProps {
|
|
status: StatusResponse | null;
|
|
}
|