From 7068b78e88f7f1f28427e8e7a336b34219019f49 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Luis=20Sacrist=C3=A1n?= <displaynone@gmail.com>
Date: Thu, 20 Apr 2023 19:05:17 +0200
Subject: [PATCH] chore: improved styling

---
 app/qr/index.tsx | 4 ++--
 src/ui/Text.tsx  | 4 +++-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/app/qr/index.tsx b/app/qr/index.tsx
index 5df673c..ff5164d 100644
--- a/app/qr/index.tsx
+++ b/app/qr/index.tsx
@@ -56,7 +56,7 @@ const QRScanner: FC = () => {
         <Text size="headlineSmall" variant={['bold', 'primary']}>
           <Trans>Add a new site</Trans>
         </Text>
-        <Text size="bodyLarge" variant={'secondary'}>
+        <Text size="bodyLarge" variant={'secondary'} numberOfLines={2}>
           <Trans>
             Scan your website's 2FA QR code using your device's camera
           </Trans>
@@ -70,7 +70,7 @@ const QRScanner: FC = () => {
                 ratio="1:1"
               />
             </View>
-            <Text size="bodyMedium" variant={'secondary'}>
+            <Text size="bodyMedium" variant={'secondary'} numberOfLines={2}>
               <Trans>
                 The QR code can be easily recognized by simply pointing your
                 device's camera at it
diff --git a/src/ui/Text.tsx b/src/ui/Text.tsx
index bf0d837..571db2d 100644
--- a/src/ui/Text.tsx
+++ b/src/ui/Text.tsx
@@ -20,12 +20,14 @@ export type TextVariantTypes = (typeof variants)[number];
 export type TextProps = {
   variant?: TextVariantTypes | TextVariantTypes[];
   size?: keyof typeof MD3TypescaleKey;
+  numberOfLines?: number;
 };
 
 const Text: FC<ComponentWithChildren & TextProps> = ({
   children,
   variant = 'primary',
   size,
+  numberOfLines = 1,
 }) => {
   const theme = useTheme();
   const styles = getStyles(theme);
@@ -36,7 +38,7 @@ const Text: FC<ComponentWithChildren & TextProps> = ({
     <PaperText
       style={[styles.common, listOfStiles]}
       variant={size}
-      numberOfLines={1}
+      numberOfLines={numberOfLines}
     >
       {children}
     </PaperText>