feat: macOS HIG improvements — vibrancy, shadows, keyboard nav, tooltips, context menus#26
Merged
feat: macOS HIG improvements — vibrancy, shadows, keyboard nav, tooltips, context menus#26
Conversation
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- useGlobalShortcuts hook: ⌘, toggles preferences, ⌘1–5 navigates to the five main sections, Escape closes preferences panel - AppLayout wires up the hook via useNavigate + setSettingsOpen - SecretsPage: Escape key closes the secret-entry modal Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Implements useArrowNavigation hook and wires it up to SessionsPage, AuditLogPage, ComparatorHistoryPage, and the AppLayout sidebar subitems for full keyboard-driven list traversal (ArrowUp/Down, Home, End, Enter). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Adds the reusable hook that powers arrow key navigation across list views. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…debar subnav Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Add ~32px SVG icons to empty states across 6 pages (PluginsPage, SessionsPage, SecretsPage, AuditLogPage, ComparatorHistoryPage, BrowsePage) using var(--fg-subtle). PluginsPage gains a "Browse Marketplace →" button CTA and useNavigate import. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Adds tauri-plugin-window-state v2.4.1 to automatically save and restore window position and size across app launches. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Restore pub mod security + pub mod security_db to commands/mod.rs (these were missing from the branch base; main fixed them in 3485d0b) - Remove accidentally added `join` import from harness-fs.ts Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
siracusa5
force-pushed
the
feature/macos-hig
branch
from
019354b to
8acfa7c
Compare
5 tasks
2 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Implements a comprehensive macOS Human Interface Guidelines pass on the desktop app. The goal is to close the gap between a web app in a window and a native-feeling macOS app — covering visual materials, keyboard interaction, and contextual affordances across all three phases of the plan.
Changes
Phase 1 — Visual polish (CSS-level)
--bg-sidebartranslucency +backdrop-filter: blur(20px)on the sidebar<aside>— the single highest-impact visual change--shadow-sm/md/lg/popovertokens to:rootand.dark(dark mode uses higher opacity); replaced all 5 hardcodedrgba(0,0,0,...)shadow values with tokens; addedbox-shadow: var(--shadow-sm)to.row-listbackdrop-filter: blur(8px)on the secrets modal overlay scrimentry.details(matching the pointer cursor condition); addedcursor: textto.form-input/.form-textareaPhase 2 — Interaction
Tooltipcomponent: polished delayed tooltip (500ms, immediate hide) with HIG-appropriate styling; replacestitle=attributes on accent swatches, chart override buttons, "Score with AI"useGlobalShortcutshook —⌘,toggles preferences,⌘1–5navigate to the 5 nav sections,Escapecloses preferences panel and secrets modaluseArrowNavigationhook (ArrowUp/Down/Home/End/Enter, resets on list change, bounds-guarded); wired to Sessions, AuditLog, ComparatorHistory list views and the sidebar subnavPhase 3 — Features
ContextMenucomponent: positioned-at-cursor, click-away + Escape dismiss, danger item styling; right-click menus on Plugins (Copy name), Sessions (View details, Copy session ID), Comparator History (Review, Delete), Audit Log (Copy details/summary)tauri-plugin-window-state v2added — window remembers position/size between launchesTest Plan
pnpm --filter harness-kit-desktop test)prefers-reduced-motionrespected (no new CSS animations added)Notes
Known follow-up items (not blocking):
ContextMenudoes not clamp to viewport edges — rows near the window bottom/right will render partially off-screenscrollIntoView— keyboard focus can move out of visible area in long listsContextMenuandSidebarSubnavlackrole="menu"/role="menuitem"ARIA attributesScope note: This branch was created from
3201dc0. Main gained 9 commits during this work (board pages, security fix). The board files appearing in the diff are additions to main that this branch predates — they'll be present after merge.🤖 Generated with Claude Code