Skip to content

fix(button): use proper colors for the button states in the ionic theme #30339

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.

Sign up for GitHub

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

Jump to bottom
Merged
merged 37 commits into from
Apr 11, 2025
Merged

fix(button): use proper colors for the button states in the ionic theme #30339

merged 37 commits into from
Apr 11, 2025

Conversation

@brandyscarney
Copy link
Member

@brandyscarney brandyscarney commented Apr 4, 2025 •
edited
Loading

Issue number: internal

What is the current behavior?

The focused and hover states are appearing as an overlay of the contrast color on the buttons.

What is the new behavior?

  • Updates hover and focus states to match Figma designs
  • Focus background should not change from the default
  • Hover background should be the shade for solid buttons, and use neutral subtlest for clear and outline buttons
  • Updates the clear button to use the new foreground variant

Does this introduce a breaking change?

  • Yes
  • No

Other information

Basic Preview
Clear Preview

brandyscarney and others added 20 commits March 26, 2025 10:00
@brandyscarney
feat(css): add support for the subtle color map
9b25ed0
@brandyscarney
Merge branch 'next' into FW-6252
2a0fdf3
@brandyscarney
test(theme): skip test because all tests fail on one or more colors
e8605e7
@Ionitron
chore(): add updated snapshots
5391165
@brandyscarney
style: comments
19c944a
@brandyscarney
Merge branch 'next' into FW-6252
147550a
@brandyscarney
Merge branch 'next' into FW-6252
e13d85d
@brandyscarney
refactor(themes): add foreground color for colors when used as text
8fc775f
@brandyscarney
test(theme): use proper color variants
9bfe374
@brandyscarney
fix(button): use correct styles for the focused state and clear color
c814794
@brandyscarney
style: lint
caf3c2d
@brandyscarney
test(themes): re-enable tests with correct checks
aed941f
@Ionitron
chore(): add updated snapshots
e86e9d5
@brandyscarney
revert back to tokens
59d713f
@brandyscarney
style: lint
6306fe6
@brandyscarney
Merge branch 'next' into FW-6252
a84f282
@brandyscarney
fix(themes): add tertiary, remove TODOs
60a241f
@brandyscarney
lint again and again and again
465a5ef
@brandyscarney
Merge branch 'FW-6252' into FW-6252-button
0806f51
@brandyscarney
fix(button): button hover should match pressed state
517b698
@vercel
Copy link

vercel bot commented Apr 4, 2025 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
ionic-framework ✅ Ready (Inspect) Visit Preview 💬 Add feedback Apr 11, 2025 5:57pm

@github-actions github-actions bot added the package: core @ionic/core package label Apr 4, 2025
@brandyscarney brandyscarney marked this pull request as ready for review April 7, 2025 18:16
@brandyscarney brandyscarney requested a review from a team as a code owner April 7, 2025 18:16
@brandyscarney brandyscarney requested review from thetaPC and removed request for a team April 7, 2025 18:16
thetaPC
thetaPC approved these changes Apr 8, 2025
View reviewed changes
Copy link
Contributor

@thetaPC thetaPC left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, verified that md also works when manually testing.

Base automatically changed from FW-6252 to next April 11, 2025 16:32
@brandyscarney brandyscarney merged commit 5da939d into next Apr 11, 2025
48 checks passed
@brandyscarney brandyscarney deleted the FW-6252-button branch April 11, 2025 18:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@thetaPC thetaPC thetaPC approved these changes

@BenOsodrac BenOsodrac BenOsodrac approved these changes

Assignees

No one assigned

Labels

package: core @ionic/core package

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

5 participants

@brandyscarney @thetaPC @BenOsodrac @Ionitron