support(UI-Improvment): Accents are cropped on the Onboarding carousel

LedgerHQ · Sep 21, 2022 · 66158fa · 66158fa
1 parent fb0128b
commit 66158fa
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 5 deletions.
diff --git a/.changeset/few-books-reflect.md b/.changeset/few-books-reflect.md
@@ -0,0 +1,5 @@
+---
+"live-mobile": patch
+---
+
+Accents are cropped on the Onboarding carousel
diff --git a/apps/ledger-live-mobile/src/screens/Onboarding/OnboardingQuizItem.tsx b/apps/ledger-live-mobile/src/screens/Onboarding/OnboardingQuizItem.tsx
@@ -56,6 +56,7 @@ export default function OnboardingQuizItem({
                 mb={7}
                 textAlign="center"
                 color="constant.black"
+                lineHeight="34.8px"
               >
                 {selectedAnswer.title}
               </Text>
@@ -64,7 +65,13 @@ export default function OnboardingQuizItem({
               </Text>
             </>
           ) : (
-            <Text variant="h2" mt={8} textAlign="center" color="constant.black">
+            <Text
+              variant="h2"
+              mt={8}
+              textAlign="center"
+              color="constant.black"
+              lineHeight="34.8px"
+            >
               {question}
             </Text>
           )}

diff --git a/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx b/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
@@ -40,7 +40,13 @@ const Card = ({ index /* , deviceModelId */ }: CardType) => {
           lightSource={images.light[index]}
         />
       </Flex>
-      <Text variant="h2" mb={3} textAlign="center" color="constant.black">
+      <Text
+        variant="h2"
+        mb={3}
+        textAlign="center"
+        color="constant.black"
+        lineHeight="34.8px"
+      >
         {t(`onboarding.stepNewDevice.${index}.title`)}
       </Text>
       <Text textAlign="center" variant="body" color="constant.black">

diff --git a/apps/ledger-live-mobile/src/screens/Onboarding/steps/setupDevice/scenes/Intro.tsx b/apps/ledger-live-mobile/src/screens/Onboarding/steps/setupDevice/scenes/Intro.tsx
@@ -25,7 +25,7 @@ const IntroScene = () => {
 
   return (
     <>
-      <Text variant="h2" mb={10} uppercase>
+      <Text variant="h2" mb={10} uppercase lineHeight="34.8px">
         {t("onboarding.stepSetupDevice.start.title")}
       </Text>
       <IconBoxList

diff --git a/apps/ledger-live-mobile/src/screens/Onboarding/steps/setupDevice/scenes/QuizzFinal.tsx b/apps/ledger-live-mobile/src/screens/Onboarding/steps/setupDevice/scenes/QuizzFinal.tsx
@@ -8,7 +8,13 @@ const QuizzFinalScene = ({ success }: { success: boolean }) => {
 
   return (
     <>
-      <Text variant="h2" color="palette.neutral.c100" mb={3} uppercase>
+      <Text
+        variant="h2"
+        color="palette.neutral.c100"
+        mb={3}
+        uppercase
+        lineHeight="34.8px"
+      >
         {t(`onboarding.quizz.final.${success ? "successTitle" : "failTitle"}`)}
       </Text>
       <Text variant="paragraph" color="palette.neutral.c80" mb={10}>

diff --git a/apps/ledger-live-mobile/src/screens/Onboarding/steps/setupDevice/scenes/RecoveryPhrase.tsx b/apps/ledger-live-mobile/src/screens/Onboarding/steps/setupDevice/scenes/RecoveryPhrase.tsx
@@ -8,7 +8,13 @@ const RecoveryPhraseScene = () => {
 
   return (
     <>
-      <Text variant="h2" color="palette.neutral.c100" mb={4} uppercase>
+      <Text
+        variant="h2"
+        color="palette.neutral.c100"
+        mb={4}
+        uppercase
+        lineHeight="34.8px"
+      >
         {t("onboarding.stepSetupDevice.recoveryPhrase.title")}
       </Text>
       <Text variant="paragraph" color="palette.neutral.c80" mb={4}>