bugfix(Layout): Layout issue with the error message if Bluetooth is d…

…isabled when user pairs device (#1307) * bugfix(Layout): Layout issue with the error message if Bluetooth is disabled when user pairs device * 🤓 Review
LedgerHQ · Oct 4, 2022 · 1592d5e · 1592d5e
1 parent c98114a
commit 1592d5e
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/.changeset/quick-moles-fix.md b/.changeset/quick-moles-fix.md
@@ -0,0 +1,5 @@
+---
+"live-mobile": patch
+---
+
+Layout issue with the error message if Bluetooth is disabled when user pairs device
diff --git a/apps/ledger-live-mobile/src/components/RequiresBLE/BluetoothDisabled.tsx b/apps/ledger-live-mobile/src/components/RequiresBLE/BluetoothDisabled.tsx
@@ -11,6 +11,8 @@ const SafeAreaContainer = styled.SafeAreaView`
   align-items: center;
   justify-content: center;
   background-color: ${p => p.theme.colors.background.main};
+  margin-left: ${p => `${p.theme.space[4]}px`};
+  margin-right: ${p => `${p.theme.space[4]}px`};
 `;
 
 function BluetoothDisabled() {
@@ -24,13 +26,13 @@ function BluetoothDisabled() {
   return (
     <SafeAreaContainer>
       <IconBox Icon={BluetoothMedium} iconSize={24} boxSize={64} />
-      <Text variant={"h2"} mb={5} mt={7}>
+      <Text variant={"h2"} mb={5} mt={7} textAlign="center">
         <Trans i18nKey="bluetooth.required" />
       </Text>
       <Text
         variant={"body"}
         fontWeight={"medium"}
-        textAlign={"justify"}
+        textAlign="center"
         color={"neutral.c80"}
       >
         <Trans i18nKey="bluetooth.checkEnabled" values={deviceNames.nanoX} />