-
Notifications
You must be signed in to change notification settings - Fork 1
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Update buttons to match design colors for each state #65
Conversation
@@ -3,7 +3,8 @@ import Link, { LinkProps } from 'next/link'; | |||
|
|||
const BUTTON_STYLES = { | |||
primary: { | |||
button: 'usa-button bg-[#224a58] hover:bg-green', | |||
button: | |||
'usa-button bg-violet-warm-60 hover:bg-violet-warm-50 active:bg-violet-warm-70', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Here are Ryan's requirements for the button colors:
I’m using the “60” version of violet warm, and would want the hover to be “50" and the pressed to be “70”
transparent: { | ||
button: | ||
'usa-button items-center gap-2.5 rounded border-2 border-white bg-transparent px-5 py-3 hover:border-2 hover:bg-transparent active:border-violet-warm-70 hover:!text-violet-warm-50', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is the Contact us
button we were chatting about @nickbristow. It has some placeholder styling you can modify once we merge this PR.
This PR updates all of the primary buttons to use the
violet-warm
colors from the USWDS. Please see the issue here listing the specific colors used.