From 35cde3d8bf1438a8b19830558becc604d98b1020 Mon Sep 17 00:00:00 2001 From: Juliano Lazzarotto <30806844+stackchain@users.noreply.github.com> Date: Thu, 1 Aug 2024 12:05:48 +0100 Subject: [PATCH] fix(wallet-mobile): dapp theme (#3475) --- .../common/ConfirmConnectionModal.tsx | 44 ++--- .../BrowseDapp/BrowserSearchToolbar.tsx | 23 +-- .../useCases/BrowseDapp/BrowserTabsBar.tsx | 6 +- .../Transactions/TxHistoryNavigator.json | 168 +++++++++--------- .../legacy/Dashboard/DashboardNavigator.json | 8 +- 5 files changed, 126 insertions(+), 123 deletions(-) diff --git a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx index cd07f6e71d..ad9eecd812 100644 --- a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx +++ b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx @@ -54,7 +54,7 @@ export const ConfirmConnectionModal = ({name, website, onConfirm, logo}: Props) - + @@ -91,43 +91,43 @@ export const ConfirmConnectionModal = ({name, website, onConfirm, logo}: Props) } const useStyles = () => { - const theme = useTheme() - const colors = {connection: theme.color.black_static, dAppIconColor: theme.color.gray_c600} + const {atoms, color} = useTheme() + const colors = {icon: color.el_gray_high} const styles = StyleSheet.create({ imagesLine: { - ...theme.atoms.flex, - ...theme.atoms.flex_row, - ...theme.atoms.align_center, - ...theme.atoms.justify_center, - ...theme.atoms.gap_xl, + ...atoms.flex, + ...atoms.flex_row, + ...atoms.align_center, + ...atoms.justify_center, + ...atoms.gap_xl, }, image: { width: 48, height: 48, }, line: { - ...theme.atoms.flex, - ...theme.atoms.flex_row, - ...theme.atoms.align_center, - ...theme.atoms.justify_center, - ...theme.atoms.gap_xs, + ...atoms.flex, + ...atoms.flex_row, + ...atoms.align_center, + ...atoms.justify_center, + ...atoms.gap_xs, }, text: { - color: theme.color.gray_c900, - ...theme.atoms.body_1_lg_regular, + color: color.text_gray_normal, + ...atoms.body_1_lg_regular, }, bold: { - color: theme.color.gray_c900, - ...theme.atoms.body_1_lg_medium, - ...theme.atoms.font_semibold, + color: color.text_gray_normal, + ...atoms.body_1_lg_medium, + ...atoms.font_semibold, }, boxDesAllowConnectDApp: { - ...theme.atoms.pl_sm, + ...atoms.pl_sm, }, root: { - flex: 1, - ...theme.atoms.px_lg, + ...atoms.flex_1, + ...atoms.px_lg, }, }) - return {styles, colors} + return {styles, colors} as const } diff --git a/apps/wallet-mobile/src/features/Discover/useCases/BrowseDapp/BrowserSearchToolbar.tsx b/apps/wallet-mobile/src/features/Discover/useCases/BrowseDapp/BrowserSearchToolbar.tsx index 0dc528f3f2..eb28aafa66 100644 --- a/apps/wallet-mobile/src/features/Discover/useCases/BrowseDapp/BrowserSearchToolbar.tsx +++ b/apps/wallet-mobile/src/features/Discover/useCases/BrowseDapp/BrowserSearchToolbar.tsx @@ -63,21 +63,24 @@ const BackButton = (props: TouchableOpacityProps) => { } const useStyles = () => { - const {color} = useTheme() + const {color, atoms} = useTheme() const styles = StyleSheet.create({ root: { - paddingVertical: 10, - paddingHorizontal: 16, + ...atoms.px_md, }, boxURI: { - flexDirection: 'row', - alignItems: 'center', - borderRadius: 8, - paddingHorizontal: 12, - backgroundColor: color.gray_c50, - height: 50, + minHeight: 64, + ...atoms.flex_row, + ...atoms.align_center, + ...atoms.gap_lg, + }, + searchInputStyle: { + color: color.text_gray_max, + minHeight: 36, + ...atoms.body_1_lg_regular, + ...atoms.flex_1, + ...atoms.pb_md, }, - searchInputStyle: {flex: 1, color: color.black_static}, }) return {styles} as const diff --git a/apps/wallet-mobile/src/features/Discover/useCases/BrowseDapp/BrowserTabsBar.tsx b/apps/wallet-mobile/src/features/Discover/useCases/BrowseDapp/BrowserTabsBar.tsx index d5d70d0d12..a0030d0b45 100644 --- a/apps/wallet-mobile/src/features/Discover/useCases/BrowseDapp/BrowserTabsBar.tsx +++ b/apps/wallet-mobile/src/features/Discover/useCases/BrowseDapp/BrowserTabsBar.tsx @@ -81,17 +81,17 @@ const useStyles = () => { elevation: 14, }, totalTabsText: { + color: color.text_gray_medium, ...atoms.body_2_md_medium, - color: color.black_static, }, doneText: { - color: color.gray_c900, + color: color.el_gray_normal, ...atoms.body_2_md_medium, }, }) const colors = { - iconColor: color.gray_c800, + iconColor: color.el_gray_normal, } return {styles, colors} as const diff --git a/apps/wallet-mobile/translations/messages/src/features/Transactions/TxHistoryNavigator.json b/apps/wallet-mobile/translations/messages/src/features/Transactions/TxHistoryNavigator.json index 3df5ff4af8..1d3f44e532 100644 --- a/apps/wallet-mobile/translations/messages/src/features/Transactions/TxHistoryNavigator.json +++ b/apps/wallet-mobile/translations/messages/src/features/Transactions/TxHistoryNavigator.json @@ -4,14 +4,14 @@ "defaultMessage": "!!!Receive", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 443, + "line": 442, "column": 16, - "index": 17237 + "index": 17189 }, "end": { - "line": 446, + "line": 445, "column": 3, - "index": 17326 + "index": 17278 } }, { @@ -19,14 +19,14 @@ "defaultMessage": "!!!Address details", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 447, + "line": 446, "column": 32, - "index": 17360 + "index": 17312 }, "end": { - "line": 450, + "line": 449, "column": 3, - "index": 17473 + "index": 17425 } }, { @@ -34,14 +34,14 @@ "defaultMessage": "!!!Swap", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 451, + "line": 450, "column": 13, - "index": 17488 + "index": 17440 }, "end": { - "line": 454, + "line": 453, "column": 3, - "index": 17561 + "index": 17513 } }, { @@ -49,14 +49,14 @@ "defaultMessage": "!!!Swap from", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 455, + "line": 454, "column": 17, - "index": 17580 + "index": 17532 }, "end": { - "line": 458, + "line": 457, "column": 3, - "index": 17657 + "index": 17609 } }, { @@ -64,14 +64,14 @@ "defaultMessage": "!!!Swap to", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 459, + "line": 458, "column": 15, - "index": 17674 + "index": 17626 }, "end": { - "line": 462, + "line": 461, "column": 3, - "index": 17747 + "index": 17699 } }, { @@ -79,14 +79,14 @@ "defaultMessage": "!!!Slippage Tolerance", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 463, + "line": 462, "column": 21, - "index": 17770 + "index": 17722 }, "end": { - "line": 466, + "line": 465, "column": 3, - "index": 17865 + "index": 17817 } }, { @@ -94,14 +94,14 @@ "defaultMessage": "!!!Select pool", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 467, + "line": 466, "column": 14, - "index": 17881 + "index": 17833 }, "end": { - "line": 470, + "line": 469, "column": 3, - "index": 17962 + "index": 17914 } }, { @@ -109,14 +109,14 @@ "defaultMessage": "!!!Send", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 471, + "line": 470, "column": 13, - "index": 17977 + "index": 17929 }, "end": { - "line": 474, + "line": 473, "column": 3, - "index": 18057 + "index": 18009 } }, { @@ -124,14 +124,14 @@ "defaultMessage": "!!!Scan QR code address", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 475, + "line": 474, "column": 18, - "index": 18077 + "index": 18029 }, "end": { - "line": 478, + "line": 477, "column": 3, - "index": 18178 + "index": 18130 } }, { @@ -139,14 +139,14 @@ "defaultMessage": "!!!Select asset", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 479, + "line": 478, "column": 20, - "index": 18200 + "index": 18152 }, "end": { - "line": 482, + "line": 481, "column": 3, - "index": 18289 + "index": 18241 } }, { @@ -154,14 +154,14 @@ "defaultMessage": "!!!Assets added", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 483, + "line": 482, "column": 26, - "index": 18317 + "index": 18269 }, "end": { - "line": 486, + "line": 485, "column": 3, - "index": 18418 + "index": 18370 } }, { @@ -169,14 +169,14 @@ "defaultMessage": "!!!Edit amount", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 487, + "line": 486, "column": 19, - "index": 18439 + "index": 18391 }, "end": { - "line": 490, + "line": 489, "column": 3, - "index": 18532 + "index": 18484 } }, { @@ -184,14 +184,14 @@ "defaultMessage": "!!!Confirm", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 491, + "line": 490, "column": 16, - "index": 18550 + "index": 18502 }, "end": { - "line": 494, + "line": 493, "column": 3, - "index": 18636 + "index": 18588 } }, { @@ -199,14 +199,14 @@ "defaultMessage": "!!!Share this address to receive payments. To protect your privacy, new addresses are generated automatically once you use them.", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 495, + "line": 494, "column": 19, - "index": 18657 + "index": 18609 }, "end": { - "line": 501, + "line": 500, "column": 3, - "index": 18895 + "index": 18847 } }, { @@ -214,14 +214,14 @@ "defaultMessage": "!!!Confirm transaction", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 502, + "line": 501, "column": 27, - "index": 18924 + "index": 18876 }, "end": { - "line": 505, + "line": 504, "column": 3, - "index": 19017 + "index": 18969 } }, { @@ -229,14 +229,14 @@ "defaultMessage": "!!!Please scan a QR code", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 506, + "line": 505, "column": 13, - "index": 19032 + "index": 18984 }, "end": { - "line": 509, + "line": 508, "column": 3, - "index": 19107 + "index": 19059 } }, { @@ -244,14 +244,14 @@ "defaultMessage": "!!!Success", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 510, + "line": 509, "column": 25, - "index": 19134 + "index": 19086 }, "end": { - "line": 513, + "line": 512, "column": 3, - "index": 19208 + "index": 19160 } }, { @@ -259,14 +259,14 @@ "defaultMessage": "!!!Request specific amount", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 514, + "line": 513, "column": 18, - "index": 19228 + "index": 19180 }, "end": { - "line": 517, + "line": 516, "column": 3, - "index": 19342 + "index": 19294 } }, { @@ -274,14 +274,14 @@ "defaultMessage": "!!!Buy/Sell ADA", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 518, + "line": 517, "column": 28, - "index": 19372 + "index": 19324 }, "end": { - "line": 521, + "line": 520, "column": 3, - "index": 19468 + "index": 19420 } }, { @@ -289,14 +289,14 @@ "defaultMessage": "!!!Buy provider", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 522, + "line": 521, "column": 29, - "index": 19499 + "index": 19451 }, "end": { - "line": 525, + "line": 524, "column": 3, - "index": 19607 + "index": 19559 } }, { @@ -304,14 +304,14 @@ "defaultMessage": "!!!Sell provider", "file": "src/features/Transactions/TxHistoryNavigator.tsx", "start": { - "line": 526, + "line": 525, "column": 30, - "index": 19639 + "index": 19591 }, "end": { - "line": 529, + "line": 528, "column": 3, - "index": 19749 + "index": 19701 } } ] \ No newline at end of file diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/DashboardNavigator.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/DashboardNavigator.json index 9bb8235665..540f82c6c8 100644 --- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/DashboardNavigator.json +++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/DashboardNavigator.json @@ -4,14 +4,14 @@ "defaultMessage": "!!!Staking Center", "file": "src/legacy/Dashboard/DashboardNavigator.tsx", "start": { - "line": 69, + "line": 74, "column": 9, - "index": 2216 + "index": 2530 }, "end": { - "line": 72, + "line": 77, "column": 3, - "index": 2304 + "index": 2618 } } ] \ No newline at end of file