Skip to content

Commit e48efc9

Browse files
runway-github[bot]Brunonascdevalescode
authored
chore(runway): cherry-pick feat(card): cp-7.64.0 change CardHome button colors (#25737)
- feat(card): cp-7.64.0 change CardHome button colors (#25728) <!-- Please submit this PR as a draft initially. Do not mark it as "Ready for review" until the template has been completely filled out, and PR status checks have passed at least once. --> ## **Description** <!-- Write a short description of the changes included in this pull request, also include relevant motivation and context. Have in mind the following questions: 1. What is the reason for the change? 2. What is the improvement/solution? --> Change CardHome button colors ## **Changelog** <!-- If this PR is not End-User-Facing and should not show up in the CHANGELOG, you can choose to either: 1. Write `CHANGELOG entry: null` 2. Label with `no-changelog` If this PR is End-User-Facing, please write a short User-Facing description in the past tense like: `CHANGELOG entry: Added a new tab for users to see their NFTs` `CHANGELOG entry: Fixed a bug that was causing some NFTs to flicker` (This helps the Release Engineer do their job more quickly and accurately) --> CHANGELOG entry: ## **Related issues** Fixes: ## **Manual testing steps** ```gherkin Feature: my feature name Scenario: user [verb for user action] Given [describe expected initial app state] When user [verb for user action] Then [describe expected outcome] ``` ## **Screenshots/Recordings** <!-- If applicable, add screenshots and/or recordings to visualize the before and after of your change. --> ### **Before** <!-- [screenshots/recordings] --> <img width="200" height="900" alt="image" src="https://github.com/user-attachments/assets/31e5700c-2387-4c73-a71a-6576036e2f95" /> ### **After** <!-- [screenshots/recordings] --> <img width="200" height="900" alt="image" src="https://github.com/user-attachments/assets/64bb8951-f334-406e-a916-d0070723bc28" /> ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile Coding Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md). - [x] I've completed the PR template to the best of my ability - [x] I've included tests if applicable - [x] I've documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [x] I've applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **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. <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Purely UI styling changes (button variant/color updates) with no logic, data, or navigation changes; risk is limited to visual regressions and snapshot/test updates. > > **Overview** > Updates `CardHome` CTA styling by switching the main action buttons (`Add funds`, `Enable card`, `Change asset`, and error `Try again`) from `ButtonVariants.Secondary` to `ButtonVariants.Primary`. > > Refreshes the `CardHome` Jest snapshots to reflect the new primary button appearance (dark background with white text, removing the previous secondary styling). > > <sup>Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 61ad41d. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot).</sup> <!-- /CURSOR_SUMMARY --> Co-authored-by: Ale Machado <alejandro@macha.do> [51f9d36](51f9d36) Co-authored-by: Bruno Nascimento <brunonascimentodev@gmail.com> Co-authored-by: Ale Machado <alejandro@macha.do>
1 parent 94ba5a5 commit e48efc9

2 files changed

Lines changed: 13 additions & 21 deletions

File tree

‎app/components/UI/Card/Views/CardHome/CardHome.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -658,7 +658,7 @@ const CardHome = () => {
658658
if (!isBaanxLoginEnabled) {
659659
return (
660660
<Button
661-
variant={ButtonVariants.Secondary}
661+
variant={ButtonVariants.Primary}
662662
label={strings('card.card_home.add_funds')}
663663
size={ButtonSize.Lg}
664664
onPress={addFundsAction}
@@ -679,7 +679,7 @@ const CardHome = () => {
679679

680680
return (
681681
<Button
682-
variant={ButtonVariants.Secondary}
682+
variant={ButtonVariants.Primary}
683683
label={strings('card.card_home.enable_card_button_label')}
684684
size={ButtonSize.Lg}
685685
onPress={openOnboardingDelegationAction}
@@ -692,7 +692,7 @@ const CardHome = () => {
692692
return (
693693
<Box twClassName="w-full gap-2 flex-row justify-between items-center">
694694
<Button
695-
variant={ButtonVariants.Secondary}
695+
variant={ButtonVariants.Primary}
696696
style={tw.style(
697697
'w-1/2',
698698
!isSwapEnabledForPriorityToken && 'opacity-50',
@@ -705,7 +705,7 @@ const CardHome = () => {
705705
testID={CardHomeSelectors.ADD_FUNDS_BUTTON}
706706
/>
707707
<Button
708-
variant={ButtonVariants.Secondary}
708+
variant={ButtonVariants.Primary}
709709
style={tw.style('w-1/2')}
710710
label={strings('card.card_home.change_asset')}
711711
size={ButtonSize.Lg}
@@ -889,7 +889,7 @@ const CardHome = () => {
889889
{retries < 3 && !isAuthenticationError(cardError) && (
890890
<Box twClassName="pt-2">
891891
<Button
892-
variant={ButtonVariants.Secondary}
892+
variant={ButtonVariants.Primary}
893893
label={strings('card.card_home.try_again')}
894894
size={ButtonSize.Md}
895895
onPress={() => {

‎app/components/UI/Card/Views/CardHome/__snapshots__/CardHome.test.tsx.snap‎

Lines changed: 8 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -956,10 +956,8 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
956956
{
957957
"alignItems": "center",
958958
"alignSelf": "stretch",
959-
"backgroundColor": "#3c4d9d0f",
960-
"borderColor": "transparent",
959+
"backgroundColor": "#121314",
961960
"borderRadius": 12,
962-
"borderWidth": 1,
963961
"flexDirection": "row",
964962
"height": 48,
965963
"justifyContent": "center",
@@ -974,7 +972,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
974972
accessibilityRole="text"
975973
style={
976974
{
977-
"color": "#121314",
975+
"color": "#ffffff",
978976
"fontFamily": "Geist-Medium",
979977
"fontSize": 16,
980978
"letterSpacing": 0,
@@ -996,10 +994,8 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
996994
{
997995
"alignItems": "center",
998996
"alignSelf": "stretch",
999-
"backgroundColor": "#3c4d9d0f",
1000-
"borderColor": "transparent",
997+
"backgroundColor": "#121314",
1001998
"borderRadius": 12,
1002-
"borderWidth": 1,
1003999
"flexDirection": "row",
10041000
"height": 48,
10051001
"justifyContent": "center",
@@ -1014,7 +1010,7 @@ exports[`CardHome Component renders correctly and matches snapshot 1`] = `
10141010
accessibilityRole="text"
10151011
style={
10161012
{
1017-
"color": "#121314",
1013+
"color": "#ffffff",
10181014
"fontFamily": "Geist-Medium",
10191015
"fontSize": 16,
10201016
"letterSpacing": 0,
@@ -2301,10 +2297,8 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
23012297
{
23022298
"alignItems": "center",
23032299
"alignSelf": "stretch",
2304-
"backgroundColor": "#3c4d9d0f",
2305-
"borderColor": "transparent",
2300+
"backgroundColor": "#121314",
23062301
"borderRadius": 12,
2307-
"borderWidth": 1,
23082302
"flexDirection": "row",
23092303
"height": 48,
23102304
"justifyContent": "center",
@@ -2319,7 +2313,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
23192313
accessibilityRole="text"
23202314
style={
23212315
{
2322-
"color": "#121314",
2316+
"color": "#ffffff",
23232317
"fontFamily": "Geist-Medium",
23242318
"fontSize": 16,
23252319
"letterSpacing": 0,
@@ -2341,10 +2335,8 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
23412335
{
23422336
"alignItems": "center",
23432337
"alignSelf": "stretch",
2344-
"backgroundColor": "#3c4d9d0f",
2345-
"borderColor": "transparent",
2338+
"backgroundColor": "#121314",
23462339
"borderRadius": 12,
2347-
"borderWidth": 1,
23482340
"flexDirection": "row",
23492341
"height": 48,
23502342
"justifyContent": "center",
@@ -2359,7 +2351,7 @@ exports[`CardHome Component renders correctly with privacy mode enabled 1`] = `
23592351
accessibilityRole="text"
23602352
style={
23612353
{
2362-
"color": "#121314",
2354+
"color": "#ffffff",
23632355
"fontFamily": "Geist-Medium",
23642356
"fontSize": 16,
23652357
"letterSpacing": 0,

0 commit comments

Comments
 (0)