Création de compte

src/app/pages/compte/login/login.page.html

 <ion-header>
-  <ion-toolbar color="primary">
+  <ion-toolbar color="primary" padding-right>
     <ion-title>Connexion</ion-title>
     <ion-button size="small" fill="solid" color="light" slot="end" (click)="presentHelpModal()">
       <ion-icon name="information"></ion-icon>
@@ -9,30 +9,6 @@
 <ion-content text-center color="primary" padding>
   <!-- <img src="../../../assets/logo-full-white.png" /> -->
   <ion-icon name="unlock" class="key-logo"></ion-icon>
-  <!-- <ion-card>
-    <form #form="ngForm" (ngSubmit)="login(form)">
-      <ion-grid>
-        <ion-row justify-content-center>
-          <ion-col align-self-center size-md="6" size-lg="5" size-xs="12">
-            <div text-center>
-              <h3>Login</h3>
-            </div>
-            <div padding>
-              <ion-item>
-                <ion-input name="email" type="email" placeholder="your@email.com" ngModel required></ion-input>
-              </ion-item>
-              <ion-item>
-                <ion-input name="password" type="password" placeholder="Password" ngModel required></ion-input>
-              </ion-item>
-            </div>
-            <div padding>
-              <ion-button size="large" type="submit" [disabled]="form.invalid" expand="block">Login</ion-button>
-            </div>
-          </ion-col>
-        </ion-row>
-      </ion-grid>
-    </form>
-  </ion-card> -->
   <form [formGroup]="validationsForm" (ngSubmit)="onSubmit(validationsForm.value)">
     <ion-card color="light" no-padding no-margin>
       <ion-card-content no-padding>
@@ -73,26 +49,26 @@
       Connexion
     </ion-button>
   </form>
-  <ion-item-divider color="primary" lines="none"> </ion-item-divider>
+  <!-- <ion-item-divider color="primary" lines="none"> </ion-item-divider> -->
   <!-- <ion-item-divider color="primary" justify-content-center>
     Se connecter avec Facebook ou Google
   </ion-item-divider> -->
-
-  <ion-button color="light" expand="block" class="btn-g" (click)="doAnonymousLogIn()" no-margin>
+  <div class="separator">
+    <span>Autres options :</span>
+  </div>
+  <ion-grid no-padding margin-top>
+    <ion-row>
+      <ion-col class="ion-no-padding ion-text-start">
+        <ion-button color="dark" class="btn-g" (click)="doAnonymousLogIn()" no-margin>
           <ion-icon name="walk"></ion-icon>
-    Connexion anonyme
+          Anonyme
         </ion-button>
-  <ion-grid>
-    <ion-row>
-      <!-- <ion-col>
-        <ion-button expand="block" class="btn-fb" no-margin>
-          <ion-icon name="logo-facebook"></ion-icon>
+      </ion-col>
+      <ion-col class="ion-no-padding">
+        <ion-button color="light" class="btn-g ion-no-margin">
+            <ion-icon name="person-add"></ion-icon>
+          Créer un compte
         </ion-button>
-      </ion-col> -->
-      <ion-col>
-        <!-- <ion-button color="light" expand="block" class="btn-g" (click)="doGoogleLogin()" no-margin>
-          <ion-icon name="logo-google"></ion-icon>
-        </ion-button> -->
       </ion-col>
     </ion-row>
   </ion-grid>

src/app/pages/compte/login/login.page.scss

@@ -20,3 +20,15 @@ ion-icon.key-logo {
   color: var(--ion-color-danger);
   font-size: 12px;
 }
+div.separator {
+  border-bottom: 1px solid;
+  position: relative;
+  margin-top: 30px;
+  span {
+    position: absolute;
+    top: -12px;
+    background: var(--ion-color-primary, #cc3333);
+    left: 10px;
+    padding: 0 5px;
+  }
+}
\ No newline at end of file