diff --git a/packages/dashboard/app/__tests__/mobile-nav-bar-css.test.ts b/packages/dashboard/app/__tests__/mobile-nav-bar-css.test.ts index 998b1fe851..e5fb3d404d 100644 --- a/packages/dashboard/app/__tests__/mobile-nav-bar-css.test.ts +++ b/packages/dashboard/app/__tests__/mobile-nav-bar-css.test.ts @@ -52,7 +52,8 @@ describe("mobile-nav-bar.css", () => { it("tab touch targets are at least 36px", () => { const block = extractRuleBlock(cssContent, ".mobile-nav-tab"); - expect(block).toContain("min-height: 36px"); + // FNXC:DashboardStyling 2026-06-20-20:56: FN-6809 keeps the 36px touch-target intent via tokens; --space-xl (24px) + --space-md (12px) resolves to the same min-height. + expect(block).toContain("min-height: calc(var(--space-xl) + var(--space-md))"); }); it("footer-aware positioning keeps nav at bottom: 0 when footer is visible", () => { diff --git a/packages/dashboard/app/components/LeftSidebarNav.css b/packages/dashboard/app/components/LeftSidebarNav.css index 064dd9f7d8..7ac57061ec 100644 --- a/packages/dashboard/app/components/LeftSidebarNav.css +++ b/packages/dashboard/app/components/LeftSidebarNav.css @@ -29,6 +29,10 @@ The left sidebar is a sibling of project-content, so it does not inherit project flex-shrink: 0; } +/* +FNXC:DashboardStyling 2026-06-20-20:56: +The floating sidebar collapse toggle must stay fully round, but FN-6809 surfaced that --radius-full is not a defined dashboard token. Use 50% here to preserve the circular affordance without introducing another undefined custom property. +*/ .left-sidebar-nav__collapse-toggle--floating { position: absolute; top: var(--space-sm); @@ -40,7 +44,7 @@ The left sidebar is a sibling of project-content, so it does not inherit project min-width: calc(var(--space-lg) + var(--space-md)); min-height: calc(var(--space-lg) + var(--space-md)); padding: var(--space-xs); - border-radius: var(--radius-full); + border-radius: 50%; box-shadow: var(--shadow-sm); } @@ -96,8 +100,12 @@ The left sidebar is a sibling of project-content, so it does not inherit project box-shadow: var(--focus-ring); } +/* +FNXC:DashboardStyling 2026-06-20-20:56: +The active sidebar item must use the defined --status-todo-bg token so the dashboard CSS token-validity gate stays green. FN-6809 replaces the undefined --todo-bg reference without changing the rendered todo status treatment. +*/ .left-sidebar-nav__item--active { - background: var(--todo-bg); + background: var(--status-todo-bg); color: var(--todo); }