Skip to content
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

fix: change asset picker button to buttonbase to fix text theming #27127

Merged
merged 7 commits into from
Sep 16, 2024

Conversation

jclancy93
Copy link
Contributor

@jclancy93 jclancy93 commented Sep 13, 2024

Description

The asset picker in dark mode previously showed the down icon and token symbol in their light mode variants, instead of dark mode. This is because Button defaults to the primary variant which hard codes the theme as light mode for all descendant elements. This PR changes the AssetPicker main component from Button to ButtonBase since it does not default to light mode

Open in GitHub Codespaces

Related issues

Fixes: #27046

Manual testing steps

  1. Change to dark mode
  2. Open Send Page
  3. Asset symbol and down carat should both render as white
  4. Switch to light mode
  5. Asset symbol and down carat should both render as black

Screenshots/Recordings

Before

image

After

image

Pre-merge author checklist

Pre-merge reviewer checklist

  • I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

Copy link
Contributor

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

@jclancy93 jclancy93 marked this pull request as ready for review September 13, 2024 12:51
@jclancy93 jclancy93 requested a review from a team as a code owner September 13, 2024 12:51
@@ -3,12 +3,11 @@
exports[`AssetPicker matches snapshot 1`] = `
<DocumentFragment>
<button
class="mm-box mm-text mm-button-base mm-button-base--size-md asset-picker mm-button-primary mm-text--body-md-medium mm-box--padding-2 mm-box--padding-right-2 mm-box--padding-left-2 mm-box--display-flex mm-box--gap-2 mm-box--align-items-center mm-box--color-primary-inverse mm-box--background-color-transparent mm-box--rounded-pill"
class="mm-box mm-text mm-button-base mm-button-base--size-md asset-picker mm-text--body-md-medium mm-box--padding-2 mm-box--padding-right-2 mm-box--padding-left-2 mm-box--display-flex mm-box--gap-2 mm-box--align-items-center mm-box--color-text-default mm-box--background-color-transparent mm-box--rounded-pill"
Copy link
Contributor Author

@jclancy93 jclancy93 Sep 13, 2024

Choose a reason for hiding this comment

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

All changes in this file are from running yarn test:unit --updateSnapshot

Copy link

sonarcloud bot commented Sep 16, 2024

Copy link

codecov bot commented Sep 16, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 69.96%. Comparing base (ca6fd53) to head (bf7e8ab).
Report is 2 commits behind head on develop.

Additional details and impacted files
@@           Coverage Diff            @@
##           develop   #27127   +/-   ##
========================================
  Coverage    69.96%   69.96%           
========================================
  Files         1442     1442           
  Lines        50100    50100           
  Branches     14006    14006           
========================================
  Hits         35049    35049           
  Misses       15051    15051           

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@metamaskbot
Copy link
Collaborator

Builds ready [bf7e8ab]
Page Load Metrics (1886 ± 131 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint30324921805437210
domContentLoaded152624831859257123
load156024951886273131
domInteractive236838168
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 60 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

Copy link
Contributor

@georgewrmarshall georgewrmarshall left a comment

Choose a reason for hiding this comment

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

LGTM! Thanks for this @jclancy93 🙏

@jclancy93 jclancy93 merged commit aeb91c9 into develop Sep 16, 2024
78 checks passed
@jclancy93 jclancy93 deleted the fix/27046-asset-picker-symbol-theme branch September 16, 2024 15:20
@github-actions github-actions bot locked and limited conversation to collaborators Sep 16, 2024
@metamaskbot metamaskbot added the release-12.6.0 Issue or pull request that will be included in release 12.6.0 label Sep 16, 2024
@metamaskbot metamaskbot added release-12.5.0 Issue or pull request that will be included in release 12.5.0 and removed release-12.6.0 Issue or pull request that will be included in release 12.6.0 labels Sep 29, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
release-12.5.0 Issue or pull request that will be included in release 12.5.0 send-swap team-bridge
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Bug]: Token names displayed in dark font on Confirmation page
5 participants