Skip to content

Commit

Permalink
refactor: replace secondary colors with warning colors (MetaMask#9922)
Browse files Browse the repository at this point in the history
<!--
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**
This PR replaces the `secondary` colors with `warning` colors, in
preparation to upgrade the design-tokens package to v4

<!--
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?
-->

## **Related issues**

Fixes: MetaMask#9921 

## **Manual testing steps**
1. Render the given components
2. Observe changes
3.

## **Screenshots/Recordings**

<!-- If applicable, add screenshots and/or recordings to visualize the
before and after of your change. -->

### **Before and after**
- `PendingText`
![Simulator Screenshot - iPhone 15 Pro - 2024-06-10 at 09 35
40](https://github.com/MetaMask/metamask-mobile/assets/14355083/d55b2b20-612b-45e6-b481-f05ebbe21bb3)
![Simulator Screenshot - iPhone 15 Pro - 2024-06-10 at 09 36
07](https://github.com/MetaMask/metamask-mobile/assets/14355083/af09a532-bd96-46df-99e4-f87133ce0f75)
- `StyledButtons`
![Simulator Screenshot - iPhone 15 Pro - 2024-06-10 at 09 40
08](https://github.com/MetaMask/metamask-mobile/assets/14355083/f6e085ac-147c-406f-bc9a-2ce21949851f)
![Simulator Screenshot - iPhone 15 Pro - 2024-06-10 at 09 40
31](https://github.com/MetaMask/metamask-mobile/assets/14355083/502aa368-da45-46ba-8d2b-71397dbfce63)
- `GasInfoIcon` + `Text`
![Simulator Screenshot - iPhone 15 Pro - 2024-06-10 at 09 47
59](https://github.com/MetaMask/metamask-mobile/assets/14355083/3ecb8fc1-70fc-40c4-8b32-0f67b6ebc903)
![Simulator Screenshot - iPhone 15 Pro - 2024-06-10 at 09 48
17](https://github.com/MetaMask/metamask-mobile/assets/14355083/b7ef6000-6598-467d-a0a7-33af3ec43fe6)

<!-- [screenshots/recordings] -->

## **Pre-merge author checklist**

- [x] I’ve followed [MetaMask 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.
  • Loading branch information
brianacnguyen authored Jun 11, 2024
1 parent 1f706ab commit d949b75
Show file tree
Hide file tree
Showing 6 changed files with 9 additions and 9 deletions.
2 changes: 1 addition & 1 deletion app/components/Base/StatusText.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ export const PendingText = (props) => {
return (
<Text
bold
style={[styles.status, { color: colors.secondary.default }]}
style={[styles.status, { color: colors.warning.default }]}
{...props}
/>
);
Expand Down
2 changes: 1 addition & 1 deletion app/components/Base/Text/Text.styles.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ const createStyles = (colors: Colors) =>
color: colors.error.default,
},
orange: {
color: colors.secondary.default,
color: colors.warning.default,
},
black: {
color: colors.text.default,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ exports[`StyledButton should render correctly on Android the button with type or
"padding": 15,
},
{
"borderColor": "#F66A0A",
"borderColor": "#BF5208",
"borderWidth": 1,
},
null,
Expand Down Expand Up @@ -223,7 +223,7 @@ exports[`StyledButton should render correctly on iOS the button with type orange
"padding": 15,
},
{
"borderColor": "#F66A0A",
"borderColor": "#BF5208",
"borderWidth": 1,
},
undefined,
Expand All @@ -239,7 +239,7 @@ exports[`StyledButton should render correctly on iOS the button with type orange
"textAlign": "center",
},
{
"color": "#F66A0A",
"color": "#BF5208",
},
undefined,
]
Expand Down
4 changes: 2 additions & 2 deletions app/components/UI/StyledButton/styledButtonStyles.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,11 +20,11 @@ const createStyles = (colors) =>
color: colors.primary.inverse,
},
orange: {
borderColor: colors.secondary.default,
borderColor: colors.warning.default,
borderWidth: 1,
},
orangeText: {
color: colors.secondary.default,
color: colors.warning.default,
},
infoText: {
color: colors.primary.default,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ const createStyles = (colors) =>
paddingLeft: 2,
},
gasInfoIcon: (hasOrigin) => ({
color: hasOrigin ? colors.secondary.default : colors.icon.muted,
color: hasOrigin ? colors.warning.default : colors.icon.muted,
}),
amountContainer: {
flex: 1,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ const createStyles = (colors: any) =>
paddingLeft: 2,
},
gasInfoIcon: (hasOrigin) => ({
color: hasOrigin ? colors.secondary.default : colors.icon.muted,
color: hasOrigin ? colors.warning.default : colors.icon.muted,
}),
amountContainer: {
flex: 1,
Expand Down

0 comments on commit d949b75

Please sign in to comment.