fix(form): layout and progress-bar status

src/app/form/form-view/account-form/account-newsletter/account-newsletter.component.html

@@ -5,7 +5,7 @@
 >
   <div class="title">
     <h3>Souhaitez-vous vous abonner à la lettre d’information de Res'in&nbsp;?</h3>
-    <p class="notRequired" *ngIf="!isEditMode">Facultatif</p>
+    <p *ngIf="!isEditMode">Facultatif</p>
   </div>
   <app-checkbox-form
     [isChecked]="userAcceptNewsletter"

src/app/form/form-view/form-view.component.ts

-import { Component, OnInit, SimpleChanges } from '@angular/core';
-import { FormGroup, FormControl, Validators, FormArray } from '@angular/forms';
+import { Component, OnInit } from '@angular/core';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
 import { forkJoin, of } from 'rxjs';
 import { catchError, map } from 'rxjs/operators';
@@ -144,7 +144,8 @@ export class FormViewComponent implements OnInit {
     }
     if (formType[this.routeParam] === formType.structure) {
       if (!this.isEditMode) {
-        this.nbSteps = 24;
+        const PAGE_WITHOUT_COUNT_INCREMENT = 2;
+        this.nbSteps = structureFormSteps - PAGE_WITHOUT_COUNT_INCREMENT;
         this.currentPage = structureFormStep.structureChoice;
         this.currentFormType = formType.structure;
         this.structure = new Structure();

src/app/form/form-view/personal-offer-form/personal-offer-accompaniment/personal-offer-accompaniment.component.html

@@ -2,7 +2,7 @@
   <div class="title">
     <p class="overtitle">{{ structureName }}</p>
     <h3>Quelles aides au numérique proposez-vous&nbsp;?</h3>
-    <p class="notRequired">Facultatif</p>
+    <p>Facultatif</p>
   </div>
 
   <div fxLayout="column" fxLayoutGap="32px">

src/app/form/form-view/personal-offer-form/personal-offer-training-type/personal-offer-training-type.component.html

@@ -2,7 +2,7 @@
   <div class="title">
     <p class="overtitle">{{ structureName }}</p>
     <h3>Quelles formations au numérique proposez-vous&nbsp;?</h3>
-    <p class="notRequired">Facultatif</p>
+    <p>Facultatif</p>
   </div>
   <app-training-type-picker
     [baseSkills]="personalOfferForm.get('baseSkills').value"

src/app/form/form-view/structure-form/structure-consent/structure-consent.component.html

@@ -26,7 +26,7 @@
           data.grandlyon.com<span class="asterisk" *ngIf="!isEditMode">**</span
           ><span class="asterisk" *ngIf="isEditMode">*</span> ?
         </h3>
-        <p class="notRequired" *ngIf="!isEditMode">Facultatif</p>
+        <p *ngIf="!isEditMode">Facultatif</p>
       </div>
     </div>
     <app-checkbox-form

src/app/form/form-view/structure-form/structure-covid-info/structure-covid-info.component.html

@@ -9,7 +9,7 @@
     ></app-svg-icon>
     <div class="titleContent">
       <h3>Y a-t-il des informations spécifiques à la période COVID&nbsp;?</h3>
-      <p class="notRequired">Facultatif</p>
+      <p>Facultatif</p>
     </div>
   </div>
   <div class="textareaBlock" fxLayout="column">

src/app/form/form-view/structure-form/structure-description/structure-description.component.html

@@ -9,7 +9,7 @@
     ></app-svg-icon>
     <div class="titleContent">
       <h3>Pouvez-vous présenter la structure en quelques mots&nbsp;?</h3>
-      <p class="notRequired">Facultatif</p>
+      <p>Facultatif</p>
     </div>
   </div>
   <div class="textareaBlock introduceStructure" fxLayout="column">

src/app/form/form-view/structure-form/structure-equipments/structure-equipments.component.html

@@ -9,7 +9,7 @@
     ></app-svg-icon>
     <div class="titleContent">
       <h3>Quel matériel est mis à disposition par la structure&nbsp;?</h3>
-      <p class="notRequired">Facultatif</p>
+      <p>Facultatif</p>
     </div>
   </div>
   <ng-container *ngFor="let equipment of equipmentsAndServices">

src/app/form/form-view/structure-form/structure-hours/structure-hours.component.html

@@ -9,7 +9,7 @@
     ></app-svg-icon>
     <div class="titleContent">
       <h3>Quels sont les horaires d'ouverture de la structure&nbsp;?</h3>
-      <p class="notRequired">Facultatif</p>
+      <p>Facultatif</p>
     </div>
   </div>
   <app-hour-picker
@@ -21,7 +21,7 @@
 
   <div class="title secondTitle">
     <h3>Avez-vous des précisions à apporter sur les horaires&nbsp;?</h3>
-    <p class="notRequired">Facultatif</p>
+    <p>Facultatif</p>
   </div>
   <div class="textareaBlock" fxLayout="column">
     <textarea

src/app/form/form-view/structure-form/structure-labels/structure-labels.component.html

@@ -9,7 +9,7 @@
     ></app-svg-icon>
     <div class="titleContent">
       <h3>La structure est-elle labellisée&nbsp;?</h3>
-      <p class="notRequired">Facultatif</p>
+      <p>Facultatif</p>
     </div>
   </div>
   <div class="labelsQualifications" *ngIf="labelsQualifications" fxLayout="row wrap" fxLayoutAlign="flex-start">

src/app/form/form-view/structure-form/structure-other-services/structure-other-services.component.html

@@ -9,7 +9,7 @@
     ></app-svg-icon>
     <div class="titleContent">
       <h3>Quels autres services sont proposés par la structure&nbsp;?</h3>
-      <p class="notRequired">Facultatif</p>
+      <p>Facultatif</p>
     </div>
   </div>
   <div *ngIf="equipmentsAndServices" fxLayout="column wrap" fxLayoutAlign="flex-start" class="otherServices">

src/app/form/form-view/structure-form/structure-training-type/structure-training-type.component.html

@@ -9,7 +9,7 @@
     ></app-svg-icon>
     <div class="titleContent">
       <h3>Quelles formations au numérique proposez-vous&nbsp;?</h3>
-      <p class="notRequired">Facultatif</p>
+      <p>Facultatif</p>
     </div>
   </div>
   <app-training-type-picker

src/app/form/form-view/structure-form/structure-web-and-social-network/structure-web-and-social-network.component.html

@@ -9,7 +9,7 @@
     ></app-svg-icon>
     <div class="titleContent">
       <h3>Comment vous trouver la structure sur internet&nbsp;?</h3>
-      <p class="notRequired">Facultatif</p>
+      <p>Facultatif</p>
     </div>
   </div>
   <div class="collapse" [ngClass]="{ notCollapsed: !showWebsite }">