Merge branch 'master' into FYLE-86cxbrpvr

android/app/src/main/res/drawable/ic_launcher_new_splash_foreground.xml

@@ -16,19 +16,19 @@
         android:fillType="evenOdd"/>
     <path
         android:pathData="M29.629,4.657V7.149H33.45V9.688H29.629V16.883H27V4.657C27,3.199 28.217,2 29.75,2H34.473V4.563H29.75C29.677,4.539 29.629,4.586 29.629,4.657Z"
-        android:fillColor="#F3F5F7"
+        android:fillColor="#000000"
         android:fillType="evenOdd"/>
     <path
         android:pathData="M44.744,22H37.637V19.437H44.744C44.793,19.437 44.866,19.39 44.866,19.32V17.533H38.465C36.955,17.533 35.714,16.334 35.714,14.876V6.389H38.343V14.9C38.343,14.97 38.391,15.041 38.489,15.041H44.744C44.793,15.041 44.866,14.994 44.866,14.9V6.389H47.495V19.343C47.471,20.801 46.254,22 44.744,22Z"
-        android:fillColor="#F3F5F7"
+        android:fillColor="#000000"
         android:fillType="evenOdd"/>
     <path
         android:pathData="M52.193,2V14.226C52.193,14.296 52.242,14.367 52.314,14.367H54.651V16.906H52.314C50.805,16.906 49.564,15.707 49.564,14.249V2.024H52.193V2Z"
-        android:fillColor="#F3F5F7"
+        android:fillColor="#000000"
         android:fillType="evenOdd"/>
     <path
         android:pathData="M67.868,12.533V8.325C67.868,6.867 66.627,5.668 65.118,5.691H58.862C57.353,5.691 56.112,6.89 56.112,8.348V14.226C56.112,15.684 57.353,16.883 58.862,16.883H67.868V14.343H58.838C58.741,14.343 58.692,14.273 58.692,14.202V12.533H67.868ZM65.264,8.325V9.994H58.716V8.325C58.716,8.23 58.789,8.183 58.862,8.183H65.118C65.215,8.183 65.264,8.254 65.264,8.325Z"
-        android:fillColor="#F3F5F7"
+        android:fillColor="#000000"
         android:fillType="evenOdd"/>
   </group>
 </vector>

android/app/src/main/res/values/ic_launcher_new_splash_background.xml

@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="ic_launcher_new_splash_background">#220033</color>
+    <color name="ic_launcher_new_splash_background">#FFFFFF</color>
 </resources>

android/app/src/main/res/values/styles.xml

@@ -18,6 +18,6 @@
 
     <style name="AppTheme.NoActionBarLaunch" parent="Theme.SplashScreen">
         <item name="windowSplashScreenAnimatedIcon">@mipmap/ic_launcher_new_splash</item>
-        <item name="windowSplashScreenBackground">#220033</item>
+        <item name="windowSplashScreenBackground">#ffffff</item>
     </style>
 </resources>

capacitor.config.json

@@ -0,0 +1 @@
+{}

ios/App/App/Base.lproj/LaunchScreen.storyboard

@@ -22,7 +22,7 @@
                             </imageView>
                         </subviews>
                         <viewLayoutGuide key="safeArea" id="Bcu-3y-fUS"/>
-                        <color key="backgroundColor" red="0.13333333333333333" green="0.0" blue="0.20000000000000001" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
                     </view>
                 </viewController>
                 <placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>

src/app/auth/disabled/disabled.page.html

@@ -1,25 +1,33 @@
 <ion-content>
-  <ion-grid class="disabled--header-container">
-    <ion-row class="disabled--header ion-align-items-center">
-      <ion-col class="disabled--header-logo-container">
-        <img class="disabled--header-logo" src="../../../assets/svg/fyle-logo-light.svg" alt="fyle-logo-light" />
-      </ion-col>
-    </ion-row>
-  </ion-grid>
-  <div class="disabled--body">
-    <div id="disabled--header" class="disabled--body-header">Account Disabled</div>
-    <img class="disabled--image" src="../../../assets/images/stop.svg" alt="Stop" />
-    <div class="disabled--subtext">
-      This account is no longer active. Please contact your company admin for details.
+  <div class="disabled-user">
+    <div class="disabled-user__content-container">
+      <div class="disabled-user__error-icon-container">
+        <ion-icon
+          class="disabled-user__error-icon"
+          [src]="'/assets/svg/error-outlined.svg'"
+          slot="icon-only"
+        ></ion-icon>
+      </div>
+      <section class="disabled-user__text">
+        <h1 class="disabled-user__header">Account disabled</h1>
+        <p class="disabled-user__content">
+          This account is no longer active. Please contact your company admin for details.
+        </p>
+      </section>
+    </div>
+    <div class="disabled-user__cta">
+      <ion-button
+        (click)="onGotoSignInClick()"
+        class="btn-primary"
+        fill="clear"
+        aria-label="Navigate back to sign in page"
+        role="button"
+      >
+        <div class="disabled-user__cta-content">
+          <ion-icon class="disabled-user__arrow-icon" [src]="'/assets/svg/arrow-left.svg'" slot="icon-only"></ion-icon>
+          <span class="disabled-user__cta-text">Back to sign in</span>
+        </div>
+      </ion-button>
     </div>
   </div>
 </ion-content>
