Merge pull request #9130 from LedgerHQ/fix/LIVE-16804

🐛 fix(llm) missing style props for hero card
LedgerHQ · Feb 6, 2025 · d12c829 · d12c829
2 parents 6c79871 + bc9001a
commit d12c829
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 6 deletions.
diff --git a/.changeset/new-colts-wash.md b/.changeset/new-colts-wash.md
@@ -0,0 +1,5 @@
+---
+"live-mobile": minor
+---
+
+Missing style properties for hero card text. We text wasn't centered well
diff --git a/apps/ledger-live-mobile/src/contentCards/cards/hero/elements.tsx b/apps/ledger-live-mobile/src/contentCards/cards/hero/elements.tsx
@@ -26,6 +26,7 @@ export const Close = ({ onPress }: { onPress: ButtonAction }) => {
 type LabelProps = {
   label: string;
   hasSecondaryText?: boolean;
+  isCentered?: boolean;
 };
 
 export const Tag = ({ label }: LabelProps) => {
@@ -48,13 +49,14 @@ export const Tag = ({ label }: LabelProps) => {
   );
 };
 
-export const Title = ({ label, hasSecondaryText }: LabelProps) => {
+export const Title = ({ label, hasSecondaryText, isCentered }: LabelProps) => {
   const { colors } = useTheme();
 
   return (
     <Text
-      variant="body"
+      variant="large"
       fontWeight="medium"
+      textAlign={isCentered ? "center" : "start"}
       color={!hasSecondaryText ? colors.neutral.c80 : colors.neutral.c100}
       lineHeight={"18px"}
     >
@@ -63,11 +65,23 @@ export const Title = ({ label, hasSecondaryText }: LabelProps) => {
   );
 };
 
-export const SecondaryText = ({ label }: { label: string }) => {
+export const SecondaryText = ({
+  label,
+  isCentered,
+}: {
+  label: string;
+  isCentered: boolean | undefined;
+}) => {
   const { colors } = useTheme();
 
   return (
-    <Text variant="small" color={colors.neutral.c70} lineHeight={"16px"}>
+    <Text
+      variant="body"
+      fontWeight="medium"
+      color={colors.neutral.c70}
+      textAlign={isCentered ? "center" : "start"}
+      lineHeight={"16px"}
+    >
       {label.replace(/\\n/g, "\n")}
     </Text>
   );

diff --git a/apps/ledger-live-mobile/src/contentCards/cards/hero/index.tsx b/apps/ledger-live-mobile/src/contentCards/cards/hero/index.tsx
@@ -24,8 +24,10 @@ const HeroCard = ContentCardBuilder<Props>(
           {tag && <Tag label={tag} />}
           {(title || secondaryText) && (
             <Flex alignItems={centeredText ? "center" : "start"}>
-              {title && <Title label={title} hasSecondaryText={!!secondaryText} />}
-              {secondaryText && <SecondaryText label={secondaryText} />}
+              {title && (
+                <Title label={title} hasSecondaryText={!!secondaryText} isCentered={centeredText} />
+              )}
+              {secondaryText && <SecondaryText isCentered={centeredText} label={secondaryText} />}
             </Flex>
           )}
           {cta && (