From fabb6bc989ca276297163f04d5904ce737d57d85 Mon Sep 17 00:00:00 2001
From: Etienne LOUPIAS <eloupias@grandlyon.com>
Date: Thu, 29 Feb 2024 15:02:18 +0100
Subject: [PATCH 1/3] fix onboarding : 600px pas fixe
---
.../structure-access-modality.component.html | 26 ++--
.../structure-public-target.component.html | 114 +++++++++---------
...ructure-solidarity-material.component.html | 20 +--
3 files changed, 83 insertions(+), 77 deletions(-)
diff --git a/src/app/form/form-view/structure-form/structure-access-modality/structure-access-modality.component.html b/src/app/form/form-view/structure-form/structure-access-modality/structure-access-modality.component.html
index 961a52f7f..1a94130e2 100644
--- a/src/app/form/form-view/structure-form/structure-access-modality/structure-access-modality.component.html
+++ b/src/app/form/form-view/structure-form/structure-access-modality/structure-access-modality.component.html
@@ -4,17 +4,19 @@
<h3>Quelles sont les modalités d'accueil de la structure ?</h3>
<p>Plusieurs choix possibles</p>
</div>
- <p *ngIf="isEditMode && !structureForm.get('categories').get('accessModality').valid" class="missing-information">
- <app-svg-icon class="validationIcon" [iconClass]="'icon-26'" [folder]="'form'" [icon]="'notValidate'" />
- <span>Il faut renseigner au moins un champ</span>
- </p>
- <div *ngIf="accessModality" class="modality">
- <app-checkbox-form
- *ngFor="let module of accessModality.modules"
- [isChecked]="isInArray('accessModality', module.id)"
- [text]="module.name"
- [iconSvg]="module.id"
- (checkEvent)="onCheckChange($event, 'categories.accessModality', module.id)"
- />
+ <div class="formGroup">
+ <p *ngIf="isEditMode && !structureForm.get('categories').get('accessModality').valid" class="missing-information">
+ <app-svg-icon class="validationIcon" [iconClass]="'icon-26'" [folder]="'form'" [icon]="'notValidate'" />
+ <span>Il faut renseigner au moins un champ</span>
+ </p>
+ <div *ngIf="accessModality" class="modality">
+ <app-checkbox-form
+ *ngFor="let module of accessModality.modules"
+ [isChecked]="isInArray('accessModality', module.id)"
+ [text]="module.name"
+ [iconSvg]="module.id"
+ (checkEvent)="onCheckChange($event, 'categories.accessModality', module.id)"
+ />
+ </div>
</div>
</form>
diff --git a/src/app/form/form-view/structure-form/structure-public-target/structure-public-target.component.html b/src/app/form/form-view/structure-form/structure-public-target/structure-public-target.component.html
index 1f7906c5d..f735383d7 100644
--- a/src/app/form/form-view/structure-form/structure-public-target/structure-public-target.component.html
+++ b/src/app/form/form-view/structure-form/structure-public-target/structure-public-target.component.html
@@ -10,65 +10,67 @@
</h3>
<p>{{ isMandatoryFields ? '' : 'Facultatif - ' }}Plusieurs choix possibles</p>
</div>
- <p *ngIf="isEditMode && !structureForm.get('categories').get('age').valid" class="missing-information">
- <app-svg-icon class="validationIcon" [iconClass]="'icon-26'" [folder]="'form'" [icon]="'notValidate'" />
- <span>Il faut renseigner au moins un champ</span>
- </p>
- <ng-container *ngIf="!isMandatoryFields">
- <div *ngIf="languageAndIlliteracy" class="title" style="gap: 12px">
- <h4>Langue et illettrisme</h4>
- <div class="tagList">
- <app-tag-item
- *ngFor="let choice of languageAndIlliteracy.modules"
- [iconName]="isInArray(choice.id, 'languageAndIlliteracy') ? 'check' : null"
- [label]="choice.name"
- [color]="isInArray(choice.id, 'languageAndIlliteracy') ? 'black' : 'white'"
- [clickable]="true"
- (action)="updateChoicePublic(choice.id, 'languageAndIlliteracy')"
- />
+ <div class="formGroup">
+ <p *ngIf="isEditMode && !structureForm.get('categories').get('age').valid" class="missing-information">
+ <app-svg-icon class="validationIcon" [iconClass]="'icon-26'" [folder]="'form'" [icon]="'notValidate'" />
+ <span>Il faut renseigner au moins un champ</span>
+ </p>
+ <ng-container *ngIf="!isMandatoryFields">
+ <div *ngIf="languageAndIlliteracy" class="title" style="gap: 12px">
+ <h4>Langue et illettrisme</h4>
+ <div class="tagList">
+ <app-tag-item
+ *ngFor="let choice of languageAndIlliteracy.modules"
+ [iconName]="isInArray(choice.id, 'languageAndIlliteracy') ? 'check' : null"
+ [label]="choice.name"
+ [color]="isInArray(choice.id, 'languageAndIlliteracy') ? 'black' : 'white'"
+ [clickable]="true"
+ (action)="updateChoicePublic(choice.id, 'languageAndIlliteracy')"
+ />
+ </div>
</div>
- </div>
- <div *ngIf="handicaps" class="title" style="gap: 12px">
- <h4>Handicaps</h4>
- <div class="tagList">
- <app-tag-item
- *ngFor="let choice of handicaps.modules"
- [iconName]="isInArray(choice.id, 'handicaps') ? 'check' : null"
- [label]="choice.name"
- [color]="isInArray(choice.id, 'handicaps') ? 'black' : 'white'"
- [clickable]="true"
- (action)="updateChoicePublic(choice.id, 'handicaps')"
- />
+ <div *ngIf="handicaps" class="title" style="gap: 12px">
+ <h4>Handicaps</h4>
+ <div class="tagList">
+ <app-tag-item
+ *ngFor="let choice of handicaps.modules"
+ [iconName]="isInArray(choice.id, 'handicaps') ? 'check' : null"
+ [label]="choice.name"
+ [color]="isInArray(choice.id, 'handicaps') ? 'black' : 'white'"
+ [clickable]="true"
+ (action)="updateChoicePublic(choice.id, 'handicaps')"
+ />
+ </div>
</div>
- </div>
- <div *ngIf="genre" class="title" style="gap: 12px">
- <h4>Genre</h4>
- <div class="tagList">
- <app-tag-item
- *ngFor="let choice of genre.modules"
- [iconName]="isInArray(choice.id, 'genre') ? 'check' : null"
- [label]="choice.name"
- [color]="isInArray(choice.id, 'genre') ? 'black' : 'white'"
- [clickable]="true"
- (action)="updateChoicePublic(choice.id, 'genre')"
- />
+ <div *ngIf="genre" class="title" style="gap: 12px">
+ <h4>Genre</h4>
+ <div class="tagList">
+ <app-tag-item
+ *ngFor="let choice of genre.modules"
+ [iconName]="isInArray(choice.id, 'genre') ? 'check' : null"
+ [label]="choice.name"
+ [color]="isInArray(choice.id, 'genre') ? 'black' : 'white'"
+ [clickable]="true"
+ (action)="updateChoicePublic(choice.id, 'genre')"
+ />
+ </div>
</div>
- </div>
- </ng-container>
+ </ng-container>
- <ng-container *ngIf="isMandatoryFields">
- <div *ngIf="age" class="title" style="gap: 12px">
- <h4>Âge</h4>
- <div class="tagList">
- <app-tag-item
- *ngFor="let choice of age.modules"
- [iconName]="isInArray(choice.id, 'age') ? 'check' : null"
- [label]="choice.name"
- [color]="isInArray(choice.id, 'age') ? 'black' : 'white'"
- [clickable]="true"
- (action)="updateChoicePublic(choice.id, 'age')"
- />
+ <ng-container *ngIf="isMandatoryFields">
+ <div *ngIf="age" class="title" style="gap: 12px">
+ <h4>Âge</h4>
+ <div class="tagList">
+ <app-tag-item
+ *ngFor="let choice of age.modules"
+ [iconName]="isInArray(choice.id, 'age') ? 'check' : null"
+ [label]="choice.name"
+ [color]="isInArray(choice.id, 'age') ? 'black' : 'white'"
+ [clickable]="true"
+ (action)="updateChoicePublic(choice.id, 'age')"
+ />
+ </div>
</div>
- </div>
- </ng-container>
+ </ng-container>
+ </div>
</form>
diff --git a/src/app/form/form-view/structure-form/structure-solidarity-material/structure-solidarity-material.component.html b/src/app/form/form-view/structure-form/structure-solidarity-material/structure-solidarity-material.component.html
index 245ab0023..c935ed82b 100644
--- a/src/app/form/form-view/structure-form/structure-solidarity-material/structure-solidarity-material.component.html
+++ b/src/app/form/form-view/structure-form/structure-solidarity-material/structure-solidarity-material.component.html
@@ -5,14 +5,16 @@
<p>Facultatif - Plusieurs choix possibles</p>
</div>
- <div class="tagList">
- <app-tag-item
- *ngFor="let material of solidarityMaterial.modules"
- [iconName]="isInArray(material.id) ? 'check' : null"
- [label]="material.name"
- [color]="isInArray(material.id) ? 'black' : 'white'"
- [clickable]="true"
- (action)="updateChoiceSolidarityMaterial(material.id)"
- />
+ <div class="formGroup">
+ <div class="tagList">
+ <app-tag-item
+ *ngFor="let material of solidarityMaterial.modules"
+ [iconName]="isInArray(material.id) ? 'check' : null"
+ [label]="material.name"
+ [color]="isInArray(material.id) ? 'black' : 'white'"
+ [clickable]="true"
+ (action)="updateChoiceSolidarityMaterial(material.id)"
+ />
+ </div>
</div>
</form>
--
GitLab
From 19b2f013687d3189f698cfcd9b753234d160fe47 Mon Sep 17 00:00:00 2001
From: Etienne LOUPIAS <eloupias@grandlyon.com>
Date: Fri, 1 Mar 2024 14:27:33 +0100
Subject: [PATCH 2/3] =?UTF-8?q?fix=20:=20aligner=20=C3=A0=20gauche=20le=20?=
=?UTF-8?q?texte=20des=20labels=20(dans=20les=20checkbox)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../shared/components/checkbox-form/checkbox-form.component.scss | 1 +
1 file changed, 1 insertion(+)
diff --git a/src/app/shared/components/checkbox-form/checkbox-form.component.scss b/src/app/shared/components/checkbox-form/checkbox-form.component.scss
index b275d28bc..167a1bc2c 100644
--- a/src/app/shared/components/checkbox-form/checkbox-form.component.scss
+++ b/src/app/shared/components/checkbox-form/checkbox-form.component.scss
@@ -25,6 +25,7 @@ button {
p {
@include font-bold-16;
color: $grey-1;
+ text-align: left;
}
&:hover {
--
GitLab
From b92efd4140dd570a7bc51328007474ba733212fc Mon Sep 17 00:00:00 2001
From: Etienne LOUPIAS <eloupias@grandlyon.com>
Date: Fri, 1 Mar 2024 14:29:55 +0100
Subject: [PATCH 3/3] retour
---
.../structure-equipments.component.scss | 6 ------
1 file changed, 6 deletions(-)
diff --git a/src/app/form/form-view/structure-form/structure-equipments/structure-equipments.component.scss b/src/app/form/form-view/structure-form/structure-equipments/structure-equipments.component.scss
index 475295fbe..f3689f070 100644
--- a/src/app/form/form-view/structure-form/structure-equipments/structure-equipments.component.scss
+++ b/src/app/form/form-view/structure-form/structure-equipments/structure-equipments.component.scss
@@ -13,12 +13,6 @@
height: 80px;
box-sizing: border-box;
max-width: 600px;
- @media #{$small-phone} {
- width: 95% !important;
- }
- @media #{$tablet} {
- width: 296px;
- }
padding: 1rem;
display: flex;
--
GitLab