chore: Action buttons color revamp (#2605)

Emurgo · Aug 15, 2023 · 31e7ad1 · 31e7ad1
1 parent 5f52c46
commit 31e7ad1
Show file tree

Hide file tree

Showing 7 changed files with 20 additions and 27 deletions.
diff --git a/apps/wallet-mobile/src/TxHistory/ActionsBanner.tsx b/apps/wallet-mobile/src/TxHistory/ActionsBanner.tsx
@@ -114,7 +114,7 @@ const styles = StyleSheet.create({
     height: 42,
     width: 42,
     borderRadius: 20,
-    backgroundColor: COLORS.LIGHT_POSITIVE_GREEN,
+    backgroundColor: '#3154CB',
   },
   buyButton: {
     textAlignVertical: 'center',

diff --git a/apps/wallet-mobile/src/TxHistory/TxDetails/TxDetails.tsx b/apps/wallet-mobile/src/TxHistory/TxDetails/TxDetails.tsx
@@ -166,7 +166,11 @@ export const TxDetails = () => {
       </ScrollView>
 
       <Actions>
-        <Button onPress={() => openInExplorer(transaction, wallet.networkId)} title={strings.openInExplorer} />
+        <Button
+          onPress={() => openInExplorer(transaction, wallet.networkId)}
+          title={strings.openInExplorer}
+          shelleyTheme
+        />
       </Actions>
 
       {!isEmptyString(addressDetail) && (
@@ -429,7 +433,7 @@ const styles = StyleSheet.create({
     paddingHorizontal: 16,
   },
   positiveAmount: {
-    color: COLORS.POSITIVE_AMOUNT,
+    color: '#3154CB',
     fontWeight: '500',
   },
   negativeAmount: {

diff --git a/apps/wallet-mobile/src/TxHistory/TxHistory.tsx b/apps/wallet-mobile/src/TxHistory/TxHistory.tsx
@@ -193,7 +193,7 @@ const styles = StyleSheet.create({
     fontFamily: 'Rubik-Medium',
   },
   tabTextActive: {
-    color: COLORS.LIGHT_POSITIVE_GREEN,
+    color: '#3154CB',
   },
   tabTextInactive: {
     color: COLORS.TEXT_INPUT,
@@ -205,7 +205,7 @@ const styles = StyleSheet.create({
     width: '100%',
     borderTopLeftRadius: 2,
     borderTopRightRadius: 2,
-    backgroundColor: COLORS.LIGHT_POSITIVE_GREEN,
+    backgroundColor: '#3154CB',
   },
 
   tabNavigatorRoot: {

diff --git a/apps/wallet-mobile/src/TxHistory/TxHistoryList/TxHistoryListItem.tsx b/apps/wallet-mobile/src/TxHistory/TxHistoryList/TxHistoryListItem.tsx
@@ -149,7 +149,7 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
   },
   positiveAmount: {
-    color: COLORS.POSITIVE_AMOUNT,
+    color: '#3154CB',
   },
   negativeAmount: {
     color: COLORS.BLACK,

diff --git a/apps/wallet-mobile/src/components/Icon/Direction.tsx b/apps/wallet-mobile/src/components/Icon/Direction.tsx
@@ -49,8 +49,8 @@ const colorsMap: Record<ThemeStatus, {background: string; icon: string}> = {
     icon: '#6B7384',
   },
   DIRECT_CREDIT: {
-    background: 'rgba(23, 209, 170, 0.1)',
-    icon: '#17D1AA',
+    background: 'rgba(48, 84, 203, 0.1)',
+    icon: '#3154CB',
   },
 }
 

diff --git a/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx b/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react'
-import {Platform, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
+import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Button, Icon, Spacer, StatusBar, TextInput, YoroiLogo} from '../../../components'
@@ -108,23 +108,12 @@ const styles = StyleSheet.create({
     textAlign: 'center',
     color: '#242838',
   },
-  input: Platform.select({
-    android: {
-      color: '#6B7384',
-      fontWeight: '400',
-      paddingLeft: 8,
-      justifyContent: 'center',
-      borderColor: '#A7AFC0',
-      borderWidth: 1,
-      borderRadius: 10,
-    },
-    default: {
-      color: '#6B7384',
-      fontWeight: '400',
-      paddingLeft: 8,
-      justifyContent: 'center',
-    },
-  }),
+  input: {
+    color: '#6B7384',
+    fontWeight: '400',
+    paddingLeft: 8,
+    justifyContent: 'center',
+  },
   checkboxText: {
     fontFamily: 'Rubik',
     fontSize: 16,

diff --git a/apps/wallet-mobile/src/theme/config.ts b/apps/wallet-mobile/src/theme/config.ts
@@ -57,7 +57,7 @@ export const COLORS = {
 
 // TODO: use lowercase for key names. Eg navigationActive
 export const defaultColors = {
-  NAVIGATION_ACTIVE: COLORS.LIGHT_POSITIVE_GREEN,
+  NAVIGATION_ACTIVE: '#3154CB',
   NAVIGATION_INACTIVE: COLORS.SECONDARY_TEXT,
   BACKGROUND: COLORS.WHITE,
   backgroundAlert: COLORS.BACKGROUND_LIGHT_RED, // follow this style