From f610f5c6404fdd061935b396751b82778898b769 Mon Sep 17 00:00:00 2001
From: Martin Cayuelas <martin.cayuelas@ledger.fr>
Date: Wed, 28 Sep 2022 11:07:05 +0200
Subject: [PATCH 1/4] =?UTF-8?q?=F0=9F=92=84=20support(UI):=20Onboarding=20?=
 =?UTF-8?q?quizz=20pixel=20polish=20LLM?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Onboarding/steps/newDeviceInfo.tsx        | 61 +++++++++++++------
 1 file changed, 42 insertions(+), 19 deletions(-)

diff --git a/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx b/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
index 55580397fd0d..61af212f6759 100644
--- a/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
+++ b/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
@@ -5,12 +5,15 @@ import { Flex, Carousel, Text, Button, Icons } from "@ledgerhq/native-ui";
 import { useNavigation, useRoute, RouteProp } from "@react-navigation/native";
 import { SafeAreaView } from "react-native-safe-area-context";
 import styled from "styled-components/native";
+import { space } from "@ledgerhq/native-ui/styles/theme";
+import { StyleSheet } from "react-native";
 import { ScreenName } from "../../../const";
 import Illustration from "../../../images/illustration/Illustration";
 
 import { normalize } from "../../../helpers/normalizeSize";
 
 import { DeviceNames } from "../types";
+import InvertTheme from "../../../components/theme/InvertTheme";
 
 const StyledSafeAreaView = styled(SafeAreaView)`
   flex: 1;
@@ -33,7 +36,7 @@ const Card = ({ index /* , deviceModelId */ }: CardType) => {
   const { t } = useTranslation();
   return (
     <Flex flex={1} justifyContent="center" alignItems="center" px={20}>
-      <Flex>
+      <Flex mb={`${space[8]}px`}>
         <Illustration
           size={normalize(240)}
           darkSource={images.light[index]}
@@ -43,7 +46,7 @@ const Card = ({ index /* , deviceModelId */ }: CardType) => {
       <Text variant="h2" mb={3} textAlign="center" color="constant.black">
         {t(`onboarding.stepNewDevice.${index}.title`)}
       </Text>
-      <Text textAlign="center" variant="body" color="constant.black">
+      <Text textAlign="center" variant="bodyLineHeight" color="constant.black">
         {t(`onboarding.stepNewDevice.${index}.desc`)}
       </Text>
     </Flex>
@@ -76,7 +79,7 @@ const Footer = ({ index }: { index: number }) => {
 
   return (
     <Animatable.View
-      style={{ width: "100%" }}
+      style={styles.animatable}
       animation="fadeIn"
       useNativeDriver
     >
@@ -95,35 +98,55 @@ function OnboardingStepNewDevice() {
   const route = useRoute<CurrentRouteType>();
   const navigation = useNavigation();
   const { deviceModelId } = route.params;
-
+  const { t } = useTranslation();
   const handleBack = useCallback(() => navigation.goBack(), [navigation]);
 
   return (
     <StyledSafeAreaView>
       <Flex
         flexDirection="row"
-        justifyContent="space-between"
+        justifyContent="center"
         alignItems="center"
         width="100%"
         height={48}
       >
-        <Button Icon={Icons.ArrowLeftMedium} onPress={handleBack} />
-      </Flex>
-      <Carousel onChange={setCurrentIndex}>
-        {new Array(5).fill(null).map((_, index) => (
-          <Card index={index} key={index} deviceModelId={deviceModelId} />
-        ))}
-      </Carousel>
-      <Flex
-        minHeight="60px"
-        width="100%"
-        justifyContent="center"
-        alignItems="center"
-      >
-        <Footer index={currentIndex} />
+        <Button
+          Icon={() => <Icons.ArrowLeftMedium color="neutral.c00" size={24} />}
+          onPress={handleBack}
+          style={styles.backArrow}
+        />
+        <Text variant="h3" mb={3} textAlign="center" color="constant.black">
+          {t(`onboarding.stepNewDevice.${currentIndex}.label`)}
+        </Text>
       </Flex>
+      <InvertTheme>
+        <Carousel onChange={setCurrentIndex}>
+          {new Array(5).fill(null).map((_, index) => (
+            <Card index={index} key={index} deviceModelId={deviceModelId} />
+          ))}
+        </Carousel>
+        <Flex
+          minHeight="60px"
+          width="100%"
+          justifyContent="center"
+          alignItems="center"
+        >
+          <Footer index={currentIndex} />
+        </Flex>
+      </InvertTheme>
     </StyledSafeAreaView>
   );
 }
 
+const styles = StyleSheet.create({
+  animatable: {
+    width: "100%",
+  },
+  backArrow: {
+    position: "absolute",
+    top: -5,
+    left: 0,
+  },
+});
+
 export default OnboardingStepNewDevice;

From fdc072dcf4044df03923adc67df71396388998de Mon Sep 17 00:00:00 2001
From: Martin Cayuelas <martin.cayuelas@ledger.fr>
Date: Wed, 28 Sep 2022 11:32:02 +0200
Subject: [PATCH 2/4] =?UTF-8?q?=F0=9F=93=9D=20Changelog?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .changeset/real-keys-pull.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/real-keys-pull.md

diff --git a/.changeset/real-keys-pull.md b/.changeset/real-keys-pull.md
new file mode 100644
index 000000000000..754a3997892b
--- /dev/null
+++ b/.changeset/real-keys-pull.md
@@ -0,0 +1,5 @@
+---
+"live-mobile": patch
+---
+
+Onboarding quizz pixel polish LLM

From 37ac29940e9aeddf76aaeb64c6110de95c06b238 Mon Sep 17 00:00:00 2001
From: Martin Cayuelas <martin.cayuelas@ledger.fr>
Date: Thu, 6 Oct 2022 12:00:50 +0200
Subject: [PATCH 3/4] =?UTF-8?q?=F0=9F=93=9D=20Review?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/screens/Onboarding/steps/newDeviceInfo.tsx    | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx b/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
index 61af212f6759..8bf9b1f1faa8 100644
--- a/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
+++ b/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
@@ -36,7 +36,7 @@ const Card = ({ index /* , deviceModelId */ }: CardType) => {
   const { t } = useTranslation();
   return (
     <Flex flex={1} justifyContent="center" alignItems="center" px={20}>
-      <Flex mb={`${space[8]}px`}>
+      <Flex mb={8}>
         <Illustration
           size={normalize(240)}
           darkSource={images.light[index]}
@@ -113,7 +113,9 @@ function OnboardingStepNewDevice() {
         <Button
           Icon={() => <Icons.ArrowLeftMedium color="neutral.c00" size={24} />}
           onPress={handleBack}
-          style={styles.backArrow}
+          position="absolute"
+          top={-5}
+          left={0}
         />
         <Text variant="h3" mb={3} textAlign="center" color="constant.black">
           {t(`onboarding.stepNewDevice.${currentIndex}.label`)}
@@ -142,11 +144,6 @@ const styles = StyleSheet.create({
   animatable: {
     width: "100%",
   },
-  backArrow: {
-    position: "absolute",
-    top: -5,
-    left: 0,
-  },
 });
 
 export default OnboardingStepNewDevice;

From 3e9ec68d69e16189b7e7755ac4d223fdd4030027 Mon Sep 17 00:00:00 2001
From: Martin Cayuelas <martin.cayuelas@ledger.fr>
Date: Thu, 6 Oct 2022 14:24:32 +0200
Subject: [PATCH 4/4] =?UTF-8?q?=F0=9F=93=9D=20Review?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Onboarding/steps/newDeviceInfo.tsx        | 21 ++++++++++++-------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx b/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
index 8bf9b1f1faa8..b92635532ba4 100644
--- a/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
+++ b/apps/ledger-live-mobile/src/screens/Onboarding/steps/newDeviceInfo.tsx
@@ -5,7 +5,6 @@ import { Flex, Carousel, Text, Button, Icons } from "@ledgerhq/native-ui";
 import { useNavigation, useRoute, RouteProp } from "@react-navigation/native";
 import { SafeAreaView } from "react-native-safe-area-context";
 import styled from "styled-components/native";
-import { space } from "@ledgerhq/native-ui/styles/theme";
 import { StyleSheet } from "react-native";
 import { ScreenName } from "../../../const";
 import Illustration from "../../../images/illustration/Illustration";
@@ -13,7 +12,7 @@ import Illustration from "../../../images/illustration/Illustration";
 import { normalize } from "../../../helpers/normalizeSize";
 
 import { DeviceNames } from "../types";
-import InvertTheme from "../../../components/theme/InvertTheme";
+import ForceTheme from "../../../components/theme/ForceTheme";
 
 const StyledSafeAreaView = styled(SafeAreaView)`
   flex: 1;
