diff --git a/.vscode/settings.json b/.vscode/settings.json
index 23711d0f81bb379c8330d2926b11779d11c0cf51..d22033d9f1c2d73598dd78f8548dbb163accaa8f 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -27,7 +27,13 @@
"i18n-ally.keystyle": "nested",
"i18n-ally.enabledFrameworks": "ngx-translate",
"typescript.preferences.importModuleSpecifier": "relative",
- "gitlens.remotes": [{ "type": "GitLab", "domain": "forge.grandlyon.com", "name": "Forge" }],
+ "gitlens.remotes": [
+ {
+ "type": "GitLab",
+ "domain": "forge.grandlyon.com",
+ "name": "Forge"
+ }
+ ],
"cSpell.language": "fr,en",
"cSpell.words": [
"Annuary",
@@ -62,5 +68,6 @@
"wednesday",
"xsmall",
"xxsmall"
- ]
-}
+ ],
+ "svg.preview.background": "dark-transparent"
+}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 8667f72174aba1ccc1964c7c7fe614c5d8dcbe04..618963b66e4d6c275cfff9184bf60d9ef69b2894 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -23729,6 +23729,13 @@
"dev": true,
"peer": true
},
+ "node_modules/tslint/node_modules/commander": {
+ "version": "2.20.3",
+ "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+ "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
+ "dev": true,
+ "peer": true
+ },
"node_modules/tslint/node_modules/glob": {
"version": "7.2.3",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
diff --git a/src/app/admin/components/manage-users/manage-users.component.html b/src/app/admin/components/manage-users/manage-users.component.html
index c76138e8394acc5f64ad4df7aebfac349ac48504..482910df61f8e014d51c734845644d650c68fdb4 100644
--- a/src/app/admin/components/manage-users/manage-users.component.html
+++ b/src/app/admin/components/manage-users/manage-users.component.html
@@ -25,8 +25,14 @@
<h3 *ngIf="unAttachedUsers" class="title">
Utilisateurs non rattachés ({{ unAttachedUsers.length }})
- <app-button [text]="'Exporter'" [style]="buttonTypeEnum.Tertiary" (click)="exportUsers('unattached')" />
+ <app-v3-button
+ [label]="'Exporter'"
+ [variant]="buttonTypeEnumV3.Tertiary"
+ [size]="'small'"
+ (click)="exportUsers('unattached')"
+ />
</h3>
+
<ag-grid-angular
*ngIf="validatedJobs && validatedEmployers"
class="ag-theme-alpine user-table"
@@ -43,7 +49,12 @@
<h3 *ngIf="attachedUsers" class="title">
Utilisateurs rattachés ({{ attachedUsers.length }})
- <app-button [text]="'Exporter'" [style]="buttonTypeEnum.Tertiary" (click)="exportUsers('attached')" />
+ <app-v3-button
+ [label]="'Exporter'"
+ [variant]="buttonTypeEnumV3.Tertiary"
+ [size]="'small'"
+ (click)="exportUsers('attached')"
+ />
</h3>
<ag-grid-angular
*ngIf="validatedJobs && validatedEmployers"
diff --git a/src/app/admin/components/manage-users/manage-users.component.ts b/src/app/admin/components/manage-users/manage-users.component.ts
index 0e267ae656e23e44059c0839f0a43f83f6d52a99..73e60933054c9490343950f3391df2279ebd7d4e 100644
--- a/src/app/admin/components/manage-users/manage-users.component.ts
+++ b/src/app/admin/components/manage-users/manage-users.component.ts
@@ -7,7 +7,7 @@ import { TempUser } from '../../../models/temp-user.model';
import { User } from '../../../models/user.model';
import { NotificationService } from '../../../services/notification.service';
import { TempUserService } from '../../../services/temp-user.service';
-import { ButtonType } from '../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../shared/components/v3/button/button-type.enum';
import { AdminService } from '../../services/admin.service';
import { AdministredStructuresComponent } from './administred-structures/administred-structures.component';
import { DeleteUserComponent } from './delete-user/delete-user.component';
@@ -47,7 +47,7 @@ export class ManageUsersComponent {
{ name: null, validated: false },
];
public contextRow: any;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public frameworkComponents;
public defaultColDef: ColDef = {
editable: true,
diff --git a/src/app/admin/components/nav-bar/nav-bar.component.html b/src/app/admin/components/nav-bar/nav-bar.component.html
index 6b2045c757274d3e4cd458a315f315a8b8112307..d104dacc5aaa6394d0a738326d5ba792c744b237 100644
--- a/src/app/admin/components/nav-bar/nav-bar.component.html
+++ b/src/app/admin/components/nav-bar/nav-bar.component.html
@@ -1,44 +1,46 @@
<div fxLayout="column" fxLayoutGap="20px" class="content-container">
- <div fxLayout="row" fxLayoutAlign="center center"><h1>Administration</h1></div>
+ <div fxLayout="row" fxLayoutAlign="center center">
+ <h1>Administration</h1>
+ </div>
<div fxLayout="row" fxLayoutGap="20px" fxLayoutAlign="center center">
- <app-button
- [text]="'Revendication structure'"
- [style]="buttonTypeEnum.Secondary"
+ <app-v3-button
+ [label]="'Revendication structure'"
+ [variant]="buttonTypeEnumV3.Secondary"
(click)="router.navigateByUrl(routes.pendingStructures.link)"
/>
- <app-button
- [text]="'Liste structures'"
- [style]="buttonTypeEnum.Secondary"
+ <app-v3-button
+ [label]="'Liste structures'"
+ [variant]="buttonTypeEnumV3.Secondary"
(click)="router.navigateByUrl(routes.structuresList.link)"
/>
- <app-button
- [text]="'Structures supprimées'"
- [style]="buttonTypeEnum.Secondary"
+ <app-v3-button
+ [label]="'Structures supprimées'"
+ [variant]="buttonTypeEnumV3.Secondary"
(click)="router.navigateByUrl(routes.deletedStructures.link)"
/>
- <app-button
- [text]="'Gestion des utilisateurs'"
- [style]="buttonTypeEnum.Secondary"
+ <app-v3-button
+ [label]="'Gestion des utilisateurs'"
+ [variant]="buttonTypeEnumV3.Secondary"
(click)="router.navigateByUrl(routes.manageUsers.link)"
/>
- <app-button
- [text]="'Fonctions'"
- [style]="buttonTypeEnum.Secondary"
+ <app-v3-button
+ [label]="'Fonctions'"
+ [variant]="buttonTypeEnumV3.Secondary"
(click)="router.navigateByUrl(routes.jobsList.link)"
/>
- <app-button
- [text]="'Employeurs'"
- [style]="buttonTypeEnum.Secondary"
+ <app-v3-button
+ [label]="'Employeurs'"
+ [variant]="buttonTypeEnumV3.Secondary"
(click)="router.navigateByUrl(routes.employersList.link)"
/>
- <app-button
- [text]="'CNFS Espace Coop'"
- [style]="buttonTypeEnum.Secondary"
+ <app-v3-button
+ [label]="'CNFS Espace Coop'"
+ [variant]="buttonTypeEnumV3.Secondary"
(click)="router.navigateByUrl(routes.espaceCoopCNFS.link)"
/>
- <app-button
- [text]="'Infos covid'"
- [style]="buttonTypeEnum.Secondary"
+ <app-v3-button
+ [label]="'Infos covid'"
+ [variant]="buttonTypeEnumV3.Secondary"
(click)="router.navigateByUrl(routes.lockdownInfo.link)"
/>
<a target="_blank" class="custom-link" rel="noopener noreferrer" [href]="ghostLink">Ghost</a>
diff --git a/src/app/admin/components/nav-bar/nav-bar.component.ts b/src/app/admin/components/nav-bar/nav-bar.component.ts
index d1b0fc6622fcbbf2b297bd301e08443c48af6e6c..b8ce1e1e16be00d77bed60e13173c71efed40440 100644
--- a/src/app/admin/components/nav-bar/nav-bar.component.ts
+++ b/src/app/admin/components/nav-bar/nav-bar.component.ts
@@ -1,7 +1,7 @@
import { Component } from '@angular/core';
import { Router } from '@angular/router';
import { RuntimeConfigLoaderService } from 'runtime-config-loader';
-import { ButtonType } from '../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../shared/components/v3/button/button-type.enum';
import { AdminRoutes } from '../../admin-routing.module';
@Component({
@@ -10,7 +10,7 @@ import { AdminRoutes } from '../../admin-routing.module';
})
export class NavBarComponent {
public ghostLink = this.runtimeConfigLoaderService.getConfigObjectKey('ghostAdmin');
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public routes = AdminRoutes;
constructor(private runtimeConfigLoaderService: RuntimeConfigLoaderService, public router: Router) {}
diff --git a/src/app/annuaire/filter-modal/filter-modal.component.html b/src/app/annuaire/filter-modal/filter-modal.component.html
index 74a75e1893c6701656f464ef4167eb231fa63077..3f7f26755b0eea797a480075309b40c8e701a904 100644
--- a/src/app/annuaire/filter-modal/filter-modal.component.html
+++ b/src/app/annuaire/filter-modal/filter-modal.component.html
@@ -31,10 +31,10 @@
</div>
<div class="footer">
<div class="half-width">
- <app-button [style]="buttonTypeEnum.modalSecondary" [text]="'Effacer'" (click)="clearFilters()" />
+ <app-v3-button [variant]="buttonTypeV3Enum.Secondary" [label]="'Annuler'" (click)="clearFilters()" />
</div>
<div class="half-width">
- <app-button [style]="buttonTypeEnum.modalPrimary" [text]="'Appliquer'" (click)="onSubmitFilters()" />
+ <app-v3-button [variant]="buttonTypeV3Enum.Primary" [label]="'Valider'" (click)="onSubmitFilters()" />
</div>
</div>
</div>
diff --git a/src/app/annuaire/filter-modal/filter-modal.component.ts b/src/app/annuaire/filter-modal/filter-modal.component.ts
index ecf9cb2bc9edcffbcaeee0c345d4bd4a90188c84..4363fece5c2a2331d36ee4075e61fc5364c9460e 100644
--- a/src/app/annuaire/filter-modal/filter-modal.component.ts
+++ b/src/app/annuaire/filter-modal/filter-modal.component.ts
@@ -1,5 +1,5 @@
import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { TypeModal } from '../enums/TypeModal.enum';
@Component({
@@ -14,7 +14,7 @@ export class FilterModalComponent implements OnInit, OnChanges {
@Input() public jobFilterChecked: string[];
@Input() public employerFilterChecked: string[];
@Output() fetchResults = new EventEmitter<string[]>();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeV3Enum = ButtonTypeV3;
public toggledCategories: string[] = [];
public currentCheckedFilters: string[] = [];
@@ -23,7 +23,9 @@ export class FilterModalComponent implements OnInit, OnChanges {
}
ngOnChanges(changes: SimpleChanges): void {
- if (changes.modalType) this.currentCheckedFilters = this.checkedFilters.slice();
+ if (changes.modalType) {
+ this.currentCheckedFilters = this.checkedFilters.slice();
+ }
}
public isFilterChecked(filter: string): boolean {
diff --git a/src/app/annuaire/result-list/result-list.component.html b/src/app/annuaire/result-list/result-list.component.html
index 90de1ba6f7b3d995d12ff5078715f373eb6ad434..c0e5acc93898aefd52cfddb8ee13792262d332b5 100644
--- a/src/app/annuaire/result-list/result-list.component.html
+++ b/src/app/annuaire/result-list/result-list.component.html
@@ -15,7 +15,8 @@
(scroll)="onScroll($event)"
>
<div class="userNumber">
- {{ userList.length }} utilisateur(s)<span *ngIf="showPagination"> sur {{ totalUserResult }} </span>
+ {{ userList.length }} utilisateur{{ userList.length > 1 ? 's' : ''
+ }}<span *ngIf="showPagination"> sur {{ totalUserResult }} </span>
</div>
<div
*ngFor="let user of userList; let index = index"
@@ -39,28 +40,40 @@
</div>
<div *ngIf="showPagination" class="pagination">
<div class="text">
- {{ userList.length }} utilisateur(s) affiché(s) sur {{ totalUserResult }} utilisateur(s) trouvé(s).
+ {{ userList.length }} affiché{{ userList.length > 1 ? 's' : '' }} sur {{ totalUserResult }} membre{{
+ totalUserResult > 1 ? 's' : ''
+ }}
+ </div>
+ <div class="buttons">
+ <app-v3-button
+ tabindex="0"
+ [variant]="buttonTypeV3Enum.PrimaryBlack"
+ [label]="'Voir plus'"
+ [wide]="true"
+ (click)="showMore()"
+ />
</div>
- <app-button
- tabindex="0"
- [style]="buttonTypeEnum.modalSecondary"
- [type]="'form'"
- [text]="'Voir plus'"
- (click)="showMore()"
- />
</div>
</div>
<div *ngIf="isLogged && userList.length === 0" class="results empty">
- <div class="userNumber">0 utilisateur</div>
- <div class="noUser">Aucun résultat ne correspond à vos filtres</div>
- <app-button
- tabindex="0"
- [style]="buttonTypeEnum.modalPrimary"
- [type]="'form'"
- [text]="'Réinitialiser les filtres'"
- (click)="resetFilters()"
- />
+ <div class="membersCount">
+ <h2>Membres</h2>
+ <p class="userNumber">0 utilisateur(s)</p>
+ </div>
+ <div class="resultsInfo">
+ <p class="noResult">Aucun résultat ne correspond à vos filtres</p>
+ <p class="filtersInfo">Merci de réinitialiser ou modifier les filtres afin d'élargir votre recherche</p>
+ <app-v3-button
+ tabindex="0"
+ [variant]="buttonTypeV3Enum.Primary"
+ [wide]="true"
+ [label]="'Réinitialiser les filtres'"
+ [iconPosition]="'right'"
+ [iconName]="'refreshV3'"
+ (click)="resetFilters()"
+ />
+ </div>
</div>
<div *ngIf="!isLogged && totalUserResult" class="results unlogged">
@@ -77,18 +90,8 @@
veuillez vous connecter ou vous créer un compte.
</div>
<div class="buttons">
- <app-button
- [text]="'Se créer un compte'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'fullWidth'"
- (action)="goRegister()"
- />
- <app-button
- [text]="'Se connecter'"
- [style]="buttonTypeEnum.Primary"
- [extraClass]="'fullWidth'"
- (action)="goLogin()"
- />
+ <app-v3-button [label]="'Créer un compte'" [variant]="buttonTypeV3Enum.Secondary" (action)="goRegister()" />
+ <app-v3-button [label]="'Se connecter'" [variant]="buttonTypeV3Enum.Primary" (action)="goLogin()" />
</div>
</div>
</ng-container>
diff --git a/src/app/annuaire/result-list/result-list.component.scss b/src/app/annuaire/result-list/result-list.component.scss
index 9ed2a610e56c0e6d9292100423d6aac2fc0bf020..65664845ae63cd57bfb7b17bc49aec5ed4b9a1f7 100644
--- a/src/app/annuaire/result-list/result-list.component.scss
+++ b/src/app/annuaire/result-list/result-list.component.scss
@@ -1,3 +1,4 @@
+@import 'typography';
@import 'color';
@import 'layout';
@import 'breakpoint';
@@ -23,19 +24,35 @@
height: calc(100vh - $footer-height - $header-height - $header-height - 7rem);
}
.userNumber {
- font-size: 0.875rem;
+ @include font-bold-14;
color: $grey-3;
- padding: 1rem 0.75rem;
}
&.empty {
- padding-bottom: 2rem;
- & > div {
- margin: 1.5rem 0.5rem;
- color: $grey-3;
+ .membersCount {
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
+
+ h2 {
+ @include font-bold-18;
+ color: $grey-1;
+ text-transform: uppercase;
+ }
}
+ .resultsInfo {
+ display: flex;
+ flex-direction: column;
+ margin-top: 16px;
+ gap: 24px;
- ::ng-deep button {
- max-width: 200px;
+ .noResult {
+ @include font-bold-16;
+ color: $grey-1;
+ }
+ .filtersInfo {
+ @include font-regular-14;
+ color: $grey-3;
+ }
}
}
&.notEmpty {
@@ -61,6 +78,15 @@
text-align: center;
margin-bottom: 1rem;
}
+ .buttons {
+ display: flex;
+ max-width: 330px;
+ gap: 2rem;
+ width: 100%;
+ justify-content: center;
+ align-items: center;
+ margin: 2rem auto;
+ }
}
}
&.unlogged {
diff --git a/src/app/annuaire/result-list/result-list.component.ts b/src/app/annuaire/result-list/result-list.component.ts
index e62c052ebbcb11ccec9334344bf4b78375783194..2c57af9b4f8b8fb41838e09adef40315e33f8795 100644
--- a/src/app/annuaire/result-list/result-list.component.ts
+++ b/src/app/annuaire/result-list/result-list.component.ts
@@ -1,7 +1,7 @@
import { AfterViewInit, Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
import { Router } from '@angular/router';
import { UserAnnuary } from '../../models/user.model';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { WindowScrollService } from '../../shared/service/windowScroll.service';
@Component({
@@ -19,7 +19,7 @@ export class ResultListComponent implements OnChanges, AfterViewInit {
@Output() resetEvent = new EventEmitter<any>();
@Output() showMoreEvent = new EventEmitter<any>();
public maxPerPage = 20;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeV3Enum = ButtonTypeV3;
public showPagination = false;
ngAfterViewInit(): void {
diff --git a/src/app/carto/carto.component.html b/src/app/carto/carto.component.html
index 90416a26c442454098a57ae95aa29aba47ddc7df..4cf2a4eaa7b59ff662e70463f29c2114986abc56 100644
--- a/src/app/carto/carto.component.html
+++ b/src/app/carto/carto.component.html
@@ -21,10 +21,11 @@
(structureRDVSelected)="selectStructureRDV($event)"
/>
<div class="btnSwitch">
- <app-button
- [style]="buttonTypeEnum.ButtonPhone"
- [text]="isMapPhone ? 'Liste' : 'Carte'"
- [iconBtn]="isMapPhone ? 'liste' : 'map-markerButtonPhone'"
+ <!-- TODO: PrimaryBlack n'est probablement pas le bon type, Ã changer -->
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="isMapPhone ? 'Liste' : 'Carte'"
+ [iconName]="isMapPhone ? 'liste' : 'map-markerButtonPhone'"
(action)="switchMapList()"
/>
</div>
diff --git a/src/app/carto/carto.component.ts b/src/app/carto/carto.component.ts
index 995446ec187e69b5b8bf6d5500d6b89207c595d2..476eeb50df0b7a419ba2435eff3e95c6f4ff695f 100644
--- a/src/app/carto/carto.component.ts
+++ b/src/app/carto/carto.component.ts
@@ -7,7 +7,7 @@ import { Structure } from '../models/structure.model';
import { ProfileService } from '../profile/services/profile.service';
import { GeojsonService } from '../services/geojson.service';
import { StructureService } from '../services/structure.service';
-import { ButtonType } from '../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../shared/components/v3/button/button-type.enum';
import { Filter } from '../structure-list/models/filter.model';
import { CustomRegExp } from '../utils/CustomRegExp';
@@ -36,7 +36,7 @@ export class CartoComponent implements OnInit {
public isMapPhone = false;
public searchedValue = null;
public userLocate = null;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(
private structureService: StructureService,
diff --git a/src/app/contact/contact.component.html b/src/app/contact/contact.component.html
index 235e377fb1127143f11568cd0f409950ee50f1ed..b8f8ca4339457ca14a36e8b497ed8d82f2f57613 100644
--- a/src/app/contact/contact.component.html
+++ b/src/app/contact/contact.component.html
@@ -111,11 +111,11 @@
</div>
</div>
<div class="buttons">
- <app-button [style]="buttonTypeEnum.Secondary" [text]="'Annuler'" [routerLink]="'/home'" />
- <app-button
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Annuler'" [routerLink]="'/home'" />
+ <app-v3-button
[type]="'submit'"
- [style]="buttonTypeEnum.Primary"
- [text]="'Envoyer'"
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Envoyer'"
[disabled]="!contactForm.valid || loading"
/>
</div>
diff --git a/src/app/contact/contact.component.ts b/src/app/contact/contact.component.ts
index 7ef4f790ae7a0c4bed69eb62adcb56904fc73b58..938283ef895fab86577b664a2c4d5a9cb0c766ca 100644
--- a/src/app/contact/contact.component.ts
+++ b/src/app/contact/contact.component.ts
@@ -6,7 +6,7 @@ import { ContactMessage } from '../models/contact-message.model';
import { AuthService } from '../services/auth.service';
import { ContactService } from '../services/contact.service';
import { NotificationService } from '../services/notification.service';
-import { ButtonType } from '../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../shared/components/v3/button/button-type.enum';
import { CustomRegExp } from '../utils/CustomRegExp';
import { Utils } from '../utils/utils';
@@ -18,7 +18,7 @@ import { Utils } from '../utils/utils';
export class ContactComponent implements OnInit {
public contactForm: UntypedFormGroup;
public loading = false;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(
private formBuilder: UntypedFormBuilder,
diff --git a/src/app/form/footer-form/footer-form.component.html b/src/app/form/footer-form/footer-form.component.html
index b949746787f8af601dba6cc6dae774cf91bf0bd1..97760202c3f369e2ac17e2bf9309d2b8f137d55c 100644
--- a/src/app/form/footer-form/footer-form.component.html
+++ b/src/app/form/footer-form/footer-form.component.html
@@ -1,28 +1,28 @@
<div class="footerForm" [ngClass]="{ column: hasFinishButton() }">
- <app-button
+ <app-v3-button
*ngIf="!isLastFormStep && !isNextFormTransition && !isStructureLastPage() && !isPersonalOfferFirstPage()"
- [text]="!isEditMode ? btnName[0] : 'Annuler'"
- [iconType]="'form'"
- [iconBtn]="!isEditMode && 'chevronLeft'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="!isEditMode ? btnName[0] : 'Annuler'"
+ [iconName]="!isEditMode && 'arrowBackV3'"
(action)="prevPage()"
/>
- <app-button
+ <app-v3-button
*ngIf="!isLastFormStep && !isNextFormTransition && !isEditMode"
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="btnName[1]"
+ [iconPosition]="'right'"
+ [iconName]="btnName[1] === 'Imprimer' ? 'print' : 'arrowForwardV3'"
[disabled]="!isValid"
- [text]="btnName[1]"
- [iconBtn]="btnName[1] === 'Imprimer' ? 'print' : 'chevronRight'"
- [iconType]="'form'"
- [iconPos]="'right'"
- [style]="buttonTypeEnum.Primary"
(action)="nextPage()"
/>
- <app-button
+ <!-- Untested, not sure when it activates -->
+ <app-v3-button
*ngIf="isEditMode"
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Valider'"
[disabled]="!isValid"
- [text]="'Valider'"
- [style]="buttonTypeEnum.Primary"
(action)="saveEdit()"
/>
</div>
diff --git a/src/app/form/footer-form/footer-form.component.ts b/src/app/form/footer-form/footer-form.component.ts
index 903230a7a2f0802fa394fc5a376ba9b1a8296c94..bcb5973a90de13a9a9d46bac9e0dd55d9ef5bbcf 100644
--- a/src/app/form/footer-form/footer-form.component.ts
+++ b/src/app/form/footer-form/footer-form.component.ts
@@ -6,7 +6,7 @@ import { User } from '../../models/user.model';
import { AuthService } from '../../services/auth.service';
import { NewsletterService } from '../../services/newsletter.service';
import { NotificationService } from '../../services/notification.service';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { Utils } from '../../utils/utils';
import { accountFormStep } from '../form-view/account-form/accountFormStep.enum';
import { formType } from '../form-view/formType.enum';
@@ -41,7 +41,7 @@ export class FooterFormComponent implements OnChanges {
public isLastFormStep = false;
public isNextFormTransition = false;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(
private authService: AuthService,
diff --git a/src/app/form/form-view/global-components/information-step/information-step.component.html b/src/app/form/form-view/global-components/information-step/information-step.component.html
index 87ce5c4fdc732b6c695e089b647059fec3536a27..2824bff931b584b1d5bfe9ef231a2d4b3e862698 100644
--- a/src/app/form/form-view/global-components/information-step/information-step.component.html
+++ b/src/app/form/form-view/global-components/information-step/information-step.component.html
@@ -1,3 +1,4 @@
+<!-- After inscription, the user must confirm with a code received by email -->
<ng-container *ngIf="formType === formTypeEnum.account && step === accountFormStepEnum.confirmEmailSentInfo">
<div class="information-step-container no-max-width">
<img src="../../assets/form/emailVerification.svg" alt="Image de validation de finalisation de l'inscription" />
@@ -7,6 +8,8 @@
</p>
</div>
</ng-container>
+
+<!-- Email just got confirmed, request some info about the user -->
<ng-container *ngIf="formType === formTypeEnum.profile && step === profileFormStepEnum.profileBeginningInfo">
<div fxLayout="column" fxLayoutGap="18px" class="information-step-container profile-skip">
<p>
@@ -15,11 +18,13 @@
</p>
<img src="../../assets/form/profileSkip.svg" alt="Image profil" />
<div class="footerForm" fxLayout="row" fxLayoutGap="10px" fxLayoutAlign="center center">
- <app-button [text]="'Plus tard'" (action)="goToHome()" />
- <app-button [text]="'C\'est parti !'" [style]="buttonTypeEnum.Primary" (action)="goToNextPage()" />
+ <app-v3-button [label]="'Plus tard'" [variant]="buttonTypeEnumV3.Secondary" (click)="goToHome()" />
+ <app-v3-button [label]="'C\'est parti !'" [variant]="buttonTypeEnumV3.Primary" (click)="goToNextPage()" />
</div>
</div>
</ng-container>
+
+<!-- A structure has just been selected, a request will be sent -->
<ng-container *ngIf="formType === formTypeEnum.structure && step === structureFormStepEnum.mailSentInfo">
<div class="information-step-container structure-display">
<img src="../../assets/form/emailVerification.svg" alt="Image message envoyé" />
@@ -30,6 +35,8 @@
<span>{{ structureName }}</span>
</div>
</ng-container>
+
+<!-- An attempt to create a structure has been made, some info are needed -->
<ng-container *ngIf="formType === formTypeEnum.structure && step === structureFormStepEnum.structureFormTime">
<div class="information-step-container structure-time no-max-width">
<h3>
@@ -47,6 +54,8 @@
</ul>
</div>
</ng-container>
+
+<!-- A structure has successfully been created -->
<ng-container
*ngIf="formType === formTypeEnum.structure && step === structureFormStepEnum.structureCreationFinishedInfo"
>
@@ -58,24 +67,28 @@
</p>
</div>
</ng-container>
+
+<!-- The user tried to create a structure without reception place -->
<ng-container *ngIf="formType === formTypeEnum.structure && step === structureFormStepEnum.noStructure">
<div class="information-step-container profile-updated no-max-width">
<img src="../../assets/form/profileSkip.svg" alt="image profil" />
- <h3 class="no-margin-top">La structure n'a pas vocation à être créée dans Rés'in.</h3>
+ <h3 class="no-margin-top">La structure n'a pas vocation à être ajoutée à la cartographie</h3>
<p class="no-margin-top">
- Rés'in ne référence que les structures qui disposent d'un lieu d'accueil pour faire de l'accompagnement ou de la
- formation.
+ La cartographie ne référence que les structures qui disposent d'un lieu d'accueil pour accompagner, former ou
+ donner accès au numérique
</p>
<div class="btn">
- <app-button
- [style]="buttonTypeEnum.Primary"
- [text]="'Voir mon compte'"
- [iconType]="'form'"
- (action)="goBackProfile()"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [wide]="true"
+ [label]="'J\'ai compris'"
+ (click)="goBackProfile()"
/>
</div>
</div>
</ng-container>
+
+<!-- After the creation of a structure -->
<ng-container
*ngIf="formType === formTypeEnum.personaloffer && step === personalOfferFormStep.personalOfferFinishedInfo"
>
@@ -83,11 +96,11 @@
<img src="../../assets/form/profileUpdated.svg" alt="image profil" />
<h3>Merci, les informations de votre profil ont été mises à jour</h3>
<div class="btn">
- <app-button
- [style]="buttonTypeEnum.Primary"
- [text]="'Voir mon compte'"
- [iconType]="'form'"
- (action)="goBackProfile()"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [wide]="true"
+ [label]="'Voir mon compte'"
+ (click)="goBackProfile()"
/>
</div>
</div>
diff --git a/src/app/form/form-view/global-components/information-step/information-step.component.ts b/src/app/form/form-view/global-components/information-step/information-step.component.ts
index 0c8cd021c53fc22b0cf62c6cb848ffaca0846275..797b482a523a7d3fad8889d442f1c3a26b0a1652 100644
--- a/src/app/form/form-view/global-components/information-step/information-step.component.ts
+++ b/src/app/form/form-view/global-components/information-step/information-step.component.ts
@@ -1,6 +1,6 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { Router } from '@angular/router';
-import { ButtonType } from '../../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../../shared/components/v3/button/button-type.enum';
import { accountFormStep } from '../../account-form/accountFormStep.enum';
import { formType } from '../../formType.enum';
import { personalOfferFormStep } from '../../personal-offer-form/personalOfferFormStep.enum';
@@ -25,7 +25,7 @@ export class InformationStepComponent {
public profileFormStepEnum = profileFormStep;
public structureFormStepEnum = structureFormStep;
public personalOfferFormStep = personalOfferFormStep;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(private router: Router) {}
public goBackProfile(): void {
diff --git a/src/app/form/form-view/profile-form/profile-structure-choice/profile-structure-choice.component.html b/src/app/form/form-view/profile-form/profile-structure-choice/profile-structure-choice.component.html
index 73cd168487f028b005922a4e9dba61418da49015..dd4b3e794aa1e3dfd8133a8c5fde4727fb0210d6 100644
--- a/src/app/form/form-view/profile-form/profile-structure-choice/profile-structure-choice.component.html
+++ b/src/app/form/form-view/profile-form/profile-structure-choice/profile-structure-choice.component.html
@@ -63,7 +63,13 @@
Cette structure n’existe pas encore sur Rés'in.<br />
<span class="question">Souhaitez-vous la référencer ?</span>
</div>
- <app-button [text]="'Créer une structure'" [style]="buttonTypeEnum.Primary" (action)="addStructure()" />
+ <app-v3-button
+ [label]="'Créer une structure'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [wide]="true"
+ [iconName]="'addV3'"
+ (action)="addStructure()"
+ />
</div>
</div>
</div>
diff --git a/src/app/form/form-view/profile-form/profile-structure-choice/profile-structure-choice.component.ts b/src/app/form/form-view/profile-form/profile-structure-choice/profile-structure-choice.component.ts
index 0603a0c582d8766e598b7b5a8aef165fd7d2b5dd..4c0c50aae408eade6afe8db264edcac91987591b 100644
--- a/src/app/form/form-view/profile-form/profile-structure-choice/profile-structure-choice.component.ts
+++ b/src/app/form/form-view/profile-form/profile-structure-choice/profile-structure-choice.component.ts
@@ -4,7 +4,7 @@ import { pendingStructureLink } from '../../../../models/pendingStructure.model'
import { Structure } from '../../../../models/structure.model';
import { ProfileService } from '../../../../profile/services/profile.service';
import { StructureService } from '../../../../services/structure.service';
-import { ButtonType } from '../../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../../shared/components/v3/button/button-type.enum';
import { Filter } from '../../../../structure-list/models/filter.model';
@Component({
@@ -21,7 +21,7 @@ export class ProfileStructureChoiceComponent implements OnInit {
public structures: Structure[];
public selectedStructureItem: Structure;
public isAlreadySearching = false;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public profileStructuresLink: string[] = [];
public profilePendingStructureLink: pendingStructureLink[] = [];
public itemSelected: string = null;
diff --git a/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.html b/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.html
index 02281fb7d940d6c049275b4455f1d499c7ae206e..4c233649a3d66386cc25dc1e285168a042358c2e 100644
--- a/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.html
+++ b/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.html
@@ -14,19 +14,10 @@
<div class="content">
<img src="../../../../../assets/img/resin-login.svg" alt="resin-login-image" class="loginimg" />
<h3>Pour pré-remplir ce formulaire, gagnez du temps en vous connectant !</h3>
- <div class="footerModal" fxLayout="column" fxLayoutAlign="space-around center" fxLayoutGap="8px">
- <app-button
- [text]="'Se connecter'"
- [style]="buttonTypeEnum.modalPrimary"
- [ngClass]="'fullWidth'"
- (action)="goLogin()"
- />
- <app-button
- [text]="'Continuer sans compte'"
- [style]="buttonTypeEnum.Tertiary"
- [ngClass]="'fullWidth'"
- (action)="handleClose()"
- />
+
+ <div class="footerModal">
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Plus tard'" (action)="handleClose()" />
+ <app-v3-button [variant]="buttonTypeEnumV3.Primary" [label]="'Se connecter'" (action)="goLogin()" />
</div>
</div>
</div>
diff --git a/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.scss b/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.scss
index ddb2cac456570e8c1d0c02e4f24cdb94a3cd6924..6b193a782f45e5ebe9dcb25f5e09dd67f7b94e9f 100644
--- a/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.scss
+++ b/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.scss
@@ -34,8 +34,10 @@ h3 {
padding: 0 1.5rem;
}
.footerModal {
- padding-bottom: 1rem;
- gap: 0.5rem;
+ display: flex;
+ justify-content: center;
+ gap: 1rem;
+ padding: 16px 0;
}
.fullWidth {
width: 100% !important;
diff --git a/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.ts b/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.ts
index c3ac176ca63c219743ad3801e4eaab76e3c871a0..22541de5b502189cadb4cd443547357f584fb94a 100644
--- a/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.ts
+++ b/src/app/form/orientation-form-view/global-components/login-modal/login-modal.component.ts
@@ -1,6 +1,6 @@
import { Component, Input } from '@angular/core';
import { Router } from '@angular/router';
-import { ButtonType } from '../../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../../shared/components/v3/button/button-type.enum';
@Component({
selector: 'app-login-modal',
@@ -9,7 +9,7 @@ import { ButtonType } from '../../../../shared/components/button/buttonType.enum
})
export class LoginModalComponent {
@Input() opened: boolean;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(private router: Router) {}
public handleClose(): void {
diff --git a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html
index 1b4300645e4e42b3fe25a99f2105659557ca8ac1..b39959c58afa99db0bf6bc971017d6b52f396081 100644
--- a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html
+++ b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.html
@@ -1,25 +1,24 @@
<div class="footerForm" fxLayout="row" fxLayoutGap="10px" fxLayoutAlign="center center">
<ng-container *ngIf="!shouldResetOrientation">
- <app-button
+ <app-v3-button
*ngIf="currentStep !== null && !(isLastStep && needType === 2)"
- [text]="'Précédent'"
- [iconType]="'form'"
- [iconBtn]="'chevronLeft'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Précédent'"
+ [iconName]="'arrowBackV3'"
(action)="prevPage()"
/>
- <app-button
+ <app-v3-button
*ngIf="!hideNavButtons"
- [text]="isLastStep ? 'Terminer' : 'Suivant'"
- [iconBtn]="!isLastStep ? 'chevronRight' : 'finish'"
- [iconType]="'form'"
- [iconPos]="!isLastStep ? 'right' : 'left'"
- [style]="buttonTypeEnum.Primary"
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="isLastStep ? 'Terminer' : 'Suivant'"
+ [iconPosition]="!isLastStep ? 'right' : 'left'"
+ [iconName]="!isLastStep ? 'arrowForwardV3' : null"
[disabled]="!isPageValid"
(action)="nextPage()"
/>
</ng-container>
<ng-container *ngIf="shouldResetOrientation">
- <app-button [text]="'Cartographie'" (action)="goCarto()" />
- <app-button [text]="'Recommencer'" [style]="buttonTypeEnum.Primary" (action)="resetOrientation()" />
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Cartographie'" (action)="goCarto()" />
+ <app-v3-button [variant]="buttonTypeEnumV3.Primary" [label]="'Recommencer'" (action)="resetOrientation()" />
</ng-container>
</div>
diff --git a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.ts b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.ts
index 23514aa36dc1e35ca6ef1d052afaa9f2dc5561a4..d20811685dedda8b8953ffb597bedf8186c31212 100644
--- a/src/app/form/orientation-form-view/global-components/navigation/navigation.component.ts
+++ b/src/app/form/orientation-form-view/global-components/navigation/navigation.component.ts
@@ -1,6 +1,6 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
-import { ButtonType } from '../../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../../shared/components/v3/button/button-type.enum';
import { NeedsType } from '../../enums/needs.enum';
import { OnlineDemarche } from '../../enums/onlineDemarche.enum';
import { MediationType } from '../../types/mediation.type';
@@ -25,7 +25,7 @@ export class NavigationComponent {
@Output() goPrev = new EventEmitter<any>();
@Output() goReset = new EventEmitter<any>();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public NeedsTypeEnum = NeedsType;
constructor(private router: Router, private route: ActivatedRoute) {}
public nextPage(isPrint?: boolean): void {
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
index fe61d96df71a28b2f74acceb560d02288b1d7f2a..eb43df7ec754b6d0a4344a76111ffd8ae8f4a216 100644
--- a/src/app/header/header.component.html
+++ b/src/app/header/header.component.html
@@ -43,19 +43,19 @@
Annuaire
</a>
<a *ngIf="isAdmin" routerLink="/admin" [routerLinkActive]="'active'">Administration</a>
- <app-button
- *ngIf="isLoggedIn"
+ <app-v3-button
class="connected"
- [text]="displayName"
- [style]="buttonTypeEnum.modalPrimary"
- [variant]="'small'"
+ *ngIf="isLoggedIn"
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="displayName"
+ [size]="'small'"
(action)="openProfileMenu()"
/>
- <app-button
+ <app-v3-button
*ngIf="!isLoggedIn"
- [text]="'Se connecter'"
- [style]="buttonTypeEnum.Secondary"
- [variant]="'small'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Se connecter'"
+ [size]="'small'"
(action)="goToLoginPage()"
/>
</div>
@@ -101,13 +101,20 @@
/>
<span class="name">{{ displayFullName }}</span>
</div>
- <app-button
- class="firstBtn"
- [text]="'Voir mon compte'"
- [style]="buttonTypeEnum.SecondaryWide"
- (click)="goToProfile()"
- />
- <app-button [text]="'Se déconnecter'" [style]="buttonTypeEnum.SecondaryWide" (action)="logout()" />
+ <div class="profileMenuButtons">
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Voir mon compte'"
+ [size]="'small'"
+ (click)="goToProfile()"
+ />
+ <app-v3-button
+ [label]="'Se déconnecter'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [size]="'small'"
+ (action)="logout()"
+ />
+ </div>
</div>
</div>
diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss
index 26916ebaa462b286c759694f9b39c72075a48481..10d26832c995f3e71449427a742b4add1f8bcd87 100644
--- a/src/app/header/header.component.scss
+++ b/src/app/header/header.component.scss
@@ -33,10 +33,9 @@ header {
display: flex;
align-items: center;
gap: 3vw;
-
- .connected {
- box-shadow: 0px 4px 8px 0px $red-20;
- }
+ }
+ .connected {
+ box-shadow: 0px 4px 8px 0px $red-20;
}
}
@@ -177,18 +176,18 @@ a {
width: 184px;
display: flex;
flex-direction: column;
- align-items: flex-start;
+ align-items: center;
justify-content: center;
- padding: 16px 8px 8px;
+ gap: 1.5rem;
+ padding: 1rem;
background: $white;
- box-shadow: $menu-shadow;
border-radius: 8px;
+ box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.35);
.profileInformation {
display: flex;
align-items: center;
- margin-bottom: 8px;
- width: 100%;
+ gap: 12px;
.avatar {
flex-shrink: 0;
width: 40px;
@@ -198,8 +197,6 @@ a {
}
.name {
@include font-bold-16;
- margin-left: 10px;
- text-transform: capitalize;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
@@ -207,8 +204,11 @@ a {
}
}
- .firstBtn {
- margin-bottom: 6px;
+ .profileMenuButtons {
+ display: inline-flex;
+ flex-direction: column;
+ margin: auto;
+ gap: 12px;
}
}
}
diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts
index bcfc5eca50f5a1cc3f8a42269fc3283cdaca34f0..16427e2ad88dedfa691cd12c317056846ecbd0f0 100644
--- a/src/app/header/header.component.ts
+++ b/src/app/header/header.component.ts
@@ -4,7 +4,7 @@ import { NavigationEnd, Router } from '@angular/router';
import { Structure } from '../models/structure.model';
import { ProfileService } from '../profile/services/profile.service';
import { AuthService } from '../services/auth.service';
-import { ButtonType } from '../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../shared/components/v3/button/button-type.enum';
@Component({
selector: 'app-header',
@@ -39,7 +39,7 @@ export class HeaderComponent {
public dataConsentPendingStructures: Structure[];
private displayDataShare = false;
private loadingDataShare = false;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(private authService: AuthService, private profileService: ProfileService, private router: Router) {
this.router.events.subscribe((event) => {
diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html
index 909571f1a24473e188289aa676a9ebcdcd0f535f..9033a7b93e431390bf758c4da731ce78a5c32863 100644
--- a/src/app/login/login.component.html
+++ b/src/app/login/login.component.html
@@ -51,25 +51,24 @@
8 caractères dont un caractère spécial, un caractère en majuscule et un chiffre.
</p>
</div>
- <div class="footer" fxLayout="row" fxLayoutAlign="space-around center">
- <app-button
- [text]="'Mot de passe oublié'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'fullWidth'"
+ <div class="footer">
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Mot de passe oublié'"
(action)="swithToResetPassword()"
/>
- <app-button
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
[type]="'submit'"
- [text]="'Se connecter'"
+ [label]="'Se connecter'"
[disabled]="loginForm.invalid || loading"
- [style]="buttonTypeEnum.Primary"
- [extraClass]="'fullWidth'"
/>
</div>
- <app-button
- [text]="'Je n’ai pas encore de compte'"
- [style]="buttonTypeEnum.Tertiary"
- [extraClass]="'fullWidth'"
+ <app-v3-button
+ class="goSignup"
+ [variant]="buttonTypeEnumV3.Tertiary"
+ [label]="'Je n\’ai pas encore de compte'"
+ [wide]="true"
(action)="goToAccountCreation()"
/>
</form>
diff --git a/src/app/login/login.component.scss b/src/app/login/login.component.scss
index e284463920e87e276f45271f6e7a55926c376608..7ad560f20ebfe736d1e2b57e24e935ceb2ef487b 100644
--- a/src/app/login/login.component.scss
+++ b/src/app/login/login.component.scss
@@ -104,20 +104,12 @@
}
}
.footer {
+ display: inline-flex;
margin-bottom: 1rem;
gap: 24px;
}
- ::ng-deep app-button {
- flex: 1;
- .secondary {
- width: 100% !important;
-
- div {
- width: 95% !important;
- }
- }
- .tertiary {
- border-radius: 4px !important;
- }
+ .goSignup {
+ display: flex;
+ justify-content: center;
}
}
diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts
index 96154c632a6b76fa9b12eb2492bf4e8e01322e6c..0aeb41fc6f59a3d2df01adf18db95abe5c287bb2 100644
--- a/src/app/login/login.component.ts
+++ b/src/app/login/login.component.ts
@@ -6,7 +6,7 @@ import { map } from 'rxjs/operators';
import { Structure } from '../models/structure.model';
import { AuthService } from '../services/auth.service';
import { NotificationService } from '../services/notification.service';
-import { ButtonType } from '../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../shared/components/v3/button/button-type.enum';
import { CustomRegExp } from '../utils/CustomRegExp';
@Component({
@@ -21,7 +21,7 @@ export class LoginComponent implements OnInit {
public authFailed = false;
public isUnverifiedEmail = false;
public isShowPassword = false;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public isWelcome = false;
public userId: string;
public token: string;
diff --git a/src/app/newsletter-subscription/newsletter-subscription.component.html b/src/app/newsletter-subscription/newsletter-subscription.component.html
index 69a3dfdcb65a1ff0f905a855855f92ccd02a415c..94e6ce4a7218416cc3d7bbc466cfc2c1b5f642e1 100644
--- a/src/app/newsletter-subscription/newsletter-subscription.component.html
+++ b/src/app/newsletter-subscription/newsletter-subscription.component.html
@@ -21,11 +21,11 @@
</div>
</div>
<div class="button" fxLayout="row" fxLayoutAlign="space-around center">
- <app-button [style]="buttonTypeEnum.Secondary" [text]="'Annuler'" [routerLink]="'/home'" />
- <app-button
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Annuler'" [routerLink]="'/home'" />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="subscriptionMod ? 'S\'inscrire' : 'Se désinscrire'"
[type]="'submit'"
- [style]="buttonTypeEnum.Primary"
- [text]="subscriptionMod ? 'S\'inscrire' : 'Se désinscrire'"
[disabled]="loading"
/>
</div>
diff --git a/src/app/newsletter-subscription/newsletter-subscription.component.ts b/src/app/newsletter-subscription/newsletter-subscription.component.ts
index 33635f7b925300aaf6b9e6f4bf22d2b76c816afc..b0183e43b3fefbb45f76255fb2823a995560ff08 100644
--- a/src/app/newsletter-subscription/newsletter-subscription.component.ts
+++ b/src/app/newsletter-subscription/newsletter-subscription.component.ts
@@ -4,7 +4,7 @@ import { Router } from '@angular/router';
import { lastValueFrom } from 'rxjs';
import { NewsletterService } from '../services/newsletter.service';
import { NotificationService } from '../services/notification.service';
-import { ButtonType } from '../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../shared/components/v3/button/button-type.enum';
import { CustomRegExp } from '../utils/CustomRegExp';
@Component({
@@ -17,7 +17,7 @@ export class NewsletterSubscriptionComponent implements OnInit {
public loading = false;
public submitted = false;
public subscriptionMod: boolean;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(
private formBuilder: UntypedFormBuilder,
diff --git a/src/app/post/components/post-header/post-header.component.html b/src/app/post/components/post-header/post-header.component.html
index 903149717cffdfe717a1348275192c979382fc02..f888d0cb4bf864215607741e5562fd9e44f9f441 100644
--- a/src/app/post/components/post-header/post-header.component.html
+++ b/src/app/post/components/post-header/post-header.component.html
@@ -23,9 +23,11 @@
>
</div>
<div fxLayout="row" class="row-mobile">
- <app-button
+ <app-v3-button
class="publish-button hide-on-mobile"
- [text]="'Publier votre actu'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Publier'"
+ [iconName]="'addV3'"
(action)="togglePublishNews()"
/>
</div>
diff --git a/src/app/post/components/post-header/post-header.component.ts b/src/app/post/components/post-header/post-header.component.ts
index 4e713fabc4562853be5734ddc8e894483bc1faea..40ab19504c56d3577734d4461391e67ea61c6b3c 100644
--- a/src/app/post/components/post-header/post-header.component.ts
+++ b/src/app/post/components/post-header/post-header.component.ts
@@ -1,5 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
+import { ButtonTypeV3 } from '../../../shared/components/v3/button/button-type.enum';
import { TagEnum } from '../../enum/tag.enum';
import { TypeModalNews } from '../../enum/typeModalNews.enum';
import { Tag } from '../../models/tag.model';
@@ -18,6 +19,9 @@ export class PostHeaderComponent implements OnInit {
public checkedPublicTags: Tag[] = [];
public checkedLocationTags: Tag[] = [];
+
+ public buttonTypeEnumV3 = ButtonTypeV3;
+
constructor(private route: ActivatedRoute, private router: Router) {}
ngOnInit(): void {
diff --git a/src/app/post/components/post-list/post-list.component.html b/src/app/post/components/post-list/post-list.component.html
index b22e137ea2a9573438e7aaed98a9388a5877f31f..155af905e22c7c34455e73f45780c2e83d07e7bf 100644
--- a/src/app/post/components/post-list/post-list.component.html
+++ b/src/app/post/components/post-list/post-list.component.html
@@ -14,7 +14,13 @@
<img class="loader-gif" src="/assets/gif/loader_circle_grey.gif" alt />
</div>
<div *ngIf="!isLastPage && !isLoading" fxLayout="row" fxLayoutAlign="center center">
- <app-button class="loadMore" [text]="'Voir plus'" [style]="buttonTypeEnum.Primary" (click)="loadMore()" />
+ <app-v3-button
+ class="loadMore"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Voir plus d\'actualités'"
+ [wide]="true"
+ (click)="loadMore()"
+ />
</div>
</div>
</div>
diff --git a/src/app/post/components/post-list/post-list.component.ts b/src/app/post/components/post-list/post-list.component.ts
index 2a25b8d48f6a1fe328d1b27c05d0f6a1307089fd..8e7142b14b0cf8708d0c8f52a876c9a866fe1a63 100644
--- a/src/app/post/components/post-list/post-list.component.ts
+++ b/src/app/post/components/post-list/post-list.component.ts
@@ -1,7 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import * as _ from 'lodash';
-import { ButtonType } from '../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../shared/components/v3/button/button-type.enum';
import { TagEnum } from '../../enum/tag.enum';
import { Pagination } from '../../models/pagination.model';
import { Post } from '../../models/post.model';
@@ -26,7 +26,7 @@ export class PostListComponent implements OnInit {
public isPublishMode = false;
public isLastPage: boolean;
public isInSection = false;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(private postService: PostService, private route: ActivatedRoute, private router: Router) {}
diff --git a/src/app/post/components/post-modal-filters/post-modal-filters.component.html b/src/app/post/components/post-modal-filters/post-modal-filters.component.html
index 9d66bdc0d6655e407db71da8b477048a8d72238f..8e864529ef7c973793e65636e427054b1b2c8db2 100644
--- a/src/app/post/components/post-modal-filters/post-modal-filters.component.html
+++ b/src/app/post/components/post-modal-filters/post-modal-filters.component.html
@@ -28,7 +28,7 @@
</div>
<div class="footer" fxLayout="row" fxLayoutAlign="end center" fxLayoutGap="3vw">
<a tabindex="0" (click)="clearFilters()" (keyup.enter)="clearFilters()">Effacer</a>
- <app-button [text]="'Appliquer'" (click)="emit(checkedTags)" />
+ <app-v3-button [label]="'Appliquer'" (click)="emit(checkedTags)" />
</div>
</div>
</div>
diff --git a/src/app/profile/edit/edit.component.html b/src/app/profile/edit/edit.component.html
index 6eae7f37a58e366937b1c77f2892132cd30f793c..9735401ad26c7ec35017f24de8b79e846dd38db2 100644
--- a/src/app/profile/edit/edit.component.html
+++ b/src/app/profile/edit/edit.component.html
@@ -1,31 +1,30 @@
<div *ngIf="userProfile" class="content-container full-screen">
<div class="edit-profile">
<app-v3-button
+ routerLink="/profile"
[label]="'Retour'"
[variant]="buttonTypeEnumV3.Tertiary"
- [iconFolder]="'ico'"
- [iconName]="'arrowBackSmall'"
+ [iconName]="'arrowBackV3'"
[size]="'large'"
- (action)="goBack()"
/>
<div class="header">
<div class="title">
<h1>Modifier mon profil</h1>
</div>
- <app-button
- class="hide-on-mobile deleteAccount"
- [style]="buttonTypeEnum.Secondary"
- [text]="'Supprimer mon compte'"
- [iconType]="'ico'"
- [iconBtn]="'removeCross'"
+ <app-v3-button
+ class="hide-on-mobile"
+ [variant]="buttonTypeEnumV3.SecondaryDelete"
+ [label]="'Supprimer mon compte'"
+ [iconName]="'deleteV3'"
+ [size]="'small'"
+ [wide]="true"
(action)="showDeleteAccountModal()"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
- [iconType]="'ico'"
- [iconBtn]="'deleteAccount'"
+ [variant]="buttonTypeEnumV3.SecondaryDelete"
+ [iconName]="'deleteV3'"
(action)="showDeleteAccountModal()"
/>
</div>
@@ -104,22 +103,22 @@
<div *ngIf="currentTab === tabsEnum.credentials" class="credentialsTab">
<p class="subTitle">Email</p>
{{ userProfile.email }}
- <div class="buttons">
- <app-button
- [text]="'Changer mon email'"
- [iconType]="'ico'"
- [iconBtn]="'emailOutline'"
- [style]="buttonTypeEnum.Secondary"
- (action)="showEmailModal()"
- />
- <app-button
- [text]="'Changer mon mot de passe'"
- [iconType]="'ico'"
- [iconBtn]="'passwordOutline'"
- [style]="buttonTypeEnum.Secondary"
- (action)="showPasswordModal()"
- />
- </div>
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Changer mon email'"
+ [iconName]="'emailV3'"
+ [size]="'small'"
+ [wide]="true"
+ (action)="showEmailModal()"
+ />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Changer mon mot de passe'"
+ [iconName]="'lockV3'"
+ [size]="'small'"
+ [wide]="true"
+ (action)="showPasswordModal()"
+ />
</div>
<div *ngIf="currentTab === tabsEnum.employer">
@@ -209,13 +208,16 @@
<!-- Footer -->
<div *ngIf="currentTab !== tabsEnum.credentials" class="footer">
- <app-button *ngIf="profileChanged()" [text]="'Annuler'" [iconBtn]="'close'" (action)="cancel()" />
- <app-button
- [text]="'Valider'"
- [iconBtn]="'check'"
+ <app-v3-button
+ *ngIf="profileChanged()"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Annuler'"
+ (action)="cancel()"
+ />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Valider'"
[disabled]="!isPageValid()"
- [style]="buttonTypeEnum.Primary"
- [extraClass]="'svgCheck'"
(action)="confirm()"
/>
</div>
@@ -267,10 +269,10 @@
</div>
<div class="buttons">
- <app-button [text]="'Annuler'" (action)="closeModal()" />
- <app-button
- [text]="'Valider'"
- [style]="buttonTypeEnum.Primary"
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Annuler'" (action)="closeModal()" />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Valider'"
[disabled]="!isPageValid()"
(action)="confirm()"
/>
@@ -395,10 +397,10 @@
</div>
</div>
<div class="buttons">
- <app-button [text]="'Annuler'" (action)="closeModal()" />
- <app-button
- [text]="'Valider'"
- [style]="buttonTypeEnum.Primary"
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Annuler'" (action)="closeModal()" />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Valider'"
[disabled]="!isPageValid()"
(action)="confirm()"
/>
@@ -442,10 +444,10 @@
</div>
<div class="buttons">
- <app-button [text]="'Annuler'" (action)="closeModal()" />
- <app-button
- [text]="'Supprimer'"
- [style]="buttonTypeEnum.Primary"
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Annuler'" (action)="closeModal()" />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Supprimer'"
[disabled]="!passwordValid(oldPassword)"
(action)="confirmDeleteAccount()"
/>
diff --git a/src/app/profile/edit/edit.component.scss b/src/app/profile/edit/edit.component.scss
index 40c53ecf8ea3cf1422d863a55339d6b248f3fca4..4eccd3dc2bdd0c9b9331dd9c6da25a34d24a5b98 100644
--- a/src/app/profile/edit/edit.component.scss
+++ b/src/app/profile/edit/edit.component.scss
@@ -52,20 +52,6 @@
cursor: pointer;
}
}
-
- .deleteAccount {
- ::ng-deep {
- svg {
- height: 22px;
- width: 22px;
- margin-right: 4px;
- }
- span {
- color: $red;
- @include font-regular-14;
- }
- }
- }
}
.navigation {
@@ -112,20 +98,9 @@
}
.credentialsTab {
- .buttons {
- margin-top: 25px;
- display: flex;
- flex-wrap: wrap;
- gap: 18px;
- // V3REMOVE
- ::ng-deep {
- svg {
- height: 22px;
- width: 22px;
- margin-right: 4px;
- }
- }
- }
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
}
.credentialsTab ::ng-deep .secondary {
width: 220px !important;
diff --git a/src/app/profile/edit/edit.component.ts b/src/app/profile/edit/edit.component.ts
index 8dd7921ade0338bc4021287b7cf89a80406a5865..5097bccb9e2273d9cfeed33c036655b82474d334 100644
--- a/src/app/profile/edit/edit.component.ts
+++ b/src/app/profile/edit/edit.component.ts
@@ -10,7 +10,7 @@ import { User } from '../../models/user.model';
import { AuthService } from '../../services/auth.service';
import { NotificationService } from '../../services/notification.service';
import { ButtonType } from '../../shared/components/button/buttonType.enum';
-import { ButtonTypeV3 } from '../../shared/components/v3/button/button.type';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { CustomRegExp } from '../../utils/CustomRegExp';
import { ProfileService } from '../services/profile.service';
@@ -34,7 +34,7 @@ enum showPasswordEnum {
})
export class EditComponent implements OnInit {
public tabsEnum = tabsEnum;
- public buttonTypeEnum = ButtonType; // V3REMOVE
+ public buttonTypeEnum = ButtonType;
public buttonTypeEnumV3 = ButtonTypeV3;
public currentTab: tabsEnum = tabsEnum.details;
diff --git a/src/app/profile/personal-offer-edition/personal-offer-edition.component.html b/src/app/profile/personal-offer-edition/personal-offer-edition.component.html
index 9645fe1653052b32b8ee80b937c61ce49591a51a..89742a82493c43a1d07dca25927a6798781b8dac 100644
--- a/src/app/profile/personal-offer-edition/personal-offer-edition.component.html
+++ b/src/app/profile/personal-offer-edition/personal-offer-edition.component.html
@@ -1,12 +1,11 @@
<div class="content-container full-screen">
<div class="edit-personal-offer">
<app-v3-button
- [label]="'Retour'"
+ [routerLink]="'/profile'"
[variant]="buttonTypeEnumV3.Tertiary"
- [iconFolder]="'ico'"
- [iconName]="'arrowBackSmall'"
+ [label]="'Retour'"
+ [iconName]="'arrowBackV3'"
[size]="'large'"
- (action)="goBack()"
/>
<div class="header">
<div class="title">
@@ -15,19 +14,19 @@
<h2 *ngIf="structureName" class="overtitle">{{ structureName }}</h2>
</div>
</div>
- <app-button
- class="hide-on-mobile deleteOffer"
- [style]="buttonTypeEnum.Secondary"
- [text]="'Supprimer mon offre'"
- [iconType]="'ico'"
- [iconBtn]="'removeCross'"
+ <app-v3-button
+ class="hide-on-mobile"
+ [variant]="buttonTypeEnumV3.SecondaryDelete"
+ [label]="'Supprimer mon offre de service'"
+ [iconName]="'deleteV3'"
+ [wide]="true"
+ [size]="'small'"
(action)="showDeleteOfferModal()"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
- [iconType]="'ico'"
- [iconBtn]="'deleteAccount'"
+ [variant]="buttonTypeEnumV3.SecondaryDelete"
+ [iconName]="'deleteV3'"
(action)="showDeleteOfferModal()"
/>
</div>
@@ -71,11 +70,15 @@
<!-- Footer -->
<div class="footer">
- <app-button [text]="'Annuler'" [iconBtn]="'close'" [disabled]="personalOfferForm?.pristine" (action)="cancel()" />
- <app-button
- [text]="'Valider'"
- [iconBtn]="'check'"
- [style]="buttonTypeEnum.Primary"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Annuler'"
+ [disabled]="personalOfferForm?.pristine"
+ (action)="cancel()"
+ />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Valider'"
[disabled]="personalOfferForm?.pristine"
(action)="confirm()"
/>
@@ -102,8 +105,8 @@
</p>
<div class="buttons">
- <app-button [text]="'Annuler'" (action)="closeModal()" />
- <app-button [text]="'Supprimer'" [style]="buttonTypeEnum.Primary" (action)="confirmDeleteOffer()" />
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Annuler'" (action)="closeModal()" />
+ <app-v3-button [variant]="buttonTypeEnumV3.Primary" [label]="'Supprimer'" (action)="confirmDeleteOffer()" />
</div>
</div>
</div>
diff --git a/src/app/profile/personal-offer-edition/personal-offer-edition.component.scss b/src/app/profile/personal-offer-edition/personal-offer-edition.component.scss
index 0994f49fdbb90f761b576ee70ea4bd3b4f7bed25..4a5bb4c2757583eef8bb79cf4ca8f0158e917dae 100644
--- a/src/app/profile/personal-offer-edition/personal-offer-edition.component.scss
+++ b/src/app/profile/personal-offer-edition/personal-offer-edition.component.scss
@@ -59,20 +59,6 @@
cursor: pointer;
}
}
-
- .deleteOffer {
- ::ng-deep {
- svg {
- height: 22px;
- width: 22px;
- margin-right: 4px;
- }
- span {
- color: $red;
- @include font-regular-14;
- }
- }
- }
}
.navigation {
diff --git a/src/app/profile/personal-offer-edition/personal-offer-edition.component.ts b/src/app/profile/personal-offer-edition/personal-offer-edition.component.ts
index 953f2db2454337a6ab128daeccc5623ee9fd81f9..131e2091403035bc8f837eb7cedf3ded06315718 100644
--- a/src/app/profile/personal-offer-edition/personal-offer-edition.component.ts
+++ b/src/app/profile/personal-offer-edition/personal-offer-edition.component.ts
@@ -3,8 +3,7 @@ import { UntypedFormControl, UntypedFormGroup } from '@angular/forms';
import { ActivatedRoute, Data, Router } from '@angular/router';
import { CategoriesToggle } from '../../models/categoriesToggle.model';
import { NotificationService } from '../../services/notification.service';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
-import { ButtonTypeV3 } from '../../shared/components/v3/button/button.type';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { CategoryEnum } from '../../shared/enum/category.enum';
import { Category } from '../../structure-list/models/category.model';
import { SearchService } from '../../structure-list/services/search.service';
@@ -22,7 +21,6 @@ enum tabsEnum {
styleUrls: ['./personal-offer-edition.component.scss'],
})
export class PersonalOfferEditionComponent implements OnInit {
- public buttonTypeEnum = ButtonType; // V3REMOVE
public buttonTypeEnumV3 = ButtonTypeV3;
public tabsEnum = tabsEnum;
public currentTab: tabsEnum = tabsEnum.onlineProcedures;
diff --git a/src/app/profile/profile-structure/personal-offer/personal-offer.component.html b/src/app/profile/profile-structure/personal-offer/personal-offer.component.html
index fc6cefa431adff8c4aebb339546982c1d6875aeb..84ee35e9e40fa0247716081a5501733e5b639147 100644
--- a/src/app/profile/profile-structure/personal-offer/personal-offer.component.html
+++ b/src/app/profile/profile-structure/personal-offer/personal-offer.component.html
@@ -1,23 +1,25 @@
<div *ngIf="this.personalOffer.categoriesDisplay" class="container">
<div class="header">
<h2>mon offre de service</h2>
- <app-button
+ <app-v3-button
*ngIf="!isPublic"
- class="hide-on-mobile"
- tabindex="none"
- [iconBtn]="'edit'"
- [text]="'Modifier mon offre'"
- [style]="buttonTypeEnum.SecondaryWide"
[state]="{ structureName: this.structureName }"
+ class="hide-on-mobile"
routerLink="./edit-personal-offer/{{ this.personalOffer._id }}"
+ tabindex="none"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier mon offre de service'"
+ [iconName]="'editV3'"
+ [size]="'small'"
+ [wide]="true"
/>
- <app-button
+ <app-v3-icon-button
*ngIf="!isPublic"
class="hide-on-desktop"
- tabindex="none"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
routerLink="./edit-personal-offer/{{ this.personalOffer._id }}"
+ tabindex="none"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
/>
</div>
<div class="content">
diff --git a/src/app/profile/profile-structure/personal-offer/personal-offer.component.ts b/src/app/profile/profile-structure/personal-offer/personal-offer.component.ts
index c98d015f274960525c9c3eaaa24903be426fa272..5414225e5e2c322f1707e954b7aca12d09cad4ac 100644
--- a/src/app/profile/profile-structure/personal-offer/personal-offer.component.ts
+++ b/src/app/profile/profile-structure/personal-offer/personal-offer.component.ts
@@ -1,5 +1,5 @@
import { Component, Input } from '@angular/core';
-import { ButtonType } from '../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../shared/components/v3/button/button-type.enum';
import { PersonalOffer } from './../../../models/personalOffer.model';
@Component({
@@ -11,5 +11,6 @@ export class PersonalOfferComponent {
@Input() public personalOffer: PersonalOffer;
@Input() public isPublic: boolean;
@Input() public structureName?: string;
- public buttonTypeEnum = ButtonType;
+
+ public buttonTypeEnumV3 = ButtonTypeV3;
}
diff --git a/src/app/profile/profile-structure/profile-structure.component.html b/src/app/profile/profile-structure/profile-structure.component.html
index 44aa52fed719bcbcb991db079bca97b48742ccf7..16094a7c01dc0839236f1b8fa02e2b1a02561a45 100644
--- a/src/app/profile/profile-structure/profile-structure.component.html
+++ b/src/app/profile/profile-structure/profile-structure.component.html
@@ -20,12 +20,12 @@
</div>
</div>
<div class="right">
- <app-button
+ <app-v3-button
*ngIf="isPending && !isPublic"
class="hide-on-mobile"
- [iconType]="'form'"
- [text]="'Annuler la demande'"
- [style]="buttonTypeEnum.Secondary"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Annuler la demande'"
+ [size]="'small'"
(click)="handleCancelJoin(structure._id); $event.stopPropagation()"
/>
</div>
@@ -36,47 +36,46 @@
<div class="sectionHeader">
<p class="sectionTitle">informations</p>
<div class="sectionButtons">
- <app-button
+ <app-v3-button
class="hide-on-mobile"
routerLink="./"
+ [routerLinkActive]="'active'"
tabindex="none"
- [iconBtn]="'eyePassword'"
- [iconType]="'form'"
- [text]="'Voir la structure'"
- [style]="buttonTypeEnum.SecondaryWide"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Voir la structure'"
+ [iconFolder]="'form'"
+ [iconName]="'eyeV3'"
+ [size]="'small'"
[queryParams]="{ id: structure._id }"
- [routerLinkActive]="'active'"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
routerLink="./"
+ [routerLinkActive]="'active'"
tabindex="none"
- [iconBtn]="'eyePassword'"
- [iconType]="'form'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconFolder]="'form'"
+ [iconName]="'eyeV3'"
[queryParams]="{ id: structure._id }"
- [routerLinkActive]="'active'"
/>
- <app-button
+ <app-v3-button
*ngIf="!isPublic && !isPending"
class="hide-on-mobile"
- tabindex="none"
- [ngClass]="{ warning: !isValid() }"
- [iconBtn]="'edit'"
- [text]="'Modifier la structure'"
- [style]="buttonTypeEnum.SecondaryWide"
routerLink="./edit-structure/{{ structure._id }}"
[routerLinkActive]="'active'"
+ tabindex="none"
+ [variant]="isValid() ? buttonTypeEnumV3.PrimaryBlack : buttonTypeEnumV3.PrimaryWarning"
+ [label]="'Modifier la structure'"
+ [size]="'small'"
/>
- <app-button
+ <app-v3-icon-button
*ngIf="!isPublic && !isPending"
class="hide-on-desktop"
- tabindex="none"
- [ngClass]="{ warning: !isValid() }"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
routerLink="./edit-structure/{{ structure._id }}"
[routerLinkActive]="'active'"
+ tabindex="none"
+ [variant]="isValid() ? buttonTypeEnumV3.PrimaryBlack : buttonTypeEnumV3.PrimaryWarning"
+ [iconName]="'editV3'"
/>
</div>
</div>
@@ -107,22 +106,25 @@
<div *ngIf="membersWithJobWithPO.length > 0" class="section">
<div class="sectionHeader">
<p class="sectionTitle">Accompagnant·es numériques</p>
- <app-button
+ <app-v3-button
*ngIf="!isPublic && !isPending"
class="hide-on-mobile"
- [iconBtn]="'edit'"
- [text]="'Gérer les membres'"
- [style]="buttonTypeEnum.SecondaryWide"
routerLink="./structure-members-management/{{ structure._id }}"
[routerLinkActive]="'active'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Gérer les membres'"
+ [iconName]="'editV3'"
+ [size]="'small'"
+ [wide]="true"
/>
- <app-button
+ <app-v3-icon-button
*ngIf="!isPublic && !isPending"
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
routerLink="./structure-members-management/{{ structure._id }}"
[routerLinkActive]="'active'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
+ [queryParams]="{ id: structure._id }"
/>
</div>
<div class="sectionContent members">
@@ -133,11 +135,13 @@
*ngIf="!isPublic && !this.personalOffer && userProfile.job?.hasPersonalOffer && !isPending"
class="call-to-action"
>
- <app-button
- [iconBtn]="'add'"
- [text]="'Ajouter une offre'"
- [style]="buttonTypeEnum.SecondaryUltraWide"
+ <app-v3-button
[routerLinkActive]="'active'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Ajouter une offre'"
+ [iconName]="'addV3'"
+ [size]="'small'"
+ [wide]="true"
(click)="goToOffer()"
/>
</div>
diff --git a/src/app/profile/profile-structure/profile-structure.component.ts b/src/app/profile/profile-structure/profile-structure.component.ts
index 1bf25dedea210c78517279b253062dbc21407017..6051f6aa924b5f50ff98f8ec3d23480f479ca67e 100644
--- a/src/app/profile/profile-structure/profile-structure.component.ts
+++ b/src/app/profile/profile-structure/profile-structure.component.ts
@@ -5,7 +5,7 @@ import { DateTime } from 'luxon';
import { structureFormStep } from '../../form/form-view/structure-form/structureFormStep.enum';
import { Structure } from '../../models/structure.model';
import { StructureWithOwners } from '../../models/structureWithOwners.model';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { CollapseType } from '../../shared/components/v3/collapse/collapse.type';
import { SearchService } from '../../structure-list/services/search.service';
import { formUtils } from '../../utils/formUtils';
@@ -29,7 +29,8 @@ export class ProfileStructureComponent implements OnInit {
public membersWithJobWithPO: User[] = [];
public structureForm: FormGroup;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
+ public showDetails = false;
public addMemberModalOpened = false;
public structure: Structure;
public personalOffer: PersonalOffer;
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index c7597bd115468729a0f15293b819a73a01b81cf9..9b80ca2f4655d83c74696d3616fbf988a9ee6e06 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -1,47 +1,49 @@
<div *ngIf="userProfile" class="content-container full-screen">
<div class="goBack">
<app-v3-button
+ routerLink="/annuaire"
[label]="'Retour'"
[variant]="buttonTypeEnumV3.Tertiary"
- [iconFolder]="'ico'"
[iconName]="'arrowBackSmall'"
[size]="'large'"
- (action)="goBack()"
/>
</div>
<section>
<div class="header">
<h1>Profil</h1>
- <app-button
+ <app-v3-button
*ngIf="isPublic && userProfile.withAppointment"
class="hide-on-mobile rdv"
tabindex="none"
[routerLink]="['/orientation']"
[state]="{ rdvUser: userProfile }"
- [iconBtn]="'rdv'"
- [text]="'Demander un RDV'"
- [style]="buttonTypeEnum.SecondaryWide"
[routerLinkActive]="'active'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Demander un RDV'"
+ [size]="'small'"
+ [wide]="true"
/>
- <app-button
+ <app-v3-button
*ngIf="!isPublic"
class="hide-on-mobile"
- routerLink="/profile/edit"
tabindex="none"
- [iconBtn]="'edit'"
- [text]="'Modifier mon profil'"
- [style]="buttonTypeEnum.SecondaryWide"
+ routerLink="/profile/edit"
[routerLinkActive]="'active'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Modifier mon profil'"
+ [iconName]="'editV3'"
+ [size]="'small'"
+ [wide]="true"
/>
- <app-button
+ <app-v3-icon-button
*ngIf="!isPublic"
class="hide-on-desktop"
- routerLink="/profile/edit"
tabindex="none"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ routerLink="/profile/edit"
[routerLinkActive]="'active'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [iconName]="'editV3'"
/>
</div>
<div class="profile">
@@ -62,25 +64,28 @@
</div>
<div *ngIf="isPublic && userProfile.withAppointment" class="row">
<app-svg-icon [iconClass]="'icon-20'" [type]="'tags'" [icon]="'tagRdv'" />
- <div>Render-vous</div>
+ <div>Rendez-vous</div>
</div>
</div>
<div *ngIf="userProfile.description" class="description">{{ userProfile.description }}</div>
</div>
</div>
- <app-button
+ <app-v3-button
*ngIf="!isPublic && !userProfile.description"
- routerLink="/profile/edit"
+ class="centerButton"
tabindex="none"
- class="addDescription"
- [iconBtn]="'edit'"
- [text]="'Ajouter une description'"
- [style]="buttonTypeEnum.SecondaryUltraWide"
- [state]="{ data: 'description' }"
+ routerLink="/profile/edit"
[routerLinkActive]="'active'"
+ [state]="{ data: 'description' }"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Ajouter une description'"
+ [iconName]="'addV3'"
+ [size]="'small'"
+ [wide]="true"
/>
</section>
+
<!-- Private profile with pending structures -->
<section *ngIf="!isPublic">
<div class="header">
@@ -88,24 +93,26 @@
<ng-template ngPluralCase="1">Structure</ng-template>
<ng-template ngPluralCase="other">Structures</ng-template>
</h1>
- <app-button
+ <app-v3-button
*ngIf="userProfile.structuresLink.length > 0"
class="hide-on-mobile"
routerLink="./structures-management"
- tabindex="none"
- [iconBtn]="'edit'"
- [text]="userProfile.structuresLink.length > 1 ? 'Gérer mes structures' : 'Gérer ma structure'"
- [style]="buttonTypeEnum.SecondaryWide"
[routerLinkActive]="'active'"
+ tabindex="none"
+ [iconName]="'editV3'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="userProfile.structuresLink.length > 1 ? 'Gérer mes structures' : 'Gérer ma structure'"
+ [size]="'small'"
+ [wide]="true"
/>
- <app-button
+ <app-v3-icon-button
*ngIf="userProfile.structuresLink.length > 0"
class="hide-on-desktop"
- routerLink="./structures-management"
tabindex="none"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ routerLink="./structures-management"
[routerLinkActive]="'active'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [iconName]="'editV3'"
/>
</div>
<div
@@ -129,15 +136,18 @@
[isPublic]="this.isPublic"
/>
</div>
- <app-button
- class="addStructure"
- routerLink="/form/structure"
+ <app-v3-button
+ class="centerButton"
tabindex="none"
- [style]="buttonTypeEnum.SecondaryUltraWide"
- [iconBtn]="'add'"
- [text]="'Ajouter une structure'"
+ routerLink="/form/structure"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Ajouter une structure'"
+ [iconName]="'addV3'"
+ [size]="'small'"
+ [wide]="true"
/>
</section>
+
<!-- Public profile -->
<section *ngIf="isPublic && userProfile.structuresLink.length > 0">
<div class="header">
diff --git a/src/app/profile/profile.component.scss b/src/app/profile/profile.component.scss
index 5ba3c25a758c80f3f2755634478aa0d91c94b0b9..ab18037b43dad79aa68cbab104215c33b1485e8e 100644
--- a/src/app/profile/profile.component.scss
+++ b/src/app/profile/profile.component.scss
@@ -118,7 +118,7 @@ section {
width: 100%;
}
-.addStructure {
+.centerButton {
margin: auto;
}
diff --git a/src/app/profile/profile.component.ts b/src/app/profile/profile.component.ts
index aaa2268fe620be12bca53804b65dca2a9026ef15..bd5e841d81a332af7e7e379cfe2159513b01d084 100644
--- a/src/app/profile/profile.component.ts
+++ b/src/app/profile/profile.component.ts
@@ -8,8 +8,7 @@ import { StructureWithOwners } from '../models/structureWithOwners.model';
import { User } from '../models/user.model';
import { NotificationService } from '../services/notification.service';
import { StructureService } from '../services/structure.service';
-import { ButtonType } from '../shared/components/button/buttonType.enum';
-import { ButtonTypeV3 } from '../shared/components/v3/button/button.type';
+import { ButtonTypeV3 } from '../shared/components/v3/button/button-type.enum';
import { Utils } from '../utils/utils';
import { UserService } from './../services/user.service';
import { ProfileService } from './services/profile.service';
@@ -23,7 +22,6 @@ export class ProfileComponent implements OnInit {
public userProfile: User;
public structures: StructureWithOwners[] = [];
public pendingStructures: StructureWithOwners[] = [];
- public buttonTypeEnum = ButtonType; // V3REMOVE
public buttonTypeEnumV3 = ButtonTypeV3;
public isPublic: boolean;
diff --git a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.html b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.html
index 03498c073b49c99d36b1cc2c49595c3388bfe621..041109e12bf600e7025a26bba1ba1247a405d1c4 100644
--- a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.html
+++ b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.html
@@ -18,11 +18,11 @@
</div>
</div>
<div class="buttons" fxLayout="row" fxLayoutAlign="space-between center">
- <app-button [text]="'Annuler'" (action)="closeModal(false)" />
- <app-button
- [text]="'Ajouter'"
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Annuler'" (action)="closeModal(false)" />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Ajouter'"
[disabled]="formAddAccount.invalid"
- [style]="buttonTypeEnum.Primary"
(action)="addOwner()"
/>
</div>
diff --git a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts
index decb4f2ae56115e2165b13d193ee4e4448f66977..362aa8d8c81c519cd8710c9face627de34b7757a 100644
--- a/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts
+++ b/src/app/profile/structure-add-member-modal/structure-add-member-modal.component.ts
@@ -4,7 +4,7 @@ import { StructureWithOwners } from '../../models/structureWithOwners.model';
import { TempUser } from '../../models/temp-user.model';
import { NotificationService } from '../../services/notification.service';
import { StructureService } from '../../services/structure.service';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { CustomRegExp } from '../../utils/CustomRegExp';
@Component({
@@ -16,7 +16,7 @@ export class StructureAddMemberModalComponent implements OnInit {
@Input() public opened: boolean;
@Input() public structure: StructureWithOwners;
@Output() closed = new EventEmitter();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public formAddAccount: FormGroup;
public ownerAlreadyLinked = false;
diff --git a/src/app/profile/structure-edition-summary/structure-edition-summary.component.html b/src/app/profile/structure-edition-summary/structure-edition-summary.component.html
index 21f49a3b5d09259038159da7714c278c81c34c94..670594b743738a876f33111a2dbf40079ee16aa3 100644
--- a/src/app/profile/structure-edition-summary/structure-edition-summary.component.html
+++ b/src/app/profile/structure-edition-summary/structure-edition-summary.component.html
@@ -1,12 +1,12 @@
<div class="container">
<div class="scroll">
<app-v3-button
- [label]="'Retour'"
+ routerLink="/profile"
+ tabindex="0"
[variant]="buttonTypeEnumV3.Tertiary"
- [iconFolder]="'ico'"
- [iconName]="'arrowBackSmall'"
+ [label]="'Retour'"
[size]="'large'"
- (action)="goBack()"
+ [iconName]="'arrowBackV3'"
/>
<div class="header">
<h1>
@@ -24,17 +24,18 @@
<section class="nameAndAddress">
<div class="sectionHeader">
<p>Nom et adresse</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.SecondaryWide"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureNameAndAddress)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureNameAndAddress)"
/>
</div>
@@ -57,17 +58,18 @@
<section class="structureType" [ngClass]="{ warningBorder: !isFieldValid('structureType') }">
<div class="sectionHeader">
<p>Type de structure</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.SecondaryWide"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureType)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureType)"
/>
</div>
@@ -83,17 +85,18 @@
<section class="phoneAndMail" [ngClass]="{ warningBorder: requiredPhoneOrMailError() }">
<div class="sectionHeader">
<p>Téléphone et email</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureContact)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureContact)"
/>
</div>
@@ -117,17 +120,18 @@
<section class="description">
<div class="sectionHeader">
<p>Présentation de la structure</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureDescription)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureDescription)"
/>
</div>
@@ -140,17 +144,18 @@
<section class="accessModality" [ngClass]="{ warningBorder: !isFieldValid('accessModality', 'categories') }">
<div class="sectionHeader">
<p>Modalité d'accueil</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureAccessModality)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureAccessModality)"
/>
</div>
@@ -169,17 +174,18 @@
<section class="hours">
<div class="sectionHeader">
<p>Horaires</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureHours)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureHours)"
/>
</div>
@@ -207,17 +213,18 @@
<section class="PMR" [ngClass]="{ warningBorder: structure.pmrAccess === null }">
<div class="sectionHeader">
<p>Accessibilité pour les personnes à mobilité réduite</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structurePmr)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structurePmr)"
/>
</div>
@@ -232,17 +239,18 @@
<section class="webAndSocialNetworks">
<div class="sectionHeader">
<p>Présence sur internet</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureWebAndSocialNetwork)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureWebAndSocialNetwork)"
/>
</div>
@@ -292,17 +300,18 @@
>
<div class="sectionHeader">
<p>Public admis</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structurePublicTarget)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structurePublicTarget)"
/>
</div>
@@ -327,17 +336,18 @@
<section class="publics">
<div class="sectionHeader">
<p>Public spécifique admis</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structurePublicTargetOptional)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structurePublicTargetOptional)"
/>
</div>
@@ -409,17 +419,18 @@
<section class="proceduresAccompaniment">
<div class="sectionHeader">
<p>Démarches en ligne</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureDigitalHelpingAccompaniment)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureDigitalHelpingAccompaniment)"
/>
</div>
@@ -436,17 +447,18 @@
<section class="proceduresAccompaniment">
<div class="sectionHeader">
<p>Autres démarches proposées</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureDigitalHelpingAccompanimentOther)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureDigitalHelpingAccompanimentOther)"
/>
</div>
@@ -461,17 +473,18 @@
<section class="learning">
<div class="sectionHeader">
<p>Compétences numériques</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureTrainingType)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureTrainingType)"
/>
</div>
@@ -534,17 +547,18 @@
>
<div class="sectionHeader">
<p>Gratuité des ateliers</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureTrainingPrice)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureTrainingPrice)"
/>
</div>
@@ -557,17 +571,18 @@
<section class="wifi">
<div class="sectionHeader">
<p>Wifi</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureWifi)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureWifi)"
/>
</div>
@@ -581,17 +596,18 @@
<section class="equipements">
<div class="sectionHeader">
<p>Matériel mis à disposition</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureEquipments)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureEquipments)"
/>
</div>
@@ -615,17 +631,18 @@
<section class="labels">
<div class="sectionHeader">
<p>Labelisations proposées</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureLabels)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureLabels)"
/>
</div>
@@ -640,17 +657,18 @@
<section class="solidarityMaterial">
<div class="sectionHeader">
<p>Vente de matériel à prix solidaire</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureSolidarityMaterial)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureSolidarityMaterial)"
/>
</div>
@@ -665,17 +683,18 @@
<section class="covid">
<div class="sectionHeader">
<p>Informations spécifiques à la période COVID</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureCovidInfo)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureCovidInfo)"
/>
</div>
@@ -688,17 +707,18 @@
<section class="dataShare">
<div class="sectionHeader">
<p>Partage de données sur data.grandlyon.com</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToEdit(structureFormStep.structureConsent)"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToEdit(structureFormStep.structureConsent)"
/>
</div>
@@ -710,17 +730,18 @@
<section class="members">
<div class="sectionHeader">
<p>Gérer les membres de la structure</p>
- <app-button
+ <app-v3-button
class="hide-on-mobile"
- [text]="'Modifier'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'editButton'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Modifier'"
+ [iconName]="'editV3'"
+ [size]="'small'"
(action)="goToManageMembers()"
/>
- <app-button
+ <app-v3-icon-button
class="hide-on-desktop"
- [iconBtn]="'edit'"
- [style]="buttonTypeEnum.SecondaryOnlyIcon"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [iconName]="'editV3'"
(action)="goToManageMembers()"
/>
</div>
@@ -743,19 +764,19 @@
Vous pourrez valider après avoir renseigné l’intégralité des champs obligatoires.
</p>
<div class="buttons">
- <app-button [text]="'Retour'" [iconBtn]="'close'" (click)="goBack()" />
- <app-button
- [text]="'Valider'"
- [iconBtn]="'check'"
- [style]="buttonTypeEnum.Primary"
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Retour'" [size]="'small'" (action)="goBack()" />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Valider'"
[disabled]="!isFormValid()"
- (click)="updateStructureUpdateDate()"
+ [size]="'small'"
+ (action)="updateStructureUpdateDate()"
/>
</div>
</ng-container>
<ng-container *ngIf="!isUpdateStructure">
<div class="buttons">
- <app-button [text]="'Retour'" (click)="goBack()" />
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Retour'" [size]="'small'" (action)="goBack()" />
</div>
</ng-container>
</div>
diff --git a/src/app/profile/structure-edition-summary/structure-edition-summary.component.ts b/src/app/profile/structure-edition-summary/structure-edition-summary.component.ts
index 524505e1c68d6057d3d185ea824418ae110e8538..3cd32ec78e819a16edaa6062f2b8171903ede61b 100644
--- a/src/app/profile/structure-edition-summary/structure-edition-summary.component.ts
+++ b/src/app/profile/structure-edition-summary/structure-edition-summary.component.ts
@@ -8,8 +8,7 @@ import { Owner } from '../../models/owner.model';
import { Structure } from '../../models/structure.model';
import { NotificationService } from '../../services/notification.service';
import { StructureService } from '../../services/structure.service';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
-import { ButtonTypeV3 } from '../../shared/components/v3/button/button.type';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { Demarches } from '../../shared/enum/demarches.enum';
import { AccessModality } from '../../structure-list/enum/access-modality.enum';
import { Equipment } from '../../structure-list/enum/equipment.enum';
@@ -37,7 +36,6 @@ export class StructureEditionSummaryComponent implements OnInit {
public members: Owner[];
public summary: IStructureSummary[] = new formUtils().structureSummary;
public structureFormStep = structureFormStep;
- public buttonTypeEnum = ButtonType; // V3REMOVE
public buttonTypeEnumV3 = ButtonTypeV3;
public equipmentEnum = Equipment;
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.html b/src/app/profile/structure-members-management/structure-members-management.component.html
index d701eebe726884483d4726c7fcf49fb7bc9e17f8..156797cf083bb4e4897c5391565f3dc71c006526 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.html
+++ b/src/app/profile/structure-members-management/structure-members-management.component.html
@@ -2,7 +2,6 @@
<app-v3-button
[label]="'Retour'"
[variant]="buttonTypeEnumV3.Tertiary"
- [iconFolder]="'ico'"
[iconName]="'arrowBackSmall'"
[size]="'large'"
(action)="goBack()"
@@ -12,10 +11,13 @@
<h1>Gérer les membres de</h1>
<h2>{{ structure.structureName }}</h2>
</div>
- <app-button
+ <app-v3-button
tabindex="0"
- [style]="buttonTypeEnum.Secondary"
- [text]="'Ajouter un membre'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Ajouter un membre'"
+ [iconName]="'addV3'"
+ [size]="'small'"
+ [wide]="true"
(click)="addMemberModalOpened = true"
/>
</div>
@@ -39,12 +41,12 @@
<p *ngIf="displayJobEmployer(member)" class="job">{{ displayJobEmployer(member) }}</p>
</div>
</div>
- <app-button
+ <app-v3-button
*ngIf="currentProfile._id !== member._id"
- class="button-member"
tabindex="0"
- [style]="buttonTypeEnum.Secondary"
- [text]="'Exclure ce membre'"
+ [variant]="buttonTypeEnumV3.SecondaryDelete"
+ [label]="'Exclure ce membre'"
+ [size]="'small'"
(click)="memberToExclude = member; excludeModalOpened = true"
/>
</div>
@@ -62,10 +64,11 @@
</div>
<div class="pendingContainer">
<p class="text">Demande de rattachement envoyée le {{ member.updatedAt | date : 'dd/MM/YYYY' }}</p>
- <app-button
+ <app-v3-button
tabindex="0"
- [style]="buttonTypeEnum.Secondary"
- [text]="'Annuler la demande'"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Annuler la demande'"
+ [size]="'small'"
(click)="tempUserToCancel = member; cancelAddTempUserModalOpened = true"
/>
</div>
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.scss b/src/app/profile/structure-members-management/structure-members-management.component.scss
index 00a4b5cd44ae2c2703e82acec277ba25fffefb53..8bc42d856c8ba7f6e105d1d8a1b74635c4f1a962 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.scss
+++ b/src/app/profile/structure-members-management/structure-members-management.component.scss
@@ -109,11 +109,6 @@
width: 184px !important;
height: 24px !important;
}
- .button-member {
- ::ng-deep .btn-regular.secondary .text {
- color: $red !important;
- }
- }
::ng-deep .modalBackground p {
white-space: pre-wrap;
}
diff --git a/src/app/profile/structure-members-management/structure-members-management.component.ts b/src/app/profile/structure-members-management/structure-members-management.component.ts
index 343ddce119856a6c48ce1288bf1ffe7d66c67bbf..a07079a5f18c090fa00b6693656f1cd52d02baeb 100644
--- a/src/app/profile/structure-members-management/structure-members-management.component.ts
+++ b/src/app/profile/structure-members-management/structure-members-management.component.ts
@@ -8,8 +8,7 @@ import { TempUser } from '../../models/temp-user.model';
import { User } from '../../models/user.model';
import { NotificationService } from '../../services/notification.service';
import { StructureService } from '../../services/structure.service';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
-import { ButtonTypeV3 } from '../../shared/components/v3/button/button.type';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { Utils } from '../../utils/utils';
import { ProfileService } from '../services/profile.service';
@@ -27,7 +26,6 @@ export class StructureMembersManagementComponent implements OnInit {
public addMemberModalOpened = false;
public excludeModalOpened = false;
public cancelAddTempUserModalOpened = false;
- public buttonTypeEnum = ButtonType; // V3REMOVE
public buttonTypeEnumV3 = ButtonTypeV3;
public isLoading = true;
public currentProfile: User;
diff --git a/src/app/profile/structures-management/structures-management.component.html b/src/app/profile/structures-management/structures-management.component.html
index 3c05d446712eb7f4b91fd35c5f8ecb95bb93701c..13a1d31566f40e5440ad1bb4ea3687fe6ef08803 100644
--- a/src/app/profile/structures-management/structures-management.component.html
+++ b/src/app/profile/structures-management/structures-management.component.html
@@ -1,24 +1,25 @@
<div class="content-container full-screen">
<div class="container">
<app-v3-button
+ routerLink="/profile"
[label]="'Retour'"
[variant]="buttonTypeEnumV3.Tertiary"
- [iconFolder]="'ico'"
[iconName]="'arrowBackSmall'"
[size]="'large'"
- (action)="goBack()"
/>
<div class="header">
<h1 [ngPlural]="structures.length">
<ng-template ngPluralCase="1">Gestion des structures</ng-template>
<ng-template ngPluralCase="other">Gérer mes structures</ng-template>
</h1>
- <app-button
+ <app-v3-button
routerLink="/form/structure"
tabindex="0"
- [style]="buttonTypeEnum.SecondaryWide"
- [iconBtn]="'add'"
- [text]="'Ajouter une structure'"
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Ajouter une structure'"
+ [iconName]="'addV3'"
+ [size]="'small'"
+ [wide]="true"
/>
</div>
<div *ngIf="structures" class="structuresList">
@@ -45,23 +46,24 @@
</div>
</div>
<div class="buttons">
- <app-button
- [text]="'Quitter la structure'"
- [style]="buttonTypeEnum.SecondaryWide"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Quitter la structure'"
+ [size]="'small'"
(click)="selectedStructure = elt.structure; leaveModalOpened = true"
/>
- <app-button
+ <app-v3-button
*ngIf="!isBeingDeleted(elt.structure)"
- class="deleteAction"
- [text]="'Supprimer la structure'"
- [style]="buttonTypeEnum.SecondaryWide"
+ [variant]="buttonTypeEnumV3.SecondaryDelete"
+ [label]="'Supprimer la structure'"
+ [size]="'small'"
(click)="selectedStructure = elt.structure; deleteModalOpened = true"
/>
- <app-button
+ <app-v3-button
*ngIf="isBeingDeleted(elt.structure)"
- class="deleteAction"
- [text]="'Annuler la suppression'"
- [style]="buttonTypeEnum.SecondaryWide"
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Annuler suppression'"
+ [size]="'small'"
(click)="selectedStructure = elt.structure; cancelDeleteModalOpened = true"
/>
</div>
diff --git a/src/app/profile/structures-management/structures-management.component.scss b/src/app/profile/structures-management/structures-management.component.scss
index 078da901489181a777f0087eafdef00451c875fc..7e7730c263fab793fcab98f3a02c05289af1a2bd 100644
--- a/src/app/profile/structures-management/structures-management.component.scss
+++ b/src/app/profile/structures-management/structures-management.component.scss
@@ -65,9 +65,6 @@
@media #{$phone} {
max-width: initial;
}
- app-button.deleteAction > ::ng-deep button > div {
- color: $red;
- }
}
}
}
diff --git a/src/app/profile/structures-management/structures-management.component.ts b/src/app/profile/structures-management/structures-management.component.ts
index 772d26969021674d11cdcde18757fa6301de7a42..082d322580f5962c0fbd8efbafff2408afa49e2e 100644
--- a/src/app/profile/structures-management/structures-management.component.ts
+++ b/src/app/profile/structures-management/structures-management.component.ts
@@ -7,8 +7,7 @@ import { StructureWithOwners } from '../../models/structureWithOwners.model';
import { User } from '../../models/user.model';
import { NotificationService } from '../../services/notification.service';
import { StructureService } from '../../services/structure.service';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
-import { ButtonTypeV3 } from '../../shared/components/v3/button/button.type';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
import { ProfileService } from '../services/profile.service';
@Component({
@@ -21,7 +20,6 @@ export class StructuresManagementComponent implements OnInit {
public structures: StructureWithOwners[] = [];
public selectedStructure: Structure;
public deleteInProgress: boolean;
- public buttonTypeEnum = ButtonType; // V3REMOVE
public buttonTypeEnumV3 = ButtonTypeV3;
public leaveModalOpened = false;
public deleteModalOpened = false;
diff --git a/src/app/reset-password/reset-password.component.html b/src/app/reset-password/reset-password.component.html
index 96bf02a65c7f79a7900d8dda71f1d5e050f8a4f6..691bc0a6c74795d3e45bd28b44767bc46b2c2cd5 100644
--- a/src/app/reset-password/reset-password.component.html
+++ b/src/app/reset-password/reset-password.component.html
@@ -22,18 +22,12 @@
</div>
</div>
<div class="footer" fxLayout="row" fxLayoutAlign="space-between center">
- <app-button
- [text]="'Annuler'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'fullButton'"
- (action)="goLogin()"
- />
- <app-button
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Annuler'" (action)="goLogin()" />
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Envoyer'"
[type]="'submit'"
[disabled]="loading"
- [text]="'Envoyer'"
- [style]="buttonTypeEnum.Primary"
- [extraClass]="'fullWidth'"
/>
</div>
</form>
diff --git a/src/app/reset-password/reset-password.component.ts b/src/app/reset-password/reset-password.component.ts
index eacae6eb8ac66d929a31aaa556c6741a86fcc8e5..c1a103cd6c48a6744e6be0ab38f3769eaec284d2 100644
--- a/src/app/reset-password/reset-password.component.ts
+++ b/src/app/reset-password/reset-password.component.ts
@@ -3,7 +3,7 @@ import { AbstractControl, UntypedFormBuilder, UntypedFormGroup, Validators } fro
import { ActivatedRoute, Router } from '@angular/router';
import { AuthService } from '../services/auth.service';
import { NotificationService } from '../services/notification.service';
-import { ButtonType } from '../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../shared/components/v3/button/button-type.enum';
@Component({
selector: 'app-reset-password',
@@ -18,7 +18,7 @@ export class ResetPasswordComponent implements OnInit {
// Condition form
public isShowConfirmPassword = false;
public isShowPassword = false;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(
private formBuilder: UntypedFormBuilder,
diff --git a/src/app/shared/components/custom-modal/custom-modal.component.html b/src/app/shared/components/custom-modal/custom-modal.component.html
index 87597f0fa55ec8c70931d2be76309b58186690d2..afb6ba47e561acc6dc8ead378955205d38b2dcf1 100644
--- a/src/app/shared/components/custom-modal/custom-modal.component.html
+++ b/src/app/shared/components/custom-modal/custom-modal.component.html
@@ -13,14 +13,14 @@
</div>
</div>
<div class="footerModal" fxLayout="row" fxLayoutAlign="space-around center" fxLayoutGap="8px">
- <app-button
- [text]="customCancelButton || 'Annuler'"
- [style]="buttonTypeEnum.modalSecondary"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="customCancelButton || 'Annuler'"
(action)="closeModal(false)"
/>
- <app-button
- [text]="customValidationButton || 'Valider'"
- [style]="buttonTypeEnum.modalPrimary"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="customValidationButton || 'Valider'"
(action)="closeModal(true)"
/>
</div>
diff --git a/src/app/shared/components/custom-modal/custom-modal.component.scss b/src/app/shared/components/custom-modal/custom-modal.component.scss
index 16c8f317c97191cf424e8c24b7d81c49a11195ed..02314a9585fe4704655f07882a5079608feb1838 100644
--- a/src/app/shared/components/custom-modal/custom-modal.component.scss
+++ b/src/app/shared/components/custom-modal/custom-modal.component.scss
@@ -40,9 +40,6 @@
.footerModal {
padding-right: 40px;
gap: 8px;
- app-button {
- flex: 1;
- }
}
}
}
diff --git a/src/app/shared/components/custom-modal/custom-modal.component.ts b/src/app/shared/components/custom-modal/custom-modal.component.ts
index 620b0f2fb7f1da0b8a148945706d28e6f0e1c80e..bc2b98e9a40f0b0668b9c9dff2e52fe0211152f4 100644
--- a/src/app/shared/components/custom-modal/custom-modal.component.ts
+++ b/src/app/shared/components/custom-modal/custom-modal.component.ts
@@ -1,5 +1,5 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { ButtonType } from '../button/buttonType.enum';
+import { ButtonTypeV3 } from '../v3/button/button-type.enum';
@Component({
selector: 'app-custom-modal',
@@ -15,7 +15,7 @@ export class CustomModalComponent {
@Input() public customValidationButton?: string;
@Input() public customCancelButton?: string;
@Output() closed = new EventEmitter<boolean>();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public closeModal(value: boolean): void {
this.closed.emit(value);
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.html b/src/app/shared/components/hour-picker/hour-picker.component.html
index 0c6eb0aaad0d480b74eac6085805e847744bc7cf..14b30f74b246c7f5b3aa571ad98179d613c6deb4 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.html
+++ b/src/app/shared/components/hour-picker/hour-picker.component.html
@@ -51,16 +51,20 @@
</div>
</div>
<div *ngIf="day.hours.length === 1" class="extraAction">
- <app-button
- [text]="'Ajouter'"
- [iconType]="'form'"
- [iconBtn]="'show'"
- [style]="buttonTypeEnum.Secondary"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.PrimaryBlack"
+ [label]="'Ajouter un horaire'"
+ [wide]="true"
(action)="addHours(day)"
/>
</div>
<div *ngIf="day.hours.length === 2" class="extraAction">
- <a tabindex="0" (click)="this.removeHours(day, 1)" (keyup.enter)="this.removeHours(day, 1)">Supprimer</a>
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Supprimer'"
+ [iconName]="'deleteV3'"
+ (action)="this.removeHours(day, 1)"
+ />
</div>
</div>
</div>
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.scss b/src/app/shared/components/hour-picker/hour-picker.component.scss
index 1abd6451f44e39ecadd62022127d24b2a132635e..21bf5313262f68ae8a3e4be07251ad5522032cc5 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.scss
+++ b/src/app/shared/components/hour-picker/hour-picker.component.scss
@@ -113,9 +113,3 @@ input[type='time']::-webkit-calendar-picker-indicator {
background: none;
display: none;
}
-
-::ng-deep .add app-button button {
- div.text {
- height: 32px !important;
- }
-}
diff --git a/src/app/shared/components/hour-picker/hour-picker.component.ts b/src/app/shared/components/hour-picker/hour-picker.component.ts
index 4b8ae1e30ed3dd178736091a437188b3e59574f0..a7027a8f2adbec2ca202ac8060c7115fbac358c9 100644
--- a/src/app/shared/components/hour-picker/hour-picker.component.ts
+++ b/src/app/shared/components/hour-picker/hour-picker.component.ts
@@ -4,7 +4,7 @@ import { Day } from '../../../models/day.model';
import { Time } from '../../../models/time.model';
import { WeekDayEnum } from '../../enum/weekDay.enum';
import { CheckHours } from '../../validator/form';
-import { ButtonType } from '../button/buttonType.enum';
+import { ButtonTypeV3 } from '../v3/button/button-type.enum';
@Component({
selector: 'app-hour-picker',
@@ -17,7 +17,7 @@ export class HourPickerComponent implements OnChanges, OnDestroy {
@Output() updateFormError = new EventEmitter<any>();
@Output() updateForm = new EventEmitter<UntypedFormGroup>();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public error = false;
private copiedDay: any;
diff --git a/src/app/shared/components/modal-confirmation/modal-confirmation.component.html b/src/app/shared/components/modal-confirmation/modal-confirmation.component.html
index 2c40286102272d455cb3afd2d28ce8c2429b7b59..5ee45d109c4c0ee0d0794492b8a514480dcf502f 100644
--- a/src/app/shared/components/modal-confirmation/modal-confirmation.component.html
+++ b/src/app/shared/components/modal-confirmation/modal-confirmation.component.html
@@ -10,16 +10,15 @@
</div>
<p>{{ content }}</p>
<div class="footerModal" fxLayout="row" fxLayoutAlign="space-around center" fxLayoutGap="8px">
- <app-button
+ <app-v3-button
*ngIf="!singleButton"
- [text]="'Annuler'"
- [style]="buttonTypeEnum.modalSecondary"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Annuler'"
(action)="closeModal(false)"
/>
- <app-button
- [text]="customConfirmationText ? customConfirmationText : 'Confirmer'"
- [style]="buttonTypeEnum.modalPrimary"
- [extraClass]="singleButton && 'fullWidth'"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="customConfirmationText ? customConfirmationText : 'Confirmer'"
(action)="closeModal(true)"
/>
</div>
diff --git a/src/app/shared/components/modal-confirmation/modal-confirmation.component.scss b/src/app/shared/components/modal-confirmation/modal-confirmation.component.scss
index f4f1e3cc548e0cc64a09a96042a4355b11ead873..a26a8b4f5561b4a5f73bf6c52449e2da9858e1eb 100644
--- a/src/app/shared/components/modal-confirmation/modal-confirmation.component.scss
+++ b/src/app/shared/components/modal-confirmation/modal-confirmation.component.scss
@@ -32,9 +32,6 @@
}
.footerModal {
gap: 8px;
- app-button {
- flex: 1;
- }
}
}
}
diff --git a/src/app/shared/components/modal-confirmation/modal-confirmation.component.ts b/src/app/shared/components/modal-confirmation/modal-confirmation.component.ts
index ff69a889bc587c82b26240bd3d948e5d7bda1129..87c91cbf9eae3827b65221df915f2db545adb0c3 100644
--- a/src/app/shared/components/modal-confirmation/modal-confirmation.component.ts
+++ b/src/app/shared/components/modal-confirmation/modal-confirmation.component.ts
@@ -1,5 +1,5 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { ButtonType } from '../button/buttonType.enum';
+import { ButtonTypeV3 } from '../v3/button/button-type.enum';
@Component({
selector: 'app-modal-confirmation',
@@ -12,7 +12,7 @@ export class ModalConfirmationComponent {
@Input() public customConfirmationText?: string;
@Input() public singleButton?: boolean;
@Output() closed = new EventEmitter<boolean>();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public closeModal(value: boolean): void {
this.closed.emit(value);
diff --git a/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.html b/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.html
index 28c6d7e5ebf17e2c3b3e79d49547a6512b6c8bc4..e056e95e27f3fc9b603af11b4c49dce86bb9d768 100644
--- a/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.html
+++ b/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.html
@@ -11,15 +11,15 @@
<p class="primaryContent">{{ primaryContent }}</p>
<p *ngIf="secondaryContent" class="secondaryContent">{{ secondaryContent }}</p>
<div class="footerModal" fxLayout="row" fxLayoutAlign="space-around center" fxLayoutGap="8px">
- <app-button
+ <app-v3-button
*ngIf="displayCancelButton"
- [text]="'Annuler'"
- [style]="buttonTypeEnum.modalSecondary"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Annuler'"
(action)="closeModal(false)"
/>
- <app-button
- [text]="customConfirmationText ? customConfirmationText : 'Confirmer'"
- [style]="buttonTypeEnum.modalPrimary"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="customConfirmationText ? customConfirmationText : 'Confirmer'"
(action)="closeModal(true)"
/>
</div>
diff --git a/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.scss b/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.scss
index afac06e1356893c01c6d7c92174be3fc0367ae38..11309e8e4f678e992bfc050e7b26353a64ad816b 100644
--- a/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.scss
+++ b/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.scss
@@ -35,9 +35,6 @@
}
.footerModal {
gap: 8px;
- app-button {
- flex: 1;
- }
}
}
}
diff --git a/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.ts b/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.ts
index 5d5d5756a5c598085be964c28f8ff2485fb1581d..8b21ee167b313c3ac103a47c7d47cc64426a46fa 100644
--- a/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.ts
+++ b/src/app/shared/components/modal-join-confirmation/modal-join-confirmation.component.ts
@@ -1,5 +1,5 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { ButtonType } from '../button/buttonType.enum';
+import { ButtonTypeV3 } from '../v3/button/button-type.enum';
@Component({
selector: 'app-join-modal-confirmation',
@@ -14,7 +14,7 @@ export class ModalJoinConfirmationComponent {
@Input() public customConfirmationText?: string;
@Input() public displayCancelButton = true;
@Output() closed = new EventEmitter<boolean>();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public closeModal(value: boolean): void {
this.closed.emit(value);
diff --git a/src/app/shared/components/password-form/password-form.component.html b/src/app/shared/components/password-form/password-form.component.html
index b33cf035febf4351dbd5e353d8be022085135a58..88711260e105b1e57595fb8ce12cf2154bf12dbc 100644
--- a/src/app/shared/components/password-form/password-form.component.html
+++ b/src/app/shared/components/password-form/password-form.component.html
@@ -194,22 +194,16 @@
</div>
</div>
<div class="form-group" fxLayout="row" fxLayoutAlign="center center" fxLayoutGap="20px">
- <app-button
- [text]="'Annuler'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'fullButton'"
- (action)="goHome()"
- />
- <app-button
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Annuler'" (action)="goHome()" />
+ <app-v3-button
[type]="'submit'"
[disabled]="
accountForm.get('confirmPassword').invalid ||
accountForm.get('password').invalid ||
(oldPasswordNeeded && passwordError)
"
- [text]="'Envoyer'"
- [style]="buttonTypeEnum.Primary"
- [extraClass]="'fullButton'"
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Envoyer'"
/>
</div>
</form>
diff --git a/src/app/shared/components/password-form/password-form.component.ts b/src/app/shared/components/password-form/password-form.component.ts
index d5ef82b6bbeaa22cc1d0fa562be67350b3a5fb5a..61d34106fdab22873d231e23c9568fae31abb176 100644
--- a/src/app/shared/components/password-form/password-form.component.ts
+++ b/src/app/shared/components/password-form/password-form.component.ts
@@ -6,7 +6,7 @@ import { AuthService } from '../../../services/auth.service';
import { NotificationService } from '../../../services/notification.service';
import { CustomRegExp } from '../../../utils/CustomRegExp';
import { MustMatch } from '../../validator/form';
-import { ButtonType } from '../button/buttonType.enum';
+import { ButtonTypeV3 } from '../v3/button/button-type.enum';
@Component({
selector: 'app-password-form',
@@ -15,7 +15,7 @@ import { ButtonType } from '../button/buttonType.enum';
})
export class PasswordFormComponent implements OnInit {
public accountForm: UntypedFormGroup;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public token: string;
public passwordError = false;
// Condition form
diff --git a/src/app/shared/components/svg-icon/svg-icon.component.scss b/src/app/shared/components/svg-icon/svg-icon.component.scss
index fd4fb1f1ca9bd62777687fe4410c0d8cba486f6b..59041a79d2dc0c74f4a1f45aa6f0e75f450b2f88 100644
--- a/src/app/shared/components/svg-icon/svg-icon.component.scss
+++ b/src/app/shared/components/svg-icon/svg-icon.component.scss
@@ -85,7 +85,7 @@ $sizes: (
svg {
// Scale the SVG to cover the whole app-icon container.
- top: 0.125em;
+ top: 0.18em;
position: relative;
}
.icon-centered {
diff --git a/src/app/shared/components/text-input-modal/text-input-modal.component.html b/src/app/shared/components/text-input-modal/text-input-modal.component.html
index 2f8616bbd0b5424b29a2c683f4ec416811c74b6f..94af213604dc99b52a56d34847eb2ced97121867 100644
--- a/src/app/shared/components/text-input-modal/text-input-modal.component.html
+++ b/src/app/shared/components/text-input-modal/text-input-modal.component.html
@@ -5,14 +5,14 @@
<p>{{ content }}</p>
<textarea #myText id="story" class="textarea" name="story" rows="6" placeholder="{{ placeholder }}"></textarea>
<div class="footerModal">
- <app-button
- [text]="'Annuler'"
- [style]="buttonTypeEnum.modalSecondary"
+ <app-v3-button
+ [style]="buttonTypeEnumV3.Secondary"
+ [label]="'Annuler'"
(action)="closeModal(false, myText.value)"
/>
- <app-button
- [text]="'Confirmer'"
- [style]="buttonTypeEnum.modalPrimary"
+ <app-v3-button
+ [style]="buttonTypeEnumV3.Primary"
+ [label]="'Confirmer'"
(action)="closeModal(true, myText.value)"
/>
</div>
diff --git a/src/app/shared/components/text-input-modal/text-input-modal.component.ts b/src/app/shared/components/text-input-modal/text-input-modal.component.ts
index 9762e32b281b6072702b8ce77960a91888750c6b..0976700335e2435a48e9398466379d066db7eae6 100644
--- a/src/app/shared/components/text-input-modal/text-input-modal.component.ts
+++ b/src/app/shared/components/text-input-modal/text-input-modal.component.ts
@@ -1,5 +1,5 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { ButtonType } from '../button/buttonType.enum';
+import { ButtonTypeV3 } from '../v3/button/button-type.enum';
@Component({
selector: 'app-text-input-modal',
@@ -12,7 +12,7 @@ export class TextInputModalComponent {
@Input() public placeholder: string;
@Output() closed = new EventEmitter<{ content: string; shouldSend: boolean }>();
@Output() newContent = new EventEmitter<{ content: string; shouldSend: boolean }>();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public myContent: string;
public closeModal(shouldSend: boolean, content: string): void {
diff --git a/src/app/shared/components/v3/button/Button.stories.ts b/src/app/shared/components/v3/button/Button.stories.ts
index 98997ab35dfc78726e00ad53259332ba0b57808b..1fdef4e07fd87715ce4988d47d8087a191d00f65 100644
--- a/src/app/shared/components/v3/button/Button.stories.ts
+++ b/src/app/shared/components/v3/button/Button.stories.ts
@@ -2,8 +2,8 @@ import { CommonModule } from '@angular/common';
import type { Meta, StoryObj } from '@storybook/angular';
import { moduleMetadata } from '@storybook/angular';
import { SvgIconComponent } from '../../svg-icon/svg-icon.component';
+import { ButtonTypeV3 } from './button-type.enum';
import { ButtonV3Component } from './button.component';
-import { ButtonTypeV3 } from './button.type';
// More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction
const meta: Meta<ButtonV3Component> = {
@@ -90,6 +90,13 @@ export const Secondary: Story = {
},
};
+export const SecondaryDelete: Story = {
+ args: {
+ label: 'SecondaryDelete button',
+ variant: ButtonTypeV3.SecondaryDelete,
+ },
+};
+
export const Tertiary: Story = {
args: {
label: 'Tertiary button',
diff --git a/src/app/shared/components/v3/button/button.type.ts b/src/app/shared/components/v3/button/button-type.enum.ts
similarity index 86%
rename from src/app/shared/components/v3/button/button.type.ts
rename to src/app/shared/components/v3/button/button-type.enum.ts
index f18f612f609185b6f21ddce4ebd6b93859981ab3..9af8ad7cc9edd01d284860209e77a6d191c3eda9 100644
--- a/src/app/shared/components/v3/button/button.type.ts
+++ b/src/app/shared/components/v3/button/button-type.enum.ts
@@ -5,5 +5,6 @@ export enum ButtonTypeV3 {
PrimaryWarning = 'primaryWarning',
PrimarySuccess = 'primarySuccess',
Secondary = 'secondary',
+ SecondaryDelete = 'secondaryDelete',
Tertiary = 'tertiary',
}
diff --git a/src/app/shared/components/v3/button/button.component.html b/src/app/shared/components/v3/button/button.component.html
index 25c1228668e4b29a642ee5f368251c07362c3dc0..ca37ddecd6b751764de09577de639339230b30b7 100644
--- a/src/app/shared/components/v3/button/button.component.html
+++ b/src/app/shared/components/v3/button/button.component.html
@@ -1,4 +1,9 @@
-<button [type]="type" [ngClass]="classes" [disabled]="disabled" (click)="action.emit($event)">
+<button
+ [type]="type"
+ [ngClass]="classes"
+ [disabled]="disabled"
+ (click)="action.emit($event)">
+
<app-svg-icon
*ngIf="iconName && iconPosition === 'left'"
[type]="iconFolder"
@@ -14,4 +19,5 @@
[iconColor]="'currentColor'"
[iconClass]="'icon-20'"
/>
+
</button>
diff --git a/src/app/shared/components/v3/button/button.component.scss b/src/app/shared/components/v3/button/button.component.scss
index 9e4b2aba50c522ca9e12c600025254615801fd33..3b91352a4ec45c3742381a14705914ae8c3ede60 100644
--- a/src/app/shared/components/v3/button/button.component.scss
+++ b/src/app/shared/components/v3/button/button.component.scss
@@ -123,6 +123,23 @@ button {
}
}
+ &.secondaryDelete {
+ background-color: $white;
+ color: $red;
+ border-color: $red;
+ &:hover {
+ background-color: $grey-3-15;
+ }
+ &:disabled {
+ background-color: $white;
+ color: $grey-5;
+ border-color: $grey-5;
+ }
+ &:active {
+ background-color: $grey-3-20;
+ }
+ }
+
&.tertiary {
background-color: $white;
color: $grey-1;
diff --git a/src/app/shared/components/v3/button/button.component.ts b/src/app/shared/components/v3/button/button.component.ts
index a5c26cec4c3d64029f6b0e65546ca2386094b2c9..26f087ef4eb85b093dedc51adc2784915f7bdb69 100644
--- a/src/app/shared/components/v3/button/button.component.ts
+++ b/src/app/shared/components/v3/button/button.component.ts
@@ -1,5 +1,5 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { ButtonTypeV3 } from './button.type';
+import { ButtonTypeV3 } from './button-type.enum';
@Component({
selector: 'app-v3-button',
@@ -17,7 +17,7 @@ export class ButtonV3Component {
@Input() variant?: ButtonTypeV3 = ButtonTypeV3.Primary;
/** Affects the height of the button */
- @Input() size?: 'small' | 'medium' | 'large' = 'small';
+ @Input() size?: 'small' | 'medium' | 'large' = 'medium';
/** Should the button be wide ? (250px) */
@Input() wide = false;
diff --git a/src/app/shared/components/v3/button/icon-button/IconButton.stories.ts b/src/app/shared/components/v3/button/icon-button/IconButton.stories.ts
index e84392a867bbcf9a6864c0fbb8c027b7b7a8dfa9..b77ac3f1dd7e3e173d1d570a4fde2f1d8b50e133 100644
--- a/src/app/shared/components/v3/button/icon-button/IconButton.stories.ts
+++ b/src/app/shared/components/v3/button/icon-button/IconButton.stories.ts
@@ -2,7 +2,7 @@ import { CommonModule } from '@angular/common';
import type { Meta, StoryObj } from '@storybook/angular';
import { moduleMetadata } from '@storybook/angular';
import { SvgIconComponent } from '../../../svg-icon/svg-icon.component';
-import { ButtonTypeV3 } from '../button.type';
+import { ButtonTypeV3 } from '../button-type.enum';
import { IconButtonV3Component } from './icon-button.component';
// More on how to set up stories at: https://storybook.js.org/docs/angular/writing-stories/introduction
diff --git a/src/app/shared/components/v3/button/icon-button/icon-button.component.ts b/src/app/shared/components/v3/button/icon-button/icon-button.component.ts
index 534b80a702c56515ad57a99c749146fc150f6ba0..e2e565ce975832c53f5cf1c573a21bb30335637d 100644
--- a/src/app/shared/components/v3/button/icon-button/icon-button.component.ts
+++ b/src/app/shared/components/v3/button/icon-button/icon-button.component.ts
@@ -1,5 +1,5 @@
import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { ButtonTypeV3 } from '../button.type';
+import { ButtonTypeV3 } from '../button-type.enum';
@Component({
selector: 'app-v3-icon-button',
diff --git a/src/app/shared/components/v3/search-bar/search-bar.component.ts b/src/app/shared/components/v3/search-bar/search-bar.component.ts
index fe60fb85f5def9565e50cfb550428653d0a34ce9..e5ec136355f148a70f070f7a10ad3ec4edaf472a 100644
--- a/src/app/shared/components/v3/search-bar/search-bar.component.ts
+++ b/src/app/shared/components/v3/search-bar/search-bar.component.ts
@@ -1,5 +1,5 @@
import { Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';
-import { ButtonTypeV3 } from '../button/button.type';
+import { ButtonTypeV3 } from '../button/button-type.enum';
@Component({
selector: 'app-v3-search-bar',
diff --git a/src/app/structure-list/components/card/card.component.html b/src/app/structure-list/components/card/card.component.html
index 3a22d67a8b9aa8be6155ceeaa5764871091ec27b..999ef4475e323530a2da5c6b7c99b82735e92830 100644
--- a/src/app/structure-list/components/card/card.component.html
+++ b/src/app/structure-list/components/card/card.component.html
@@ -68,28 +68,18 @@
</div>
</div>
<div *ngIf="isOrientation && isOrientationRdv" class="actions right">
- <app-button
- tabindex="0"
- fxLayout="row"
- fxLayoutGap="6px"
- class="hide-on-mobile rdv-button"
- [style]="buttonTypeEnum.modalPrimary"
- [type]="'form'"
- [text]="'Demander RDV'"
- [iconBtn]="'appointement'"
- [iconPos]="'left'"
+ <app-v3-button
+ class="hide-on-mobile"
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Prendre RDV'"
+ [iconName]="'appointmentV3'"
(click)="cardRDV(); $event.stopPropagation()"
- (keyup.enter)="cardRDV(); $event.stopPropagation()"
/>
- <app-button
- tabindex="0"
+ <app-v3-icon-button
class="hide-on-desktop"
- [style]="buttonTypeEnum.modalPrimary"
- [type]="'form'"
- [text]=""
- [iconBtn]="'appointement'"
+ [variant]="buttonTypeEnumV3.Primary"
+ [iconName]="'appointmentV3'"
(click)="cardRDV(); $event.stopPropagation()"
- (keyup.enter)="cardRDV(); $event.stopPropagation()"
/>
</div>
</div>
diff --git a/src/app/structure-list/components/card/card.component.scss b/src/app/structure-list/components/card/card.component.scss
index d4e39485817a7194d31e7f56738aa6aa4e897806..2bc74812c4004425cfaabf1b63f6d8f6e84b6190 100644
--- a/src/app/structure-list/components/card/card.component.scss
+++ b/src/app/structure-list/components/card/card.component.scss
@@ -64,10 +64,6 @@
border-radius: 20px;
}
-.rdv-button ::ng-deep app-svg-icon {
- padding: 6px 8px 0 0;
-}
-
.selected {
border: solid 1px $grey-5;
background-color: $white;
diff --git a/src/app/structure-list/components/card/card.component.ts b/src/app/structure-list/components/card/card.component.ts
index 572334c59cb596d0d95359f7d369f94a659448de..2e2ee824a00b349fde3ce069f20654220c3aa620 100644
--- a/src/app/structure-list/components/card/card.component.ts
+++ b/src/app/structure-list/components/card/card.component.ts
@@ -2,7 +2,7 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { Structure } from '../../../models/structure.model';
import { ProfileService } from '../../../profile/services/profile.service';
-import { ButtonType } from '../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../shared/components/v3/button/button-type.enum';
@Component({
selector: 'app-card',
@@ -20,7 +20,7 @@ export class CardComponent {
@Output() public addToList: EventEmitter<Structure> = new EventEmitter<Structure>();
@Output() public selectRDV: EventEmitter<Structure> = new EventEmitter<Structure>();
@Output() public hover: EventEmitter<Structure> = new EventEmitter<Structure>();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
constructor(private route: ActivatedRoute, private router: Router, public profileService: ProfileService) {}
diff --git a/src/app/structure-list/components/more-filters/more-filters.component.html b/src/app/structure-list/components/more-filters/more-filters.component.html
index 60119e63805bee83287d5a40e55044f23eee9b24..d93af4881982aa46a8e8f687cd5a3a97b67e552f 100644
--- a/src/app/structure-list/components/more-filters/more-filters.component.html
+++ b/src/app/structure-list/components/more-filters/more-filters.component.html
@@ -79,18 +79,9 @@
</ul>
</div>
</div>
- <div
- class="footer"
- fxLayout="row"
- fxLayoutAlign="center center"
- [ngClass]="{ backDropModalFooter: getModalType() === 'moreFilters' }"
- >
- <div class="half-width">
- <app-button [style]="buttonTypeEnum.modalSecondary" [text]="'Effacer'" (click)="clearFilters()" />
- </div>
- <div class="half-width">
- <app-button [style]="buttonTypeEnum.modalPrimary" [text]="'Appliquer'" (click)="emitModules(checkedModules)" />
- </div>
+ <div class="footer">
+ <app-v3-button [variant]="buttonTypeEnumV3.Secondary" [label]="'Effacer'" (click)="clearFilters()" />
+ <app-v3-button [variant]="buttonTypeEnumV3.Primary" [label]="'Appliquer'" (click)="emitModules(checkedModules)" />
</div>
</div>
</div>
diff --git a/src/app/structure-list/components/more-filters/more-filters.component.scss b/src/app/structure-list/components/more-filters/more-filters.component.scss
index 95dabc4b5467fb8ec69e3b58dc6f3f03f2238ce0..65028123664aecc25e1305f5d87d95d31197c5a9 100644
--- a/src/app/structure-list/components/more-filters/more-filters.component.scss
+++ b/src/app/structure-list/components/more-filters/more-filters.component.scss
@@ -92,13 +92,6 @@
.moreFilters {
margin-bottom: 0;
}
- .backDropModalFooter {
- background: white;
- width: 360px;
- margin: auto;
- border-radius: 0 0 8px 8px;
- margin-top: 0;
- }
.headerMoreFilters {
position: relative;
text-align: center;
@@ -117,12 +110,16 @@
top: 7px;
}
}
- .footer {
- @media #{$tablet} {
- display: flex !important;
- }
- }
}
+.footer {
+ background: white;
+ display: flex;
+ justify-content: center;
+ gap: 12px;
+ border-radius: 0 0 8px 8px;
+ margin-top: 0;
+}
+
::ng-deep .headerMoreFilters svg {
width: 40px !important;
height: 40px !important;
diff --git a/src/app/structure-list/components/more-filters/more-filters.component.ts b/src/app/structure-list/components/more-filters/more-filters.component.ts
index 266a03570f569a63d6ce09c5c2a8bb83b0e549eb..4527236df4a3046e6626f953cbfbf977733a1cc5 100644
--- a/src/app/structure-list/components/more-filters/more-filters.component.ts
+++ b/src/app/structure-list/components/more-filters/more-filters.component.ts
@@ -1,5 +1,5 @@
import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
-import { ButtonType } from '../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../shared/components/v3/button/button-type.enum';
import { CategoryEnum } from '../../../shared/enum/category.enum';
import { TypeModal } from '../../enum/typeModal.enum';
import { Category } from '../../models/category.model';
@@ -20,7 +20,7 @@ export class MoreFiltersComponent implements OnInit, OnChanges {
@Input() public modules: Module[] = [];
@Output() searchEvent = new EventEmitter();
@Output() closeEvent = new EventEmitter();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public categoryEnum = CategoryEnum;
// Checkbox variable
diff --git a/src/app/structure-list/components/structure-list-search/structure-list-search.component.html b/src/app/structure-list/components/structure-list-search/structure-list-search.component.html
index fc37213d9cbab4d7762c5bd39279f75fddd4f020..01641608c815d42ec387c7f7dd87331d120f8571 100644
--- a/src/app/structure-list/components/structure-list-search/structure-list-search.component.html
+++ b/src/app/structure-list/components/structure-list-search/structure-list-search.component.html
@@ -101,10 +101,10 @@
<div class="label pass">Accès libre</div>
</label>
</div>
- <app-button
+ <app-v3-button
class="last-button"
- [style]="buttonTypeEnum.TertiaryRounded"
- [text]="'Plus de filtres'"
+ [variant]="buttonTypeEnumV3.Tertiary"
+ [label]="'Plus de filtres'"
(action)="openModal(TypeModal.moreFilters)"
/>
<div *ngIf="modalTypeOpened">
diff --git a/src/app/structure-list/components/structure-list-search/structure-list-search.component.ts b/src/app/structure-list/components/structure-list-search/structure-list-search.component.ts
index bb6f7ce26719b5cd9bfd574314b8f63743a1d508..0682c16f9f2ec8571a1b1fb8551bc003021ac6bd 100644
--- a/src/app/structure-list/components/structure-list-search/structure-list-search.component.ts
+++ b/src/app/structure-list/components/structure-list-search/structure-list-search.component.ts
@@ -1,6 +1,7 @@
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { ButtonType } from '../../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../../shared/components/v3/button/button-type.enum';
import { Utils } from '../../../utils/utils';
import { Theme } from '../../enum/themes.enum';
import { TypeModal } from '../../enum/typeModal.enum';
@@ -20,6 +21,7 @@ export class StructureListSearchComponent implements OnInit {
public utils = new Utils();
// Show/hide form createStructure
public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public searchInput = '';
public modalTypeOpened: TypeModal;
diff --git a/src/app/structure-list/structure-list.component.html b/src/app/structure-list/structure-list.component.html
index 236b25601868adf1501a6abd775c844f3677cf0b..9cd9e751b9079b8fc5a64e1dd5730c3b7888b1be 100644
--- a/src/app/structure-list/structure-list.component.html
+++ b/src/app/structure-list/structure-list.component.html
@@ -6,18 +6,18 @@
<ng-template ngPluralCase="other">{{ structureList.length }} structures</ng-template>
</div>
<ng-container *ngIf="!isOrientation">
- <app-button
- [text]="'Imprimer la liste'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'small-text'"
- (action)="print()"
- />
- <app-button
- [text]="'Ajouter une structure'"
- [style]="buttonTypeEnum.Secondary"
- [extraClass]="'small-text'"
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Ajouter une structure'"
+ [size]="'small'"
(action)="addStructure()"
/>
+ <app-v3-button
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Imprimer la liste'"
+ [size]="'small'"
+ (action)="print()"
+ />
</ng-container>
</div>
diff --git a/src/app/structure-list/structure-list.component.ts b/src/app/structure-list/structure-list.component.ts
index 2f08ac14cbbb3010e58f6d18c166be001b6f7719..b88a8b611de525216d1bc03f65356eee2da1b930 100644
--- a/src/app/structure-list/structure-list.component.ts
+++ b/src/app/structure-list/structure-list.component.ts
@@ -4,7 +4,7 @@ import { GeoJson } from '../map/models/geojson.model';
import { Structure } from '../models/structure.model';
import { AuthService } from '../services/auth.service';
import { StructureService } from '../services/structure.service';
-import { ButtonType } from '../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../shared/components/v3/button/button-type.enum';
import { PrintService } from '../shared/service/print.service';
@Component({
@@ -25,7 +25,7 @@ export class StructureListComponent implements OnChanges, OnInit {
@Output() public structureSelected: EventEmitter<Structure[]> = new EventEmitter<Structure[]>();
@Output() public structureRDVSelected: EventEmitter<Structure> = new EventEmitter<Structure>();
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public structure: Structure;
public printMode = false;
diff --git a/src/app/structure/structure-exclude/structure-exclude.component.html b/src/app/structure/structure-exclude/structure-exclude.component.html
index d8c0403a6343b26801993071803b6afc7715a439..9ceb7dd43c28cfacdcfcbf44b3e6ee1559690829 100644
--- a/src/app/structure/structure-exclude/structure-exclude.component.html
+++ b/src/app/structure/structure-exclude/structure-exclude.component.html
@@ -15,19 +15,19 @@
<p *ngIf="!alreadyExcluded">Souhaitez-vous exclure {{ newMemberName }} de {{ structure.structureName }}</p>
<p *ngIf="alreadyExcluded">{{ newMemberName }} a déjà été exclu par un membre de {{ structure.structureName }}</p>
<div class="footerModal" fxLayout="row" fxLayoutAlign="space-around center" fxLayoutGap="8px">
- <app-button
+ <app-v3-button
*ngIf="!alreadyExcluded"
- [text]="'Non'"
- [style]="buttonTypeEnum.modalSecondary"
+ [variant]="buttonTypeEnumV3.Secondary"
+ [label]="'Non'"
(action)="close()"
/>
- <app-button
+ <app-v3-button
*ngIf="!alreadyExcluded"
- [text]="'Exclure'"
- [style]="buttonTypeEnum.modalPrimary"
+ [variant]="buttonTypeEnumV3.Primary"
+ [label]="'Exclure'"
(action)="exclude()"
/>
- <app-button *ngIf="alreadyExcluded" [text]="'OK'" [style]="buttonTypeEnum.modalPrimary" (action)="close()" />
+ <app-v3-button *ngIf="alreadyExcluded" [variant]="buttonTypeEnumV3.Primary" [label]="'OK'" (action)="close()" />
</div>
</div>
</div>
diff --git a/src/app/structure/structure-exclude/structure-exclude.component.scss b/src/app/structure/structure-exclude/structure-exclude.component.scss
index 1964b4ead9a0f9e2f04a095dabd19726e956b9ed..edff1f02bab35d3d3fa73d6e71826ba574f818b9 100644
--- a/src/app/structure/structure-exclude/structure-exclude.component.scss
+++ b/src/app/structure/structure-exclude/structure-exclude.component.scss
@@ -31,9 +31,6 @@
}
.footerModal {
gap: 8px;
- app-button {
- flex: 1;
- }
}
img {
margin-top: 8px;
diff --git a/src/app/structure/structure-exclude/structure-exclude.component.ts b/src/app/structure/structure-exclude/structure-exclude.component.ts
index a1d18fd288c80849f0150f1a37c4a0dc580e3b6b..f6581a8843025a7aec5d18dbecf95f6c671b8e5f 100644
--- a/src/app/structure/structure-exclude/structure-exclude.component.ts
+++ b/src/app/structure/structure-exclude/structure-exclude.component.ts
@@ -4,7 +4,7 @@ import { Structure } from '../../models/structure.model';
import { NotificationService } from '../../services/notification.service';
import { StructureService } from '../../services/structure.service';
import { UserService } from '../../services/user.service';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
@Component({
selector: 'app-structure-exclude',
@@ -21,7 +21,7 @@ export class StructureExcludeComponent implements OnInit {
) {}
public alreadyExcluded = false;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public newMemberName: string;
public structure: Structure;
private structureId: string;
diff --git a/src/app/structure/structure-join/structure-join.component.html b/src/app/structure/structure-join/structure-join.component.html
index 83f37e57db7dce67b45181f8c9addc2f73c9150f..ad17cf794a0d9dbeda6d44450e8a1b8f13f34f59 100644
--- a/src/app/structure/structure-join/structure-join.component.html
+++ b/src/app/structure/structure-join/structure-join.component.html
@@ -10,7 +10,7 @@
/>
</div>
<div class="button">
- <app-button [style]="buttonTypeEnum.Primary" [text]="'Ok'" (action)="handleFinish()" />
+ <app-v3-button [variant]="buttonTypeEnumV3.Primary" [label]="'Ok'" [wide]="true" (action)="handleFinish()" />
</div>
</div>
</ng-container>
@@ -53,7 +53,7 @@
</div>
</div>
<div class="button">
- <app-button [style]="buttonTypeEnum.Primary" [text]="'Ok'" (action)="handleCallback()" />
+ <app-v3-button [variant]="buttonTypeEnumV3.Primary" [label]="'Ok'" [wide]="true" (action)="handleCallback()" />
</div>
</div>
</ng-container>
diff --git a/src/app/structure/structure-join/structure-join.component.ts b/src/app/structure/structure-join/structure-join.component.ts
index 50170699c184ac6639b51279522d6d7b20b230b6..cce56d3abfbfc0c1712904f96711e70b1e0b5f31 100644
--- a/src/app/structure/structure-join/structure-join.component.ts
+++ b/src/app/structure/structure-join/structure-join.component.ts
@@ -4,9 +4,9 @@ import { formType } from '../../form/form-view/formType.enum';
import { structureFormStep } from '../../form/form-view/structure-form/structureFormStep.enum';
import { Structure } from '../../models/structure.model';
import { RouterListenerService } from '../../services/routerListener.service';
-import { ButtonType } from '../../shared/components/button/buttonType.enum';
-import { JoinErrors } from '../enums/joinErrors.enum';
import { UserService } from '../../services/user.service';
+import { ButtonTypeV3 } from '../../shared/components/v3/button/button-type.enum';
+import { JoinErrors } from '../enums/joinErrors.enum';
@Component({
selector: 'app-structure-join',
templateUrl: './structure-join.component.html',
@@ -17,7 +17,7 @@ export class StructureJoinComponent implements OnInit {
public isClaimed: boolean = null;
public structureFormStepEnum = structureFormStep;
public formTypeEnum = formType;
- public buttonTypeEnum = ButtonType;
+ public buttonTypeEnumV3 = ButtonTypeV3;
public structure: Structure;
public isStructureJoinValidated = null;
public validationToken = null;
diff --git a/src/assets/form/sprite.svg b/src/assets/form/sprite.svg
index 01b72a7381b9ca0df6a8e404a7c3d800f6ee272b..6cb05c11f59ff14161ebbfb078efa35a3e4da3b0 100644
--- a/src/assets/form/sprite.svg
+++ b/src/assets/form/sprite.svg
@@ -1024,6 +1024,12 @@
fill="#FF7100" />
</symbol>
+ <svg id="eyeV3" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <path
+ d="M10.0002 3.75C5.8335 3.75 2.27516 6.34167 0.833496 10C2.27516 13.6583 5.8335 16.25 10.0002 16.25C14.1668 16.25 17.7252 13.6583 19.1668 10C17.7252 6.34167 14.1668 3.75 10.0002 3.75ZM10.0002 14.1667C7.70016 14.1667 5.8335 12.3 5.8335 10C5.8335 7.7 7.70016 5.83333 10.0002 5.83333C12.3002 5.83333 14.1668 7.7 14.1668 10C14.1668 12.3 12.3002 14.1667 10.0002 14.1667ZM10.0002 7.5C8.61683 7.5 7.50016 8.61667 7.50016 10C7.50016 11.3833 8.61683 12.5 10.0002 12.5C11.3835 12.5 12.5002 11.3833 12.5002 10C12.5002 8.61667 11.3835 7.5 10.0002 7.5Z"
+ fill="#333333" />
+ </svg>
+
<symbol id="aidantsConnect" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="40" height="40" rx="20" fill="#FFE5E4" />
<path
@@ -1296,4 +1302,5 @@
d="M5.68104 29.103C5.23919 29.103 4.89359 28.7312 4.89359 28.2893V12.2822C4.89359 11.5822 5.37043 11.0923 6.04852 11.0923C6.80972 11.0923 7.38281 11.6522 7.38281 12.3959V16.2369H8.14402V12.3916C8.14402 11.9235 8.22276 11.7047 8.48087 11.4554C8.73461 11.2148 9.07146 11.0835 9.42581 11.0835C10.1301 11.0835 10.6639 11.6479 10.6639 12.3916V16.2369H11.4163V12.3259C11.4163 11.2629 10.4889 10.3311 9.43456 10.3311C8.91835 10.3311 8.37588 10.5585 7.9909 10.9348C7.89028 11.031 7.82029 11.1141 7.75029 11.2235C7.69342 11.1448 7.63655 11.0791 7.5578 10.996L7.54905 10.9873C7.36094 10.8079 7.15095 10.6548 6.94096 10.5454L6.93222 10.541C6.66973 10.4229 6.37662 10.3617 6.07039 10.3617C4.97233 10.3617 4.14551 11.241 4.14551 12.4091V21.7272V28.2981C4.14551 29.1468 4.83672 29.8424 5.68979 29.8424H11.4163V29.1118L5.68104 29.103Z"
fill="#A50F0E" />
</symbol>
+
</svg>
\ No newline at end of file
diff --git a/src/assets/ico/arrowBack.svg b/src/assets/ico/arrowBack.svg
index 2fc7c8670f5fa75cc0215adb5fddada7ba6ab3ac..60282a83ce1c5969b0a33f0177c964a4dba8b89d 100644
--- a/src/assets/ico/arrowBack.svg
+++ b/src/assets/ico/arrowBack.svg
@@ -1,4 +1,5 @@
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M20 11L11 20L20 29" stroke="black" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
-<line x1="12.5679" y1="20.0684" x2="29.8861" y2="20.0684" stroke="black" stroke-width="1.5" stroke-linecap="round"/>
-</svg>
+ <path d="M20 11L11 20L20 29" stroke="black" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round"
+ stroke-linejoin="round" />
+ <line x1="12.5679" y1="20.0684" x2="29.8861" y2="20.0684" stroke="black" stroke-width="1.5" stroke-linecap="round" />
+</svg>
\ No newline at end of file
diff --git a/src/assets/ico/sprite.svg b/src/assets/ico/sprite.svg
index d7f79f954c258108c0fbb971ff3a24c9fe6cc291..0591e89aba9b6eb912105b2b4d6fbf69f5a15238 100644
--- a/src/assets/ico/sprite.svg
+++ b/src/assets/ico/sprite.svg
@@ -1723,7 +1723,7 @@
fill="#333333" />
</symbol>
- <symbol id="arrowBack" width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <symbol id="arrowBack" width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M20 11L11 20L20 29" stroke="black" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round"
stroke-linejoin="round" />
<line x1="12.5679" y1="20.0684" x2="29.8861" y2="20.0684" stroke="black" stroke-width="1.5"
@@ -2715,6 +2715,60 @@
fill="white" />
</symbol>
+ <symbol id="arrowBackV3" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <path id="Vector"
+ d="M15.8332 9.1666H6.5249L10.5916 5.09993C10.9166 4.77494 10.9166 4.2416 10.5916 3.9166C10.2666 3.5916 9.74157 3.5916 9.41657 3.9166L3.9249 9.40827C3.5999 9.73327 3.5999 10.2583 3.9249 10.5833L9.41657 16.0749C9.74157 16.3999 10.2666 16.3999 10.5916 16.0749C10.9166 15.7499 10.9166 15.2249 10.5916 14.8999L6.5249 10.8333H15.8332C16.2916 10.8333 16.6666 10.4583 16.6666 9.99994C16.6666 9.5416 16.2916 9.1666 15.8332 9.1666Z"
+ fill="currentColor" />
+ </symbol>
+
+ <symbol id="arrowForwardV3" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <path
+ d="M4.66683 10.8342H13.9752L9.9085 14.9009C9.5835 15.2259 9.5835 15.7592 9.9085 16.0842C10.2335 16.4092 10.7585 16.4092 11.0835 16.0842L16.5752 10.5926C16.9002 10.2676 16.9002 9.74258 16.5752 9.41758L11.0918 3.91758C10.7668 3.59258 10.2418 3.59258 9.91683 3.91758C9.59183 4.24258 9.59183 4.76758 9.91683 5.09258L13.9752 9.16758H4.66683C4.2085 9.16758 3.8335 9.54258 3.8335 10.0009C3.8335 10.4592 4.2085 10.8342 4.66683 10.8342Z"
+ fill="currentColor" />
+ </symbol>
+
+ <symbol id="refreshV3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none">
+ <path
+ d="M15.2086 5.29158C13.8502 3.93325 11.9252 3.14991 9.80855 3.36658C6.75022 3.67491 4.23355 6.15825 3.89189 9.21658C3.43355 13.2582 6.55855 16.6666 10.5002 16.6666C13.1586 16.6666 15.4419 15.1082 16.5086 12.8666C16.7752 12.3082 16.3752 11.6666 15.7586 11.6666C15.4502 11.6666 15.1586 11.8332 15.0252 12.1082C14.0836 14.1332 11.8252 15.4166 9.35855 14.8666C7.50855 14.4582 6.01689 12.9499 5.62522 11.0999C4.92522 7.86658 7.38355 4.99991 10.5002 4.99991C11.8836 4.99991 13.1169 5.57491 14.0169 6.48325L12.7586 7.74158C12.2336 8.26658 12.6002 9.16658 13.3419 9.16658H16.3336C16.7919 9.16658 17.1669 8.79158 17.1669 8.33325V5.34158C17.1669 4.59991 16.2669 4.22491 15.7419 4.74991L15.2086 5.29158Z"
+ fill="currentColor" />
+ </symbol>
+
+ <symbol id="addV3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none">
+ <path
+ d="M10.5002 5.83325C10.0418 5.83325 9.66683 6.20825 9.66683 6.66659V9.16659H7.16683C6.7085 9.16659 6.3335 9.54159 6.3335 9.99992C6.3335 10.4583 6.7085 10.8333 7.16683 10.8333H9.66683V13.3333C9.66683 13.7916 10.0418 14.1666 10.5002 14.1666C10.9585 14.1666 11.3335 13.7916 11.3335 13.3333V10.8333H13.8335C14.2918 10.8333 14.6668 10.4583 14.6668 9.99992C14.6668 9.54159 14.2918 9.16659 13.8335 9.16659H11.3335V6.66659C11.3335 6.20825 10.9585 5.83325 10.5002 5.83325Z"
+ fill="currentColor" />
+ </symbol>
+
+ <symbol id="editV3" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <path
+ d="M3 14.5501V17.0835C3 17.3168 3.18333 17.5001 3.41667 17.5001H5.95C6.05833 17.5001 6.16667 17.4585 6.24167 17.3751L15.3417 8.28346L12.2167 5.15846L3.125 14.2501C3.04167 14.3335 3 14.4335 3 14.5501ZM17.7583 5.8668C18.0833 5.5418 18.0833 5.0168 17.7583 4.6918L15.8083 2.7418C15.4833 2.4168 14.9583 2.4168 14.6333 2.7418L13.1083 4.2668L16.2333 7.3918L17.7583 5.8668Z"
+ fill="currentColor" />
+ </symbol>
+
+ <symbol id="deleteV3" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none">
+ <path
+ d="M5.49984 15.8333C5.49984 16.75 6.24984 17.5 7.1665 17.5H13.8332C14.7498 17.5 15.4998 16.75 15.4998 15.8333V7.5C15.4998 6.58333 14.7498 5.83333 13.8332 5.83333H7.1665C6.24984 5.83333 5.49984 6.58333 5.49984 7.5V15.8333ZM15.4998 3.33333H13.4165L12.8248 2.74167C12.6748 2.59167 12.4582 2.5 12.2415 2.5H8.75817C8.5415 2.5 8.32484 2.59167 8.17484 2.74167L7.58317 3.33333H5.49984C5.0415 3.33333 4.6665 3.70833 4.6665 4.16667C4.6665 4.625 5.0415 5 5.49984 5H15.4998C15.9582 5 16.3332 4.625 16.3332 4.16667C16.3332 3.70833 15.9582 3.33333 15.4998 3.33333Z"
+ fill="currentColor" />
+ </symbol>
+
+ <symbol id="emailV3" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <path
+ d="M17.1667 3.33301H3.83341C2.91675 3.33301 2.16675 4.08301 2.16675 4.99967V14.9997C2.16675 15.9163 2.91675 16.6663 3.83341 16.6663H17.1667C18.0834 16.6663 18.8334 15.9163 18.8334 14.9997V4.99967C18.8334 4.08301 18.0834 3.33301 17.1667 3.33301ZM16.8334 6.87467L11.3834 10.283C10.8417 10.6247 10.1584 10.6247 9.61675 10.283L4.16675 6.87467C3.95841 6.74134 3.83341 6.51634 3.83341 6.27467C3.83341 5.71634 4.44175 5.38301 4.91675 5.67467L10.5001 9.16634L16.0834 5.67467C16.5584 5.38301 17.1667 5.71634 17.1667 6.27467C17.1667 6.51634 17.0417 6.74134 16.8334 6.87467Z"
+ fill="currentColor" />
+ </symbol>
+
+ <symbol id="lockV3" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <path
+ d="M15.4999 6.66634H14.6666V4.99967C14.6666 2.69967 12.7999 0.833008 10.4999 0.833008C8.19992 0.833008 6.33325 2.69967 6.33325 4.99967V6.66634H5.49992C4.58325 6.66634 3.83325 7.41634 3.83325 8.33301V16.6663C3.83325 17.583 4.58325 18.333 5.49992 18.333H15.4999C16.4166 18.333 17.1666 17.583 17.1666 16.6663V8.33301C17.1666 7.41634 16.4166 6.66634 15.4999 6.66634ZM10.4999 14.1663C9.58325 14.1663 8.83325 13.4163 8.83325 12.4997C8.83325 11.583 9.58325 10.833 10.4999 10.833C11.4166 10.833 12.1666 11.583 12.1666 12.4997C12.1666 13.4163 11.4166 14.1663 10.4999 14.1663ZM7.99992 6.66634V4.99967C7.99992 3.61634 9.11659 2.49967 10.4999 2.49967C11.8833 2.49967 12.9999 3.61634 12.9999 4.99967V6.66634H7.99992Z"
+ fill="currentColor" />
+ </symbol>
+
+ <symbol id="appointmentV3" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <path
+ d="M15.8333 3.33366H15V2.50033C15 2.04199 14.625 1.66699 14.1667 1.66699C13.7083 1.66699 13.3333 2.04199 13.3333 2.50033V3.33366H6.66667V2.50033C6.66667 2.04199 6.29167 1.66699 5.83333 1.66699C5.375 1.66699 5 2.04199 5 2.50033V3.33366H4.16667C3.24167 3.33366 2.50833 4.08366 2.50833 5.00033L2.5 16.667C2.5 17.5837 3.24167 18.3337 4.16667 18.3337H15.8333C16.75 18.3337 17.5 17.5837 17.5 16.667V5.00033C17.5 4.08366 16.75 3.33366 15.8333 3.33366ZM15.8333 15.8337C15.8333 16.292 15.4583 16.667 15 16.667H5C4.54167 16.667 4.16667 16.292 4.16667 15.8337V7.50033H15.8333V15.8337ZM5.83333 9.16699H7.5V10.8337H5.83333V9.16699ZM9.16667 9.16699H10.8333V10.8337H9.16667V9.16699ZM12.5 9.16699H14.1667V10.8337H12.5V9.16699Z"
+ fill="currentColor" />
+ </symbol>
+
<symbol id="chevronRight" width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15 25.5L22.5 18L15 10.5V25.5Z" fill="#949494" />
</symbol>