-
-<ion-footer>
-  <ion-toolbar mode="md">
-    <ion-button fill="clear" expand="full" (click)="onGotoSignInClick()">
-      <span class="disabled--greyed"> Incorrect Account? </span>
-      Try Signing in Again
-    </ion-button>
-  </ion-toolbar>
-</ion-footer>

src/app/auth/disabled/disabled.page.scss

@@ -1,93 +1,80 @@
-$disabled-header: #220033;
-$body-header: #000;
-$body-subheader: #4a4a4a;
-$password-icon: #b9beba;
-$secondary-cta-border: #e0e0e0;
+@import '../../../theme/colors.scss';
 
-.disabled {
-  &--header {
-    min-height: 140px;
-  }
-
-  &--header-container {
-    min-height: 140px;
-    background-color: $disabled-header;
-  }
+.disabled-user {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  height: 100%;
 
-  &--header-logo-container {
-    text-align: center;
+  &__content-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    flex-grow: 2;
   }
 
-  &--header-logo {
-    max-width: 100px;
+  &__arrow-icon {
+    fill: $pure-white;
+    margin-right: 8px;
   }
 
-  &--body {
-    padding: 24px;
-    text-align: center;
+  &__cta-text {
+    font-size: 14px;
+    font-weight: 500;
   }
 
-  &--body-field {
-    width: 100%;
+  &__cta {
+    margin: 0 20px 24px 20px;
   }
 
-  &--body-header {
-    font-size: 24px;
-    margin-top: 16px;
-    margin-bottom: 8px;
-    color: $body-header;
-    font-weight: 700;
+  &__cta-content {
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
-  &--image {
-    max-width: 125px;
-    padding: 12px;
+  &__error-icon-container {
+    width: 60px;
+    height: 60px;
+    border-radius: 8px;
+    background: $pale-pink;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 16px;
   }
 
-  &--subtext {
-    font-size: 16px;
-    color: $body-subheader;
-    margin-top: 8px;
-    margin-bottom: 24px;
+  &__error-icon {
+    width: 45px;
+    height: 45px;
   }
 
-  &--primary-cta {
-    .mat-button-base {
-      width: 100%;
-      font-weight: 700;
-      min-height: 47px;
-    }
+  &__text {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    flex-direction: column;
   }
 
-  &--password-visibility-icon {
-    color: $password-icon;
+  &__header {
+    color: $black;
+    font-size: 20px;
+    font-style: normal;
+    font-weight: 500;
+    line-height: normal;
+    height: 26px;
+    margin: 0;
   }
 
-  &--secondary-cta {
-    .mat-button-base {
-      width: 100%;
-      font-weight: 700;
-      min-height: 47px;
-      letter-spacing: 1.6px;
-      border: 1px solid $secondary-cta-border;
-    }
-    margin-top: 24px;
-  }
-
-  &--redirect {
-    margin: 16px;
+  &__content {
+    color: $black-light;
     text-align: center;
-    font-size: 16px;
-    a {
-      text-decoration: none;
-    }
-  }
-
-  &--edit-email {
-    text-align: end;
-  }
-
-  &--greyed {
-    color: grey;
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 1.25;
+    height: 36px;
+    width: 274px;
   }
 }

src/app/auth/new-password/new-password.module.ts

@@ -17,6 +17,7 @@ import { MatIconModule } from '@angular/material/icon';
 import { MatButtonModule } from '@angular/material/button';
 
 import { PopupComponent } from './popup/popup.component';
+import { SharedModule } from 'src/app/shared/shared.module';
 
 @NgModule({
   imports: [
@@ -30,6 +31,7 @@ import { PopupComponent } from './popup/popup.component';
     ReactiveFormsModule,
     MatIconModule,
     MatButtonModule,
+    SharedModule,
   ],
   declarations: [NewPasswordPage, PopupComponent],
 })