@@ -111,22 +110,23 @@ function OnboardingStepNewDevice() {
         height={48}
       >
         <Button
-          Icon={() => <Icons.ArrowLeftMedium color="neutral.c00" size={24} />}
+          Icon={() => (
+            <Icons.ArrowLeftMedium color="constant.black" size={24} />
+          )}
           onPress={handleBack}
-          position="absolute"
-          top={-5}
-          left={0}
+          style={styles.backArrow}
         />
         <Text variant="h3" mb={3} textAlign="center" color="constant.black">
           {t(`onboarding.stepNewDevice.${currentIndex}.label`)}
         </Text>
       </Flex>
-      <InvertTheme>
+      <ForceTheme selectedPalette={"light"}>
         <Carousel onChange={setCurrentIndex}>
           {new Array(5).fill(null).map((_, index) => (
             <Card index={index} key={index} deviceModelId={deviceModelId} />
           ))}
         </Carousel>
+
         <Flex
           minHeight="60px"
           width="100%"
@@ -135,7 +135,7 @@ function OnboardingStepNewDevice() {
         >
           <Footer index={currentIndex} />
         </Flex>
-      </InvertTheme>
+      </ForceTheme>
     </StyledSafeAreaView>
   );
 }
@@ -144,6 +144,11 @@ const styles = StyleSheet.create({
   animatable: {
     width: "100%",
   },
+  backArrow: {
+    position: "absolute",
+    top: -5,
+    left: 0,
+  },
 });
 
 export default OnboardingStepNewDevice;