From 9b8c48c00335d4bd2fff4b5253d5894be09eeb72 Mon Sep 17 00:00:00 2001 From: Sophia Sales <69023582+SophiaSales@users.noreply.github.com> Date: Thu, 16 May 2024 18:26:05 -0300 Subject: [PATCH] feat: refactoring theme styles (#1137) Signed-off-by: Sophia Sales Co-authored-by: Sophia Sales --- .../legacy/core/App/components/modals/ProofCancelModal.tsx | 3 +-- .../legacy/core/App/components/views/FauxNavigationBar.tsx | 2 -- packages/legacy/core/App/screens/ListProofRequests.tsx | 4 ---- packages/legacy/core/App/screens/OnboardingPages.tsx | 4 ++-- packages/legacy/core/App/screens/ProofDetails.tsx | 3 +-- packages/legacy/core/App/screens/ProofRequestDetails.tsx | 4 +--- .../legacy/core/App/screens/ProofRequestUsageHistory.tsx | 3 --- packages/legacy/core/App/screens/ProofRequesting.tsx | 3 +-- packages/legacy/core/App/theme.ts | 7 ++++++- .../__snapshots__/FauxNavigationBar.test.tsx.snap | 4 ++-- .../__snapshots__/ProofCancelModal.test.tsx.snap | 4 ++-- .../screens/__snapshots__/Onboarding.test.tsx.snap | 6 ------ .../screens/__snapshots__/ProofDetails.test.tsx.snap | 1 + .../screens/__snapshots__/ProofRequesting.test.tsx.snap | 6 +++--- 14 files changed, 20 insertions(+), 34 deletions(-) diff --git a/packages/legacy/core/App/components/modals/ProofCancelModal.tsx b/packages/legacy/core/App/components/modals/ProofCancelModal.tsx index 3f3c1c70cb..ae4d33a2d0 100644 --- a/packages/legacy/core/App/components/modals/ProofCancelModal.tsx +++ b/packages/legacy/core/App/components/modals/ProofCancelModal.tsx @@ -34,7 +34,7 @@ const ProofCancelModal: React.FC = ({ visible, onDone }) justifyContent: 'space-around', }, heading: { - ...TextTheme.modalHeadingOne, + ...TextTheme.modalTitle, marginTop: 60, marginBottom: 30, textAlign: 'center', @@ -45,7 +45,6 @@ const ProofCancelModal: React.FC = ({ visible, onDone }) }, subtext: { ...TextTheme.modalNormal, - fontSize: 22, textAlign: 'center', }, }) diff --git a/packages/legacy/core/App/components/views/FauxNavigationBar.tsx b/packages/legacy/core/App/components/views/FauxNavigationBar.tsx index 3fdc9d1dd9..42d8ae6401 100644 --- a/packages/legacy/core/App/components/views/FauxNavigationBar.tsx +++ b/packages/legacy/core/App/components/views/FauxNavigationBar.tsx @@ -34,8 +34,6 @@ const FauxNavigationBar: React.FC = ({ title, onHomeTouc }, label: { ...TextTheme.bold, - color: ColorPallet.brand.headerText, - fontSize: 17, flexGrow: 1, textAlign: 'center', paddingBottom: 12, diff --git a/packages/legacy/core/App/screens/ListProofRequests.tsx b/packages/legacy/core/App/screens/ListProofRequests.tsx index 4783727870..bb19900fdb 100644 --- a/packages/legacy/core/App/screens/ListProofRequests.tsx +++ b/packages/legacy/core/App/screens/ListProofRequests.tsx @@ -39,24 +39,20 @@ const ProofRequestsCard: React.FC = ({ navigation, templ }, templateTitle: { ...ListItems.requestTemplateTitle, - fontSize: 16, marginBottom: 4, }, templateDetails: { ...ListItems.requestTemplateDetails, - fontSize: 16, marginBottom: 4, }, templateZkpLabel: { ...ListItems.requestTemplateZkpLabel, - fontSize: 12, }, iconContainer: { alignSelf: 'center', }, icon: { ...ListItems.requestTemplateIcon, - fontSize: 36, }, }) diff --git a/packages/legacy/core/App/screens/OnboardingPages.tsx b/packages/legacy/core/App/screens/OnboardingPages.tsx index 790fce793f..3dfc526635 100644 --- a/packages/legacy/core/App/screens/OnboardingPages.tsx +++ b/packages/legacy/core/App/screens/OnboardingPages.tsx @@ -97,7 +97,7 @@ const customPages = (onTutorialCompleted: GenericFn, OnboardingTheme: any) => { - + Ornare suspendisse sed nisi lacus @@ -144,7 +144,7 @@ export const createPageWith = ( const styles = createStyles(OnboardingTheme) const imageDisplayOptions = createImageDisplayOptions(OnboardingTheme) const titleElement = ( - + {title} ) diff --git a/packages/legacy/core/App/screens/ProofDetails.tsx b/packages/legacy/core/App/screens/ProofDetails.tsx index 6167da745e..f849f6dc73 100644 --- a/packages/legacy/core/App/screens/ProofDetails.tsx +++ b/packages/legacy/core/App/screens/ProofDetails.tsx @@ -85,8 +85,7 @@ const VerifiedProof: React.FC = ({ marginVertical: 30, }, descriptionText: { - fontSize: 18, - color: TextTheme.normal.color, + ...TextTheme.normal, }, label: { fontWeight: TextTheme.bold.fontWeight, diff --git a/packages/legacy/core/App/screens/ProofRequestDetails.tsx b/packages/legacy/core/App/screens/ProofRequestDetails.tsx index d4658b30e5..30a5cb5be2 100644 --- a/packages/legacy/core/App/screens/ProofRequestDetails.tsx +++ b/packages/legacy/core/App/screens/ProofRequestDetails.tsx @@ -109,9 +109,7 @@ const ProofRequestDetails: React.FC = ({ route, naviga marginBottom: 36, }, title: { - color: TextTheme.title.color, - fontSize: 28, - fontWeight: TextTheme.bold.fontWeight, + ...TextTheme.headerTitle, }, description: { marginTop: 10, diff --git a/packages/legacy/core/App/screens/ProofRequestUsageHistory.tsx b/packages/legacy/core/App/screens/ProofRequestUsageHistory.tsx index cb8ea79994..e2db06cf0f 100644 --- a/packages/legacy/core/App/screens/ProofRequestUsageHistory.tsx +++ b/packages/legacy/core/App/screens/ProofRequestUsageHistory.tsx @@ -70,7 +70,6 @@ const ProofRequestUsageHistoryRecord: React.FC = ({ route, navigation }) color: ColorPallet.grayscale.black, }, secondaryHeaderText: { - fontWeight: TextTheme.normal.fontWeight, - fontSize: 20, + ...TextTheme.normal, textAlign: 'center', marginTop: 8, color: ColorPallet.grayscale.black, diff --git a/packages/legacy/core/App/theme.ts b/packages/legacy/core/App/theme.ts index d7c5b97a97..68d37c36b2 100644 --- a/packages/legacy/core/App/theme.ts +++ b/packages/legacy/core/App/theme.ts @@ -539,19 +539,24 @@ export const ListItems = StyleSheet.create({ requestTemplateTitle: { color: ColorPallet.grayscale.black, fontWeight: 'bold', + fontSize: 16, }, requestTemplateDetails: { color: ColorPallet.grayscale.black, fontWeight: 'normal', + fontSize: 16, }, requestTemplateZkpLabel: { color: ColorPallet.grayscale.mediumGrey, + fontSize: 12, }, requestTemplateIcon: { color: ColorPallet.grayscale.black, + fontSize: 36, }, requestTemplateDate: { color: ColorPallet.grayscale.mediumGrey, + fontSize: 10, }, }) @@ -757,7 +762,7 @@ export const OnboardingTheme = { }, headerTintColor: ColorPallet.grayscale.white, headerText: { - ...TextTheme.headingTwo, + ...TextTheme.bold, }, bodyText: { ...TextTheme.normal, diff --git a/packages/legacy/core/__tests__/components/__snapshots__/FauxNavigationBar.test.tsx.snap b/packages/legacy/core/__tests__/components/__snapshots__/FauxNavigationBar.test.tsx.snap index 91cbb9d460..ff700bbb9b 100644 --- a/packages/legacy/core/__tests__/components/__snapshots__/FauxNavigationBar.test.tsx.snap +++ b/packages/legacy/core/__tests__/components/__snapshots__/FauxNavigationBar.test.tsx.snap @@ -37,7 +37,7 @@ Array [ Object { "color": "#FFFFFF", "flexGrow": 1, - "fontSize": 17, + "fontSize": 18, "fontWeight": "bold", "paddingBottom": 12, "textAlign": "center", @@ -147,7 +147,7 @@ Array [ Object { "color": "#FFFFFF", "flexGrow": 1, - "fontSize": 17, + "fontSize": 18, "fontWeight": "bold", "paddingBottom": 12, "textAlign": "center", diff --git a/packages/legacy/core/__tests__/components/__snapshots__/ProofCancelModal.test.tsx.snap b/packages/legacy/core/__tests__/components/__snapshots__/ProofCancelModal.test.tsx.snap index 4f2aa5c15c..04c89f625f 100644 --- a/packages/legacy/core/__tests__/components/__snapshots__/ProofCancelModal.test.tsx.snap +++ b/packages/legacy/core/__tests__/components/__snapshots__/ProofCancelModal.test.tsx.snap @@ -34,7 +34,7 @@ exports[`ProofCancelModal Component Rerenders correctly when not visible 1`] = ` style={ Object { "color": "#FFFFFF", - "fontSize": 38, + "fontSize": 24, "fontWeight": "bold", "marginBottom": 30, "marginTop": 60, @@ -57,7 +57,7 @@ exports[`ProofCancelModal Component Rerenders correctly when not visible 1`] = ` style={ Object { "color": "#FFFFFF", - "fontSize": 22, + "fontSize": 18, "fontWeight": "normal", "textAlign": "center", } diff --git a/packages/legacy/core/__tests__/screens/__snapshots__/Onboarding.test.tsx.snap b/packages/legacy/core/__tests__/screens/__snapshots__/Onboarding.test.tsx.snap index 796795cf41..ac724eb370 100644 --- a/packages/legacy/core/__tests__/screens/__snapshots__/Onboarding.test.tsx.snap +++ b/packages/legacy/core/__tests__/screens/__snapshots__/Onboarding.test.tsx.snap @@ -58,9 +58,6 @@ exports[`Onboarding Onboarding Developer mode 1`] = ` style={ Array [ Object {}, - Object { - "fontSize": 18, - }, ] } testID="com.ariesbifold:id/HeaderText" @@ -207,9 +204,6 @@ exports[`Onboarding Onboarding Developer mode 1`] = ` style={ Array [ Object {}, - Object { - "fontSize": 18, - }, ] } testID="com.ariesbifold:id/DeveloperModeTouch" diff --git a/packages/legacy/core/__tests__/screens/__snapshots__/ProofDetails.test.tsx.snap b/packages/legacy/core/__tests__/screens/__snapshots__/ProofDetails.test.tsx.snap index 27a97f0996..8a40952de4 100644 --- a/packages/legacy/core/__tests__/screens/__snapshots__/ProofDetails.test.tsx.snap +++ b/packages/legacy/core/__tests__/screens/__snapshots__/ProofDetails.test.tsx.snap @@ -847,6 +847,7 @@ exports[`ProofDetails Component with a verified proof record renders correctly w Object { "color": "#FFFFFF", "fontSize": 18, + "fontWeight": "normal", } } > diff --git a/packages/legacy/core/__tests__/screens/__snapshots__/ProofRequesting.test.tsx.snap b/packages/legacy/core/__tests__/screens/__snapshots__/ProofRequesting.test.tsx.snap index 74acd61f4c..bc2ec291c7 100644 --- a/packages/legacy/core/__tests__/screens/__snapshots__/ProofRequesting.test.tsx.snap +++ b/packages/legacy/core/__tests__/screens/__snapshots__/ProofRequesting.test.tsx.snap @@ -99,7 +99,7 @@ exports[`ProofRequesting Component generate new qr works correctly 1`] = ` style={ Object { "color": "#000000", - "fontSize": 20, + "fontSize": 18, "fontWeight": "normal", "marginTop": 8, "textAlign": "center", @@ -296,7 +296,7 @@ exports[`ProofRequesting Component renders correctly 1`] = ` style={ Object { "color": "#000000", - "fontSize": 20, + "fontSize": 18, "fontWeight": "normal", "marginTop": 8, "textAlign": "center", @@ -449,7 +449,7 @@ exports[`ProofRequesting Component renders correctly 2`] = ` style={ Object { "color": "#000000", - "fontSize": 20, + "fontSize": 18, "fontWeight": "normal", "marginTop": 8, "textAlign": "center",