[US TRTL-549] REDESIGN Organisation last two step

ui/ui-frontend/projects/identity/src/app/customer/customer-create/customer-create.component.html

@@ -197,9 +197,10 @@
     </cdk-step>
 
     <cdk-step>
-      <h2 i18n="Create evidence owner title@@customerCreateTitle3">Création du propriétaire des éléments de preuve
-      </h2>
-      <div class="form-group">
+     <div class="content">
+      <div class="text large bold" i18n="Create evidence owner title@@customerCreateTitle3">Création du propriétaire des éléments de preuve
+      </div>
+      <div>
         <app-owner-form [formControl]="form.get(['owners', 0])" [customerInfo]="customerInfo"></app-owner-form>
 
         <p class="hint" i18n="the evidence tenant is automatically created with the owner@@customerCreateHint">
@@ -207,30 +208,28 @@
         </p>
       </div>
 
-      <button type="button" class="btn primary" i18n="Finish customer creation button@@customerCreateFinishButton"
+      <div class="actions">
+        <button type="button" class="btn primary" i18n="Finish customer creation button@@customerCreateFinishButton"
         cdkStepperNext [disabled]="form.get(['owners', 0]).pending || form.get(['owners', 0]).invalid">Créer un coffre</button>
-      <button type="button" class="btn cancel" (click)="onCancel()"
-        i18n="Cancel customer creation@@customerCreateCancelButton">Annuler</button>
-      <button type="button" class="back" cdkStepperPrevious>
-        <i class="material-icons">arrow_back</i>
-        <ng-container i18n="Previous step button label@@customerCreateBackButton">Retour</ng-container>
-      </button>
+        <ng-container *ngTemplateOutlet="cancel"></ng-container>
+      </div>
+      <ng-container *ngTemplateOutlet="back"></ng-container>
+      </div>
   </cdk-step>
 
   <cdk-step>
-      <h2 i18n="Create tenant for the owner@@tenantCreateTitle">Création du coffre pour "{{ getOwnerName() }}"</h2>
+    <div class="content">
+      <div class="text large bold" i18n="Create tenant for the owner@@tenantCreateTitle">Création du coffre pour "{{ getOwnerName() }}"</div>
       <vitamui-common-input formControlName="tenantName" required placeholder="Nom du coffre" i18n-placeholder="Name of the tenant@@tenantCreateNamePlaceholder">
         <vitamui-common-input-error *ngIf="form?.get('tenantName')?.touched && form?.get('tenantName')?.hasError('required')" i18n="Existing name error hint@@formErrorExistingName">Champ requis</vitamui-common-input-error>
         <vitamui-common-input-error *ngIf="form?.get('tenantName')?.touched && form?.get('tenantName')?.hasError('uniqueName')" i18n="Existing name error hint@@formErrorExistingName">Nom déjà existant</vitamui-common-input-error>
       </vitamui-common-input>
-
       <div class="actions">
         <button type="submit" class="btn primary" [disabled]="form.pending || form.invalid" i18n="Finish owner creation button@@ownerCreateFinishButton">Terminer</button>
-        <button type="button" class="btn cancel" (click)="onCancel()" i18n="Cancel owner creation@@ownerCreateCancelButton">Annuler</button>
+        <ng-container *ngTemplateOutlet="cancel"></ng-container>
+      </div>
+      <ng-container *ngTemplateOutlet="back"></ng-container>
       </div>
-      <button type="button" class="back" cdkStepperPrevious>
-        <i class="material-icons">arrow_back</i> <ng-container i18n="Previous step button label@@customerCreateBackButton">Retour</ng-container>
-      </button>
   </cdk-step>
 
     <ng-template #cancel>

ui/ui-frontend/projects/identity/src/app/customer/customer-create/customer-create.component.ts

@@ -70,7 +70,7 @@ export class CustomerCreateComponent implements OnInit, OnDestroy {
     companyName: null,
   };
   public stepIndex = 0;
-  public stepCount = 4;
+  public stepCount = 5;
   // tslint:disable-next-line: variable-name
   private _customerForm: FormGroup;
   public get customerForm(): FormGroup { return this._customerForm; }