diff --git a/.jules/palette.md b/.jules/palette.md index f3f2b71..b6f11a8 100644 --- a/.jules/palette.md +++ b/.jules/palette.md @@ -3,3 +3,7 @@ ## 2025-05-14 - Tooltips for Icon-only Buttons **Learning:** Icon-only buttons, while space-efficient, can be ambiguous for users who rely on visual cues but don't immediately recognize the icon. Providing a Tooltip alongside an ARIA label ensures both visual and screen-reader accessibility. In HeroUI v3, the `Tooltip` component should wrap the interactive element, using `Tooltip.Trigger` and `Tooltip.Content` for clarity. **Action:** Always wrap icon-only buttons in a Tooltip if the action isn't globally standard or if additional clarity can be provided without cluttering the UI. + +## 2025-05-15 - Micro-UX Polish: Focus and Snappiness +**Learning:** High-contrast focus rings (`focus-visible:ring-primary`) significantly improve navigation for keyboard-only users. Additionally, reducing Tooltip delay from 300ms to 200ms makes the interface feel noticeably more responsive and "snappy" without becoming distracting. +**Action:** Apply consistent `focus-visible` styles to all interactive elements and standardize Tooltip delays to 200ms across the application. diff --git a/app/components/CodeSnippet/index.tsx b/app/components/CodeSnippet/index.tsx index 6a2f937..80bb50b 100644 --- a/app/components/CodeSnippet/index.tsx +++ b/app/components/CodeSnippet/index.tsx @@ -52,7 +52,7 @@ export const CodeSnippet = ({ code }: CodeSnippetProps) => { $ {code} - + ) => (