Enhance colors, contrast and hover states across interactive components - #524
Merged
devJaja merged 2 commits intoSep 1, 2026
Merged
Conversation
…onents (Epta-Node#380) Introduce consistent interactive feedback across the UI for WCAG AA: - Add tactile press (`:active`) and `:focus-visible` states to buttons, chips, toggles, sort headers, nav items and table rows. - Brighten low-contrast badge/pill colors (e.g. #a5b4fc -> #C7D2FE, #fbbf24 -> #FCD34D) and lift --text-secondary for AA on dark surfaces. - Centralize press/elevation tokens (--press-scale, --elevation-*) and add shared .pressable / focus-ring utilities with prefers-reduced-motion guards. Also repair broken composition left by prior merges that blocked the build: - Remove duplicate ProtectedRoute import and nested <Router> in App. - Restore react-hook-form wiring (useForm/reset) in SendXLMForm. - De-duplicate ToastContext (useContext import, local ToastContainer). - Drop unused vars in TransactionTable and de-motion Hero. 🤖 Generated with Codebuff Co-Authored-By: Codebuff <noreply@codebuff.com>
|
@ponmileleke54-dev Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits. You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀 |
|
@ponmileleke54-dev is attempting to deploy a commit to the Jaja's projects Team on Vercel. A member of the Team first needs to authorize it. |
Contributor
|
@ponmileleke54-dev |
Contributor
Author
|
working on that now |
Contributor
Author
|
done @devJaja |
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
2 participants
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.
closed #380
What
WCAG AA contrast and confident interactive feedback across the UI.
#a5b4fc → #C7D2FE,#fbbf24 → #FCD34D,#fca5a5 → #FCA5A5) and lifted--text-secondary(#8A93A3 → #A5AEBD) so secondary text meets 4.5:1 on the dark surfaces.:hover,:active, and:focus-visiblestates to buttons, chips, toggles, sort headers, filter chips, nav items, table rows, and links across agents, tasks, wallet, dashboard, notifications, and layout components.--press-scale,--press-brightness,--elevation-1/2/3) inglobal.cssand added shared.pressable/focus-ringutilities inmicro-interactions.css, withprefers-reduced-motionguards.Also fixed
Prior broken merges had left several files unable to compile; these are repaired so the diff builds cleanly:
ProtectedRouteimport and a nested<Router>inApp.tsx.react-hook-formwiring (useForm/reset) inSendXLMForm.tsx.ToastContext.tsx(unused localToastContainer, missinguseContextimport).TransactionTable.tsxand dropped unused framer-motion wrapper inHero.tsx.Notes
Verification in this environment is blocked by an incomplete
node_modulesinstall (lucide-react,@hookform/resolvers,zod,msware missing), which produces identicalTS2307 Cannot find moduleerrors across many unrelated files. The touched files are otherwise type-clean; a fullnpm ci && npm run buildis recommended in CI before merge.