UI + font family import changes

src/pages/onboarding/Welcome.module.scss

@@ -8,6 +8,7 @@
     z-index: 1;
     box-shadow: 0px 0px 10px 5px rgba(var(--black-rgb), 0.5);
     animation: riseup 1s forwards;
+    animation-delay: 1s;
     display: flex;
     align-items: center;
     justify-content: center;
@@ -17,7 +18,7 @@
         width: 100%;
         margin: 0;
         animation: fadeIn 1s forwards;
-        animation-delay: 0.5s;
+        animation-delay: 1.5s;
         opacity: 0;
         transform: translateY(10vh);
     }
@@ -50,38 +51,39 @@
     padding: 5%;
 
     animation: fadeIn 1s forwards;
-    animation-delay: 1s;
+    animation-delay: 2s;
     opacity: 0;
     transform: translateY(10vh);
 
     h2 {
-        font-size: 24px;
+        font-size: 28px;
         font-weight: 700;
     }
 
     p {
-        font-size: 14px;
+        font-size: 15px;
         color: rgba(var(--black-rgb), 0.5);
+        margin: 20px 0;
     }
 
     .actionButtonsHolder {
         width: 80%;
-        margin: 0 auto;
+        margin: 30px auto;
 
         .actionButton {
-            height: 40px;
+            height: 50px;
             text-transform: none;
-            font-size: 16px;
-            margin: 20px 0;            
+            font-size: 16px;            
             --border-radius: 30px;
             --border-color: var(--teal);
-            font-weight: 700;
+            font-weight: 500;
 
             &:nth-child(1) {
-                --background: var(--teal);                
+                --background: var(--teal);            
             }
 
             &:nth-child(2) {
+                margin-top: 20px;
                 --color: var(--teal);
             }
         }

src/pages/onboarding/Welcome.tsx

@@ -28,7 +28,8 @@ class WelcomePage extends Component<Props, OwnState> {
                     <div className={styles.container}>
                         <h2> Let's Get Started </h2>
                         <p>
-                            Lorem ipsum dolor sit amet consectetur adipisicing elit. Obcaecati dicta itaque quaerat labore distinctio natus ex nostrum. Ea assumenda numquam temporibus quisquam inventore facilis, fugiat ut distinctio accusamus maxime iure?
+                            Welcome to <strong> Workex </strong>, we're more super excited to have you onboard!
+                            You can always show your love by rating us a 5 Star on Play Store!
                         </p>
 
                         <div className={styles.actionButtonsHolder}>

src/theme/variables.css

@@ -1,33 +1,7 @@
-@font-face {
-    font-family: "adobe-clean";
-    src: url('../assets/fonts/AdobeClean-Regular.ttf');
-    font-weight: 500;
-    font-style: normal;
-}
-
-@font-face {
-    font-family: "adobe-clean";
-    src: url('../assets/fonts/AdobeClean-Light.ttf');
-    font-weight: 300;
-    font-style: normal;
-}
-
-@font-face {
-    font-family: "adobe-clean";
-    src: url('../assets/fonts/AdobeClean-Bold.ttf');
-    font-weight: 700;
-    font-style: normal;
-}
-
-@font-face {
-    font-family: "adobe-clean";
-    src: url('../assets/fonts/AdobeClean-It.ttf');
-    font-weight: 500;
-    font-style: italic;
-}
+@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;600;700&display=swap');
 
 * {
-    font-family: "adobe-clean";
+    font-family: 'Poppins', sans-serif;
     font-weight: 500;
     letter-spacing: 0.5px;
     line-height: 1.5;
@@ -35,6 +9,10 @@
     padding: 0;
 }
 
+h1, h2, h3, h4, h5, h6 {
+    font-weight: 700;
+}
+
 /* Ionic Variables and Theming. For more info, please see:
 http://ionicframework.com/docs/theming/ */