Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

fix(colors): explicitly define colors in places that was missing them #6426

Merged
merged 14 commits into from
Jan 21, 2025

Conversation

kathaypacific
Copy link
Collaborator

Description

When playing around with changing the colors to another app (Beefy) I noticed there were components that default to black / white that don't work well for a darker theme. This PR fixes those places to make sure the correct color is applied.

Test plan

n/a

Related issues

Backwards compatibility

Y

Network scalability

If a new NetworkId and/or Network are added in the future, the changes in this PR will:

  • Continue to work without code changes, OR trigger a compilation error (guaranteeing we find it when a new network is added)

Copy link

codecov bot commented Jan 17, 2025

Codecov Report

Attention: Patch coverage is 83.33333% with 1 line in your changes missing coverage. Please review.

Project coverage is 89.12%. Comparing base (80151ad) to head (bf33349).
Report is 1 commits behind head on main.

Files with missing lines Patch % Lines
src/qrcode/StyledQRGen.tsx 75.00% 1 Missing ⚠️
Additional details and impacted files

Impacted file tree graph

@@           Coverage Diff           @@
##             main    #6426   +/-   ##
=======================================
  Coverage   89.12%   89.12%           
=======================================
  Files         735      735           
  Lines       31858    31859    +1     
  Branches     6054     6054           
=======================================
+ Hits        28392    28395    +3     
+ Misses       3271     3269    -2     
  Partials      195      195           
Files with missing lines Coverage Δ
src/components/BottomSheetBase.tsx 82.14% <100.00%> (-0.62%) ⬇️
src/components/TextInput.tsx 97.50% <ø> (ø)
src/components/TokenBottomSheet.tsx 93.83% <ø> (ø)
src/navigator/SettingsMenu.tsx 94.94% <ø> (ø)
src/navigator/TabNavigator.tsx 100.00% <ø> (ø)
src/styles/styles.ts 100.00% <ø> (ø)
src/qrcode/StyledQRGen.tsx 90.00% <75.00%> (-10.00%) ⬇️

... and 1 file with indirect coverage changes


Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 80151ad...bf33349. Read the comment docs.

@MuckT
Copy link
Collaborator

MuckT commented Jan 17, 2025

We should add selectionColor={Colors.contentPrimary} as a prop to RNTextInput in src/components/TextInput.tsx also in this PR as this controls the color of the input cursor.

@@ -271,6 +271,7 @@ function TokenBottomSheet({
keyExtractor={(item) => item.tokenId}
contentContainerStyle={{
paddingBottom: insets.bottom,
backgroundColor: Colors.backgroundPrimary,
Copy link
Contributor

Choose a reason for hiding this comment

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

guess adding one here doesn't hurt anything, but is this required if we specify one in the Navigator?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

oh yes this is needed for when this TokenBottomSheet is used as a normal component (the swap screen)

@@ -757,6 +758,7 @@ function RootStackScreen() {
// take up the whole screen, it is no longer obvious that they are a bottom
// sheet / how to navigate away
maxDynamicContentSize: variables.height * 0.9,
backgroundStyle: { backgroundColor: Colors.backgroundPrimary },
Copy link
Contributor

@satish-ravi satish-ravi Jan 17, 2025

Choose a reason for hiding this comment

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

should we also add the handleIndicatorStyle here similar to BottomSheetBase so that it is consistent?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

oooooh yes i missed this!!

Base automatically changed from kathy/refine-colors to main January 21, 2025 13:30
@kathaypacific
Copy link
Collaborator Author

We should add selectionColor={Colors.contentPrimary} as a prop to RNTextInput in src/components/TextInput.tsx also in this PR as this controls the color of the input cursor.

@MuckT i'll work with Kayla to decide on a color here - contentPrimary might be too bold for an app in light mode

Copy link
Member

@jeanregisser jeanregisser left a comment

Choose a reason for hiding this comment

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

🚀

@@ -83,6 +83,7 @@ export class CTextInput extends React.Component<Props, State> {
inputStyle,
]}
value={value}
selectionColor={Colors.contentSecondary}
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

i'm going with a slightly softer color here for now, and will check with Kayla / update it following our working session later today

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

update on this @MuckT after Kayla and I caught up we landed on contentSecondary because it's a little softer in light mode so i'll leave this here :)

@kathaypacific kathaypacific added this pull request to the merge queue Jan 21, 2025
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Jan 21, 2025
@MuckT MuckT added this pull request to the merge queue Jan 21, 2025
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Jan 21, 2025
@MuckT MuckT added this pull request to the merge queue Jan 21, 2025
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Jan 21, 2025
@MuckT MuckT added this pull request to the merge queue Jan 21, 2025
Merged via the queue into main with commit a471697 Jan 21, 2025
15 checks passed
@MuckT MuckT deleted the kathy/fix-undefined-colors branch January 21, 2025 20:29
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants