diff --git a/src/app/form/form.component.ts b/src/app/form/form.component.ts
index 3e931bedada2803a234a7ab0b89ca453f05fdc6f..93ab67f337a7341b780192c3fc491270853aeb2e 100644
--- a/src/app/form/form.component.ts
+++ b/src/app/form/form.component.ts
@@ -253,13 +253,11 @@ export class FormComponent implements OnInit {
}
public onSubmitClaimWithAccount(): void {
- this.structureService
- .claimStructureWithAccount(this.structureId, this.profile.email)
- .subscribe((structuresLinked) => {
- this.profile.pendingStructuresLink = structuresLinked;
- this.profileService.setProfile(this.profile);
- this.closeEvent.emit(this.structureForm.value);
- });
+ this.structureService.claimStructureWithAccount(this.structureId, this.profile).subscribe((structuresLinked) => {
+ this.profile.pendingStructuresLink = structuresLinked;
+ this.profileService.setProfile(this.profile);
+ this.closeEvent.emit(this.structureForm.value);
+ });
}
public onSubmit(structureForm: FormGroup): void {
if (structureForm.valid) {
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
index 07dc562c9baed33d564ad86e547795464791dffc..87806a6691914bde3f5851709aecc3a8d9cf1a7a 100644
--- a/src/app/header/header.component.html
+++ b/src/app/header/header.component.html
@@ -9,7 +9,7 @@
<span class="ico-menu"></span>
</div>
<div fxLayout="row" class="right-header" fxLayoutAlign="center center" fxLayoutGap="3vw">
- <a routerLink="/home" [routerLinkActive]="'active'" i18n>Acteurs de la médiation numérique</a>
+ <a routerLink="/home" [routerLinkActive]="'active'" i18n>Les acteurs</a>
<!-- <a routerLink="/resources" [routerLinkActive]="'active'" i18n>Ressources</a>
<a routerLink="/projects" [routerLinkActive]="'active'" i18n>Projets</a> -->
<a routerLink="/about" [routerLinkActive]="'active'" i18n>Qui sommes-nous ?</a>
diff --git a/src/app/menu-phone/menu-phone.component.html b/src/app/menu-phone/menu-phone.component.html
index 407d164c3195eb62d74fe66d3348c1a7545561c9..3551f848ef9539f082f94ec03de1efd0f8ff54d3 100644
--- a/src/app/menu-phone/menu-phone.component.html
+++ b/src/app/menu-phone/menu-phone.component.html
@@ -7,9 +7,7 @@
<div (click)="closeMenu()" class="ico-close-details"></div>
</div>
<div fxLayout="column" class="right-header" fxLayoutGap="3vw">
- <a routerLink="/home" [routerLinkActive]="'active'" (click)="closeMenu()" i18n
- >Acteurs de la médiation numérique</a
- >
+ <a routerLink="/home" [routerLinkActive]="'active'" (click)="closeMenu()" i18n>Les acteurs</a>
<!-- <a routerLink="/resources" [routerLinkActive]="'active'" i18n>Ressources</a>
<a routerLink="/projects" [routerLinkActive]="'active'" i18n>Projets</a> -->
<a routerLink="/about" [routerLinkActive]="'active'" (click)="closeMenu()" i18n>Qui sommes-nous ?</a>
diff --git a/src/app/menu-phone/menu-phone.component.scss b/src/app/menu-phone/menu-phone.component.scss
index 75987578ef5d16697f119b1c0819cf7412d23ba2..ea2eb05ce33fcdd036046833e1590bac98cf6e57 100644
--- a/src/app/menu-phone/menu-phone.component.scss
+++ b/src/app/menu-phone/menu-phone.component.scss
@@ -25,7 +25,7 @@
right: 0;
width: 100%;
height: 100%;
- z-index: $modal-menu-phone-z-index;
+ z-index: $menu-phone-z-index;
animation: slideMenu 0.5s;
.contentMenu {
background-color: $white;
diff --git a/src/app/models/structure.model.ts b/src/app/models/structure.model.ts
index b8125ec9fa6d26f3a6cdc13b188fa59d2bf07203..4a154bfaa0b46d8e0c441059ccfde8f03c0f91be 100644
--- a/src/app/models/structure.model.ts
+++ b/src/app/models/structure.model.ts
@@ -1,3 +1,4 @@
+import { Equipment } from '../structure-list/enum/equipment.enum';
import { typeStructureEnum } from '../shared/enum/typeStructure.enum';
import { Weekday } from '../structure-list/enum/weekday.enum';
import { Address } from './address.model';
@@ -111,6 +112,13 @@ export class Structure {
return false;
}
+ /**
+ * Check if a structure has pass Numeric label
+ */
+ public hasPassNumeric(): boolean {
+ return this.labelsQualifications.includes('passNumerique');
+ }
+
/**
* Return a range, according to the distance, between [1,3] to get a distance reference.
* - [0,5km] => 1
@@ -140,4 +148,38 @@ export class Structure {
public getLon(): number {
return this.coord[0];
}
+
+ public getEquipmentsIcon(equipment: Equipment): string {
+ switch (equipment) {
+ case Equipment.wifi:
+ return 'wifi';
+ case Equipment.bornes:
+ return 'borne';
+ case Equipment.printer:
+ return 'print';
+ case Equipment.tablet:
+ return 'tablet';
+ case Equipment.computer:
+ return 'computer';
+ default:
+ return null;
+ }
+ }
+
+ public getEquipmentsTitle(equipment: Equipment): string {
+ switch (equipment) {
+ case Equipment.wifi:
+ return 'Wifi';
+ case Equipment.bornes:
+ return 'Bornes';
+ case Equipment.printer:
+ return 'Imprimantes';
+ case Equipment.tablet:
+ return 'Tablettes';
+ case Equipment.computer:
+ return 'Ordinateurs';
+ default:
+ return null;
+ }
+ }
}
diff --git a/src/app/profile/services/profile.service.ts b/src/app/profile/services/profile.service.ts
index a7dd3265d18e08363fc44b14f65ee64406487087..ac04735881d4d6f03b4b2c35ef12a7b7ce3c52e2 100644
--- a/src/app/profile/services/profile.service.ts
+++ b/src/app/profile/services/profile.service.ts
@@ -4,6 +4,7 @@ import { Observable } from 'rxjs';
import { User } from '../../models/user.model';
import decode from 'jwt-decode';
import { UserRole } from '../../shared/enum/userRole.enum';
+import { AuthService } from '../../services/auth.service';
@Injectable({
providedIn: 'root',
@@ -11,7 +12,7 @@ import { UserRole } from '../../shared/enum/userRole.enum';
export class ProfileService {
private readonly baseUrl = 'api/users';
private currentProfile: User = null;
- constructor(private http: HttpClient) {}
+ constructor(private http: HttpClient, private authService: AuthService) {}
public async getProfile(): Promise<User> {
// Get profil by API only on first time
@@ -43,14 +44,15 @@ export class ProfileService {
}
public isAdmin(): boolean {
- const user = JSON.parse(localStorage.getItem('user'));
- if (user) {
+ if (this.authService.isLoggedIn()) {
+ const user = this.authService.userValue;
const token = user.accessToken;
// decode the token to get its payload
const tokenPayload: User = decode(token);
if (tokenPayload.role == UserRole.admin) {
return true;
}
+ return false;
}
return false;
}
diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts
index 4e98779cf926d18cb540833cd4a6341ed0cbff09..bb6b1f569582974b129248489f067e46d6a91371 100644
--- a/src/app/services/auth.service.ts
+++ b/src/app/services/auth.service.ts
@@ -1,5 +1,6 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
+import { Router } from '@angular/router';
import { DateTime } from 'luxon';
import { BehaviorSubject, Observable } from 'rxjs';
import { map } from 'rxjs/operators';
@@ -12,7 +13,7 @@ export class AuthService {
private userSubject: BehaviorSubject<UserAuth>;
public user: Observable<UserAuth>;
- constructor(private http: HttpClient) {
+ constructor(private http: HttpClient, private router: Router) {
this.userSubject = new BehaviorSubject<UserAuth>(JSON.parse(localStorage.getItem('user')));
this.user = this.userSubject.asObservable();
}
@@ -31,6 +32,7 @@ export class AuthService {
public logout(): void {
localStorage.removeItem('user');
this.userSubject.next(null);
+ window.location.replace('/home');
}
public isLoggedIn(): boolean {
diff --git a/src/app/services/structure.service.ts b/src/app/services/structure.service.ts
index d61ba987b088fc4bcabc98c0434425f82c503e3b..f767540dcf7e19398809830daf1d5955ebeeb11e 100644
--- a/src/app/services/structure.service.ts
+++ b/src/app/services/structure.service.ts
@@ -35,8 +35,8 @@ export class StructureService {
return this.http.post<boolean>(`${this.baseUrl}/${id}/isClaimed`, profile);
}
- public claimStructureWithAccount(id: string, email: string): Observable<string[]> {
- return this.http.post<any>(`${this.baseUrl}/${id}/claim`, { email });
+ public claimStructureWithAccount(id: string, user: User): Observable<string[]> {
+ return this.http.post<any>(`${this.baseUrl}/${id}/claim`, user);
}
public getStructure(id: string): Observable<Structure> {
diff --git a/src/app/shared/components/address-autocomplete/address-autocomplete.component.html b/src/app/shared/components/address-autocomplete/address-autocomplete.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..537de506db8e233b34cf5ccf81e12f9c98f47f9a
--- /dev/null
+++ b/src/app/shared/components/address-autocomplete/address-autocomplete.component.html
@@ -0,0 +1,17 @@
+<div class="search-bar">
+ <div>
+ <input
+ id="search-address"
+ type="text"
+ placeholder="ex: 20 rue du lac, Lyon"
+ (input)="onSearchChange($event.target.value)"
+ class="form-input"
+ #searchAddress
+ />
+ </div>
+ <div class="autocomplete-items">
+ <p *ngFor="let hit of data" (click)="selectedResult(hit)" class="autocomplete-item">
+ {{ parseHitToAddress(hit) }}
+ </p>
+ </div>
+</div>
diff --git a/src/app/shared/components/address-autocomplete/address-autocomplete.component.scss b/src/app/shared/components/address-autocomplete/address-autocomplete.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..433d3afca2e236a0a53d9e243bf1f15b6803e285
--- /dev/null
+++ b/src/app/shared/components/address-autocomplete/address-autocomplete.component.scss
@@ -0,0 +1,22 @@
+@import '../../../../assets/scss/color';
+
+.search-bar {
+ display: flex;
+ flex-direction: column;
+}
+.autocomplete-items {
+ border: 0.0625rem solid #d4d4d4;
+ border-top: none;
+ border-bottom: none;
+ z-index: 99;
+ background-color: #fff;
+ cursor: pointer;
+}
+.autocomplete-item {
+ margin: 0;
+ padding: 1em 0;
+}
+.autocomplete-item:hover {
+ background-color: #dee6ee;
+ cursor: pointer;
+}
diff --git a/src/app/shared/components/address-autocomplete/address-autocomplete.component.spec.ts b/src/app/shared/components/address-autocomplete/address-autocomplete.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..a74f2a401dfe1c801ba3a1688acef4fa9d1a453f
--- /dev/null
+++ b/src/app/shared/components/address-autocomplete/address-autocomplete.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddressAutocompleteComponent } from './address-autocomplete.component';
+
+describe('AddressAutocompleteComponent', () => {
+ let component: AddressAutocompleteComponent;
+ let fixture: ComponentFixture<AddressAutocompleteComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ AddressAutocompleteComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AddressAutocompleteComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/components/address-autocomplete/address-autocomplete.component.ts b/src/app/shared/components/address-autocomplete/address-autocomplete.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4e6d5cc978a3a20441490af073e3120753ee1bf1
--- /dev/null
+++ b/src/app/shared/components/address-autocomplete/address-autocomplete.component.ts
@@ -0,0 +1,36 @@
+import { Component, ElementRef, EventEmitter, Output, ViewChild } from '@angular/core';
+import { AddressService } from '../../service/address.service';
+
+@Component({
+ selector: 'app-address-autocomplete',
+ templateUrl: './address-autocomplete.component.html',
+ styleUrls: ['./address-autocomplete.component.scss'],
+})
+export class AddressAutocompleteComponent {
+ public readonly AUTOCOMPLETE_NBR = 5;
+ public data = [];
+ @ViewChild('searchAddress', { static: true }) searchAddress: ElementRef;
+ @Output() selectedAddress: EventEmitter<string> = new EventEmitter<string>();
+
+ constructor(private addressService: AddressService) {}
+
+ public onSearchChange(searchString: string) {
+ this.addressService.searchAddress(searchString).subscribe((data) => {
+ this.data = data.hits.hits.slice(0, this.AUTOCOMPLETE_NBR);
+ });
+ }
+
+ public selectedResult(hit: any): void {
+ const value = this.parseHitToAddress(hit);
+ // Set input value
+ this.searchAddress.nativeElement.value = value;
+ // Reset autocomplete
+ this.data = [];
+ // Emit choosen value
+ this.selectedAddress.emit(value);
+ }
+
+ public parseHitToAddress(hit: any): string {
+ return `${hit._source['data-fr'].properties.numero_str} ${hit._source['data-fr'].properties.voie_str} ${hit._source['data-fr'].properties.commune_str}`;
+ }
+}
diff --git a/src/app/shared/components/button/button.component.html b/src/app/shared/components/button/button.component.html
index 91c9e7a6792241a67693e48fec034bbe6331820f..099145ec9e14669f605b90b347f249beb29d24a1 100644
--- a/src/app/shared/components/button/button.component.html
+++ b/src/app/shared/components/button/button.component.html
@@ -8,7 +8,13 @@
fxLayoutAlign="space-between center"
fxLayoutGap="13px"
>
- <app-svg-icon style="height: 100%" [type]="'ico'" [iconClass]="'icon-32'" [icon]="iconBtn"></app-svg-icon>
+ <app-svg-icon
+ style="height: 100%"
+ [type]="'ico'"
+ [iconClass]="'icon-32'"
+ [icon]="iconBtn"
+ [iconColor]="'currentColor'"
+ ></app-svg-icon>
{{ text }}
</div>
</button>
diff --git a/src/app/shared/components/index.ts b/src/app/shared/components/index.ts
index 89b310d7237b90231eb9b548fc868546dfd8290f..e4d55982fd57f00574f4456459841eed11994a92 100644
--- a/src/app/shared/components/index.ts
+++ b/src/app/shared/components/index.ts
@@ -6,6 +6,7 @@ import { SignInModalComponent } from './signin-modal/signin-modal.component';
import { SvgIconComponent } from './svg-icon/svg-icon.component';
import { ValidatorFormComponent } from './validator-form/validator-form.component';
import { CreateAccountFormComponent } from './create-account-form/create-account-form.component';
+import { AddressAutocompleteComponent } from './address-autocomplete/address-autocomplete.component';
// tslint:disable-next-line: max-line-length
export {
@@ -17,6 +18,7 @@ export {
SignUpModalComponent,
SignInModalComponent,
CreateAccountFormComponent,
+ AddressAutocompleteComponent,
};
// tslint:disable-next-line:variable-name
@@ -29,4 +31,5 @@ export const SharedComponents = [
SignUpModalComponent,
SignInModalComponent,
CreateAccountFormComponent,
+ AddressAutocompleteComponent,
];
diff --git a/src/app/shared/components/logo-card/logo-card.component.scss b/src/app/shared/components/logo-card/logo-card.component.scss
index 9f982ddc8a176ef1d3fd66bdaed57f922fbf733f..09946b42730ad6f57d8becaba83f23e73f62e55c 100644
--- a/src/app/shared/components/logo-card/logo-card.component.scss
+++ b/src/app/shared/components/logo-card/logo-card.component.scss
@@ -13,7 +13,7 @@ p {
div {
border: 1px solid $grey-4;
box-sizing: border-box;
- border-radius: 4px;
+ border-radius: 16px;
margin-bottom: 24px;
padding: 16px 25px;
max-width: 172px;
diff --git a/src/app/shared/components/modal/modal.component.scss b/src/app/shared/components/modal/modal.component.scss
index ec0dd8d35e72127edd81d971224dccdd67a95067..5d12fa7647408b644a3339d0dbd7ec6b085d915a 100644
--- a/src/app/shared/components/modal/modal.component.scss
+++ b/src/app/shared/components/modal/modal.component.scss
@@ -5,7 +5,7 @@
@import '../../../../assets/scss/hyperlink';
.cModal {
position: fixed;
- z-index: $modal-add-structure-z-index;
+ z-index: $modal-z-index;
top: 0;
right: 0;
bottom: 0;
diff --git a/src/app/shared/components/signin-modal/signin-modal.component.scss b/src/app/shared/components/signin-modal/signin-modal.component.scss
index b65234fb3d7035bd0a406e3d617d3d3a3bd107e9..a73c0f1c2f0d29c8bf9352db5c3251ee1cdfde02 100644
--- a/src/app/shared/components/signin-modal/signin-modal.component.scss
+++ b/src/app/shared/components/signin-modal/signin-modal.component.scss
@@ -5,7 +5,7 @@
@import '../../../../assets/scss/hyperlink';
.cModal {
position: fixed;
- z-index: $modal-add-structure-z-index;
+ z-index: $modal-z-index;
top: 0;
right: 0;
bottom: 0;
diff --git a/src/app/shared/components/signup-modal/signup-modal.component.html b/src/app/shared/components/signup-modal/signup-modal.component.html
index cf0a3fa0ada7f83d43ac102f4e11f41d0d98cdc0..537ae6c49902a679f7c79a6b2e33130f103f27ec 100644
--- a/src/app/shared/components/signup-modal/signup-modal.component.html
+++ b/src/app/shared/components/signup-modal/signup-modal.component.html
@@ -7,7 +7,7 @@
<div class="card-body">
<form [formGroup]="loginForm" (ngSubmit)="onSubmit()">
<div class="form-group">
- <label for="username">Identifiant</label>
+ <label for="username">Email</label>
<input
type="text"
formControlName="username"
diff --git a/src/app/shared/components/signup-modal/signup-modal.component.scss b/src/app/shared/components/signup-modal/signup-modal.component.scss
index b65234fb3d7035bd0a406e3d617d3d3a3bd107e9..a73c0f1c2f0d29c8bf9352db5c3251ee1cdfde02 100644
--- a/src/app/shared/components/signup-modal/signup-modal.component.scss
+++ b/src/app/shared/components/signup-modal/signup-modal.component.scss
@@ -5,7 +5,7 @@
@import '../../../../assets/scss/hyperlink';
.cModal {
position: fixed;
- z-index: $modal-add-structure-z-index;
+ z-index: $modal-z-index;
top: 0;
right: 0;
bottom: 0;
diff --git a/src/app/shared/components/svg-icon/svg-icon.component.html b/src/app/shared/components/svg-icon/svg-icon.component.html
index b90ab6a10f78c53381b8b7d9efde1a89a4365911..055f851e1d2243edd4b650b23ec510ea3ad9e9a7 100644
--- a/src/app/shared/components/svg-icon/svg-icon.component.html
+++ b/src/app/shared/components/svg-icon/svg-icon.component.html
@@ -1,3 +1,4 @@
-<svg aria-hidden="true" class="icon" [ngClass]="iconClass" [attr.fill]="iconColor ? iconColor : 'none'">
+<svg aria-hidden="true" class="icon" [ngClass]="iconClass" [attr.fill]="iconColor" [attr.stroke]="iconColor">
+ <title *ngIf="title">{{ title }}</title>
<use [attr.xlink:href]="'assets/' + type + '/sprite.svg#' + icon"></use>
</svg>
diff --git a/src/app/shared/components/svg-icon/svg-icon.component.ts b/src/app/shared/components/svg-icon/svg-icon.component.ts
index 72c221e3d48b4fe7d81f70537140cd39fdf05543..23badf796fc5f101a3262319ef4eeddec3fc7965 100644
--- a/src/app/shared/components/svg-icon/svg-icon.component.ts
+++ b/src/app/shared/components/svg-icon/svg-icon.component.ts
@@ -9,6 +9,7 @@ export class SvgIconComponent {
@Input() icon: string;
@Input() iconClass: string;
@Input() type: string;
- @Input() iconColor: string;
+ @Input() iconColor: string = 'none';
+ @Input() title: string = null;
constructor() {}
}
diff --git a/src/app/shared/service/address.service.spec.ts b/src/app/shared/service/address.service.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..f0cd890c8048ca5558a6e2c778edcfcd93c81b85
--- /dev/null
+++ b/src/app/shared/service/address.service.spec.ts
@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { AddressService } from './address.service';
+
+describe('AddressService', () => {
+ let service: AddressService;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({});
+ service = TestBed.inject(AddressService);
+ });
+
+ it('should be created', () => {
+ expect(service).toBeTruthy();
+ });
+});
diff --git a/src/app/shared/service/address.service.ts b/src/app/shared/service/address.service.ts
new file mode 100644
index 0000000000000000000000000000000000000000..38f66f8d10f2d7c8f51c81bf3079f367d58cb379
--- /dev/null
+++ b/src/app/shared/service/address.service.ts
@@ -0,0 +1,14 @@
+import { HttpClient } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+
+@Injectable({
+ providedIn: 'root',
+})
+export class AddressService {
+ constructor(private http: HttpClient) {}
+
+ public searchAddress(searchQuery: string): Observable<any> {
+ return this.http.post<any>(`api/structures/address`, { searchQuery });
+ }
+}
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 7a91eef73550ffb2f1efc354f8f4bf35e26ce7a7..2709454bdff75e2077f2c0fc772a1b073fa58c03 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -7,9 +7,10 @@ import { SharedComponents } from './components';
import { SharedPipes } from './pipes';
import { SharedDirectives } from './directives';
import { SvgIconComponent } from './components/svg-icon/svg-icon.component';
+import { AddressAutocompleteComponent } from './components/address-autocomplete/address-autocomplete.component';
@NgModule({
imports: [CommonModule, RouterModule, FlexLayoutModule, ReactiveFormsModule],
- declarations: [...SharedPipes, ...SharedComponents, ...SharedDirectives, SvgIconComponent],
+ declarations: [...SharedPipes, ...SharedComponents, ...SharedDirectives, SvgIconComponent, AddressAutocompleteComponent],
exports: [
...SharedPipes,
...SharedComponents,
diff --git a/src/app/structure-list/components/card/card.component.html b/src/app/structure-list/components/card/card.component.html
index 72c5cb144d0424cedeb73bf463ce77cecdd1e091..cfc62451e984945342059e7574286bab82fb2873 100644
--- a/src/app/structure-list/components/card/card.component.html
+++ b/src/app/structure-list/components/card/card.component.html
@@ -8,14 +8,21 @@
fxLayoutAlign="end center"
fxLayoutGap="20px"
>
- <div class="isntPhoneContent" fxLayout="row" fxLayoutAlign="center center">
- <span class="indicatorDistance" *ngFor="let i of [].constructor(structure.getDistanceRange())"></span>
- </div>
<div>
{{ this.formatDistance() }}
</div>
</div>
</div>
<span class="typeStructure">{{ structure.getLabelTypeStructure() }}</span>
+ <div fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="7px" *ngIf="structure.hasEquipments()">
+ <app-svg-icon
+ *ngFor="let equipement of structure.equipmentsAndServices"
+ [type]="'ico'"
+ [iconColor]="'grey'"
+ [icon]="structure.getEquipmentsIcon(equipement)"
+ [title]="structure.getEquipmentsTitle(equipement)"
+ ></app-svg-icon>
+ </div>
+
<br />
</div>
diff --git a/src/app/structure-list/components/card/card.component.scss b/src/app/structure-list/components/card/card.component.scss
index 4d3d5aa0448d62179a1804d3c6174e14136face8..4bae4df3d7107b0eec3f29ef29f99ca332bd63ea 100644
--- a/src/app/structure-list/components/card/card.component.scss
+++ b/src/app/structure-list/components/card/card.component.scss
@@ -3,22 +3,6 @@
@import '../../../../assets/scss/typography';
@import '../../../../assets/scss/breakpoint';
-.indicatorDistance {
- width: 34px;
- height: 1px;
- background: $grey-3;
- border-radius: 1px;
- &:before {
- height: 7px;
- width: 33px;
- content: '';
- margin-top: -3px;
- display: block;
- border-radius: 1px;
- border-left: 1px solid $grey-3;
- border-right: 1px solid $grey-3;
- }
-}
.structure {
padding: 12px 0 12px 0;
border-bottom: 1px dashed $grey !important;
@@ -43,9 +27,3 @@
border-bottom: none;
}
}
-
-@media #{$large-phone} {
- .isntPhoneContent {
- display: none !important;
- }
-}
diff --git a/src/app/structure-list/components/card/card.component.ts b/src/app/structure-list/components/card/card.component.ts
index dc6e8ce1e96bbe61fcd7ce6a3efe835188c7cf25..58d7f395db867cbfdc9afd51f2a6ea77c455535e 100644
--- a/src/app/structure-list/components/card/card.component.ts
+++ b/src/app/structure-list/components/card/card.component.ts
@@ -2,6 +2,7 @@ import { Component, Input, Output, OnInit, EventEmitter } from '@angular/core';
import { Structure } from '../../../models/structure.model';
import { GeojsonService } from '../../../services/geojson.service';
import { typeStructureEnum } from '../../../shared/enum/typeStructure.enum';
+import { Equipment } from '../../enum/equipment.enum';
@Component({
selector: 'app-card',
diff --git a/src/app/structure-list/components/modal-filter/modal-filter.component.scss b/src/app/structure-list/components/modal-filter/modal-filter.component.scss
index dcd0cd49035f365ed114958ec4d08b8f7a04df52..247ab736150c4e47de06114c05e836feb60b3343 100644
--- a/src/app/structure-list/components/modal-filter/modal-filter.component.scss
+++ b/src/app/structure-list/components/modal-filter/modal-filter.component.scss
@@ -22,7 +22,7 @@
.modal {
max-width: 754px;
width: 94%;
- z-index: $modal-filter-structure-z-index !important;
+ z-index: $modal-z-index !important;
position: fixed;
border-radius: 6px;
margin-top: 3.5px;
diff --git a/src/app/structure-list/components/search/search.component.html b/src/app/structure-list/components/search/search.component.html
index 53f03986dcb07cbeab37b58953e6ed84634a38bd..72c0a8883947d16daee3d9f45385a061d9741ad2 100644
--- a/src/app/structure-list/components/search/search.component.html
+++ b/src/app/structure-list/components/search/search.component.html
@@ -1,5 +1,5 @@
<div class="header">
- <span class="title">Acteurs de la médiation</span>
+ <span class="title">Acteurs de la médiation numérique</span>
</div>
<div class="content" fxLayout="column">
<div class="searchSection">
@@ -11,7 +11,7 @@
(ngSubmit)="applyFilter(searchForm.value.searchTerm)"
>
<div class="inputSection" fxLayout="row" fxLayoutAlign="space-between center">
- <input type="text" formControlName="searchTerm" placeholder="Rechercher une adresse, une association..." />
+ <input type="text" formControlName="searchTerm" placeholder="Rechercher une commune, une association..." />
<button (click)="clearInput()" class="icon close" type="button"><div class="ico-close-search"></div></button>
<span class="separator"></span>
<button (click)="locateMe()" class="icon pin" type="button"><div class="ico-pin-search"></div></button>
@@ -37,7 +37,7 @@
fxLayoutAlign="space-between center"
(click)="openModal(TypeModal.accompaniment)"
>
- <span>Accompagnement</span>
+ <span>Démarches en ligne</span>
<div class="arrow"></div>
</button>
<button
@@ -51,7 +51,7 @@
fxLayoutAlign="space-between center"
(click)="openModal(TypeModal.training)"
>
- <span>Formations</span>
+ <span>Ateliers</span>
<div class="arrow"></div>
</button>
<button
@@ -65,7 +65,7 @@
fxLayoutAlign="space-between center"
(click)="openModal(TypeModal.moreFilters)"
>
- <span>Plus de filtres</span>
+ <span>Plus de critères</span>
<div class="arrow"></div>
</button>
</div>
diff --git a/src/app/structure-list/components/search/search.component.scss b/src/app/structure-list/components/search/search.component.scss
index d73591af5bd27ce063d6a9cf55c828c027213aad..8359c4bddafb73541a85738c0b36a4685145aedb 100644
--- a/src/app/structure-list/components/search/search.component.scss
+++ b/src/app/structure-list/components/search/search.component.scss
@@ -47,6 +47,7 @@
outline: none;
border-radius: 4px;
cursor: pointer;
+ white-space: nowrap;
@include btn-normal;
.arrow {
background-color: transparent;
diff --git a/src/app/structure-list/components/structure-details/structure-details.component.html b/src/app/structure-list/components/structure-details/structure-details.component.html
index 8fb67057cbedcd79421bf777f3e6ac50ba7b3c86..8d375d069c14dfc5a9b10194fc7fbe7c78ad4d59 100644
--- a/src/app/structure-list/components/structure-details/structure-details.component.html
+++ b/src/app/structure-list/components/structure-details/structure-details.component.html
@@ -12,8 +12,11 @@
<button (click)="claimStructure()">Revendiquer</button>
</div>
<div fxLayout="row" fxLayoutAlign="center center">
- <button *ngIf="profileService.isLinkedToStructure(structure._id)" (click)="editStructure()">
- Modifier ma structure
+ <button
+ *ngIf="profileService.isLinkedToStructure(structure._id) || profileService.isAdmin()"
+ (click)="editStructure()"
+ >
+ Modifier la structure
</button>
</div>
<div fxLayout="row" fxLayoutAlign="end center">
@@ -21,10 +24,20 @@
</div>
<div fxLayout="row" class="structure-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="8px">
<div fxLayout="column" fxLayoutGap="10px" fxFlex="100%">
- <div fxLayout="row" fxLayoutAlign="space-between start">
- <div fxLayout="column">
- <h2 class="bold">{{ structure.structureName }}</h2>
+ <div fxLayout="column" fxLayoutAlign="space-between start">
+ <h2 class="bold">{{ structure.structureName }}</h2>
+ </div>
+ <div fxLayout="row" fxLayoutAlign="space-between center">
+ <div class="typeInformationHeader" fxLayout="column">
<h3>{{ structure.getLabelTypeStructure() }}</h3>
+ <div fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="7px" *ngIf="structure.hasEquipments()">
+ <app-svg-icon
+ *ngFor="let equipement of structure.equipmentsAndServices"
+ [type]="'ico'"
+ [iconColor]="'currentColor'"
+ [icon]="structure.getEquipmentsIcon(equipement)"
+ ></app-svg-icon>
+ </div>
</div>
<div class="printButton" fxLayout="column" fxLayoutAlign="end">
<app-button
@@ -69,6 +82,10 @@
<app-svg-icon [type]="'ico'" [icon]="'email'"></app-svg-icon>
<p>{{ structure.contactMail }}</p>
</div>
+ <div *ngIf="structure.hasPassNumeric()" fxLayout="row" fxLayoutAlign="none center" fxLayoutGap="13px">
+ <app-svg-icon [type]="'ico'" [icon]="'pass'"></app-svg-icon>
+ <p>agréé Pass Numérique</p>
+ </div>
<div fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="13px">
<app-svg-icon [type]="'ico'" [icon]="'calendar'"></app-svg-icon>
<p>Mise à jour le {{ structure.updatedAt | date: 'mediumDate' }}</p>
@@ -77,7 +94,7 @@
</div>
</div>
</div>
- <!-- Démarches -->
+ <!-- Démarches en ligne -->
<div
*ngIf="structure.proceduresAccompaniment.length"
fxLayout="column"
@@ -87,7 +104,7 @@
>
<div fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="8px">
<app-svg-icon [type]="'ico'" [icon]="'demarches'" [iconClass]="'icon-32'"></app-svg-icon>
- <h2>Démarches</h2>
+ <h2>Démarches en ligne</h2>
</div>
<div fxLayout="column">
<div fxLayout="row wrap" fxLayoutGap="24px">
@@ -112,7 +129,7 @@
>
<div fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="8px">
<app-svg-icon [type]="'ico'" [icon]="'services'" [iconClass]="'icon-32'"></app-svg-icon>
- <h2>Services</h2>
+ <h2>Ateliers</h2>
</div>
<div fxLayout="row" class="w-100" fxLayout.lt-sm="column">
<div fxFlex="50%" *ngIf="isBaseSkills()">
@@ -120,7 +137,7 @@
<p *ngFor="let skill of baseSkills">{{ skill.text }}</p>
</div>
<div fxFlex="50%" *ngIf="isAccessRights()">
- <h3 class="subtitle">Accès au droits</h3>
+ <h3 class="subtitle">Accès aux droits</h3>
<p *ngFor="let rights of accessRights">{{ rights.text }}</p>
</div>
</div>
@@ -189,7 +206,6 @@
fxLayoutGap="13px"
*ngFor="let equipement of structure.equipmentsAndServices"
>
- <app-svg-icon [type]="'ico'" [icon]="getEquipmentsIcon(equipement)"></app-svg-icon>
<p>
{{ getEquipmentsLabel(equipement) }}
<span *ngIf="equipement == 'ordinateurs' && structure.nbComputers"> : {{ structure.nbComputers }}</span>
diff --git a/src/app/structure-list/components/structure-details/structure-details.component.scss b/src/app/structure-list/components/structure-details/structure-details.component.scss
index 26c51a753ceebd0749cfb04d792ae12dc4ca6524..d0cb40f0ba6da221ccd7642c236ada9d1c1650d2 100644
--- a/src/app/structure-list/components/structure-details/structure-details.component.scss
+++ b/src/app/structure-list/components/structure-details/structure-details.component.scss
@@ -53,7 +53,9 @@
margin-right: 5px;
}
}
-
+.typeInformationHeader {
+ color: $grey-3;
+}
h2 {
margin-top: 0;
margin-bottom: 5px;
@@ -62,7 +64,6 @@ h2 {
h3 {
margin: 0;
@include cn-regular-16;
- color: $grey-3;
}
h4 {
margin-left: 0;
diff --git a/src/app/structure-list/components/structure-details/structure-details.component.ts b/src/app/structure-list/components/structure-details/structure-details.component.ts
index bb2505864b4b87497ca525aee952aea529b4041a..71619679ee561c260bbb728c11b6b4191946cddb 100644
--- a/src/app/structure-list/components/structure-details/structure-details.component.ts
+++ b/src/app/structure-list/components/structure-details/structure-details.component.ts
@@ -85,23 +85,6 @@ export class StructureDetailsComponent implements OnInit {
}
}
- public getEquipmentsIcon(equipment: Equipment): string {
- switch (equipment) {
- case Equipment.wifi:
- return 'wifi';
- case Equipment.bornes:
- return 'borne';
- case Equipment.printer:
- return 'print';
- case Equipment.tablet:
- return 'tablet';
- case Equipment.computer:
- return 'computer';
- default:
- return null;
- }
- }
-
public getEquipmentsLabel(equipment: Equipment): string {
switch (equipment) {
case Equipment.wifi:
diff --git a/src/app/structure-list/structure-list.component.html b/src/app/structure-list/structure-list.component.html
index a4d7320ed0c1ee10516512502ddf3c53371c360e..57b306f09d6a1232fd3faf304ce1f67e573adfde 100644
--- a/src/app/structure-list/structure-list.component.html
+++ b/src/app/structure-list/structure-list.component.html
@@ -12,6 +12,7 @@
(showDetails)="showDetails($event)"
(hover)="handleCardHover($event)"
></app-card>
+ <p *ngIf="structureList && structureList.length <= 0">Il n'y a aucune réponse correspondant à votre recherche</p>
</div>
<app-structure-details
diff --git a/src/assets/ico/sprite.svg b/src/assets/ico/sprite.svg
index 6bb4161312acd1571870cb49388c6adcab352bdb..342b08c58a85dd0e2dd83d7f74aaa45880479583 100644
--- a/src/assets/ico/sprite.svg
+++ b/src/assets/ico/sprite.svg
@@ -7,7 +7,7 @@
</symbol>
<symbol id="tablet" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M16 18C16.5523 18 17 17.5523 17 17V4C17 3.44772 16.5523 3 16 3H6C5.44772 3 5 3.44772 5 4V17C5 17.5523 5.44772 18 6 18H16ZM16 4H6V16H16V4ZM11 17.5C11.2761 17.5 11.5 17.2761 11.5 17C11.5 16.7239 11.2761 16.5 11 16.5C10.7239 16.5 10.5 16.7239 10.5 17C10.5 17.2761 10.7239 17.5 11 17.5Z" fill="#333333"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16 18C16.5523 18 17 17.5523 17 17V4C17 3.44772 16.5523 3 16 3H6C5.44772 3 5 3.44772 5 4V17C5 17.5523 5.44772 18 6 18H16ZM16 4H6V16H16V4ZM11 17.5C11.2761 17.5 11.5 17.2761 11.5 17C11.5 16.7239 11.2761 16.5 11 16.5C10.7239 16.5 10.5 16.7239 10.5 17C10.5 17.2761 10.7239 17.5 11 17.5Z" stroke="none"/>
</symbol>
<symbol id="transport" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -31,10 +31,10 @@
</svg>
<symbol id="computer" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
-<rect x="2.5" y="3.5" width="17" height="11" rx="0.5" stroke="#333333"/>
-<rect x="2" y="12" width="18" height="2" fill="#333333"/>
-<rect x="9" y="15" width="4" height="2" fill="#333333"/>
-<path d="M7 17.382C7 17.1479 7.13226 16.9339 7.34164 16.8292L8.78885 16.1056C8.92771 16.0361 9.08082 16 9.23607 16H12.7639C12.9192 16 13.0723 16.0361 13.2111 16.1056L14.6584 16.8292C14.8677 16.9339 15 17.1479 15 17.382C15 17.7233 14.7233 18 14.382 18H7.61803C7.2767 18 7 17.7233 7 17.382Z" fill="#333333"/>
+<rect x="2.5" y="3" width="17" height="11" rx="0.5" stroke-width="2" fill="none"/>
+<rect x="2" y="12" width="18" height="2" stroke="none" />
+<rect x="9" y="15" width="4" height="2" stroke="none"/>
+<path d="M7 17.382C7 17.1479 7.13226 16.9339 7.34164 16.8292L8.78885 16.1056C8.92771 16.0361 9.08082 16 9.23607 16H12.7639C12.9192 16 13.0723 16.0361 13.2111 16.1056L14.6584 16.8292C14.8677 16.9339 15 17.1479 15 17.382C15 17.7233 14.7233 18 14.382 18H7.61803C7.2767 18 7 17.7233 7 17.382Z"/>
</symbol>
<symbol id="date" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
@@ -91,9 +91,9 @@
</symbol>
<symbol id="print" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
-<rect x="10" y="8" width="12" height="5" stroke="currentColor" stroke-width="2"/>
-<rect x="10" y="17" width="12" height="8" stroke="currentColor" stroke-width="2"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M6 12C5.44772 12 5 12.4477 5 13V21H9V17H23V21H27V13C27 12.4477 26.5523 12 26 12H6Z" fill="currentColor"/>
+<rect x="10" y="8" width="12" height="5" stroke-width="2" fill="none"/>
+<rect x="10" y="17" width="12" height="8" stroke-width="2" fill="none"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M6 12C5.44772 12 5 12.4477 5 13V21H9V17H23V21H27V13C27 12.4477 26.5523 12 26 12H6Z"/>
</symbol>
<symbol id="calendar" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
@@ -126,30 +126,16 @@
</symbol>
<symbol id="borne" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
-<mask id="path-1-inside-1" fill="white">
-<rect x="5" width="12" height="9" rx="1"/>
-</mask>
-<rect x="5" width="12" height="9" rx="1" stroke="#333333" stroke-width="4" mask="url(#path-1-inside-1)"/>
-<path d="M6 14H16L14.6364 22H7.36364L6 14Z" fill="#333333"/>
-<path d="M5.04692 10.1658C5.12212 10.0617 5.24275 10 5.37119 10H16.6288C16.7573 10 16.8779 10.0617 16.9531 10.1658L18.542 12.3658C18.733 12.6303 18.544 13 18.2177 13H3.7823C3.45599 13 3.26698 12.6303 3.45803 12.3658L5.04692 10.1658Z" fill="#333333"/>
+<rect x="5" width="12" height="9" rx="1" stroke-width="1.9" fill="none"/>
+<path d="M6 14H16L14.6364 22H7.36364L6 14Z"/>
+<path d="M5.04692 10.1658C5.12212 10.0617 5.24275 10 5.37119 10H16.6288C16.7573 10 16.8779 10.0617 16.9531 10.1658L18.542 12.3658C18.733 12.6303 18.544 13 18.2177 13H3.7823C3.45599 13 3.26698 12.6303 3.45803 12.3658L5.04692 10.1658Z" stroke="none"/>
</symbol>
<symbol id="wifi" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0)">
-<path d="M1.08488 8.63175C3.61838 6.09825 7.11838 4.53125 10.9844 4.53125C14.8504 4.53125 18.3504 6.09825 20.8839 8.63175L19.4697 10.046C17.2981 7.87439 14.2981 6.53125 10.9844 6.53125C7.67066 6.53125 4.67066 7.8744 2.49909 10.046L1.08488 8.63175Z" fill="#333333"/>
-<path d="M0.987878 8.72971C-1.46519 11.2313 -2.98672 14.6496 -3.01522 18.4233C-3.00846 17.5465 -2.91931 16.6682 -2.74662 15.8C-2.2154 13.1293 -0.917113 10.6726 0.987878 8.72971Z" fill="#333333"/>
-<path d="M-3.0153 18.6274C-2.99021 22.3568 -1.50692 25.7399 0.892922 28.235C-0.311404 26.9826 -1.27828 25.5103 -1.94994 23.8888C-2.64453 22.2119 -3.00294 20.4247 -3.0153 18.6274Z" fill="#333333"/>
-<path d="M1.20434 28.5488C3.72784 31.0128 7.17878 32.5312 10.9844 32.5312C14.7486 32.5312 18.1658 31.0457 20.6818 28.6288C20.0912 29.196 19.4494 29.7127 18.7624 30.1718C16.4601 31.7102 13.7533 32.5312 10.9844 32.5312C8.21543 32.5312 5.50867 31.7102 3.20639 30.1718C2.48717 29.6913 1.81751 29.1474 1.20434 28.5488Z" fill="#333333"/>
-<path d="M21.0019 28.3113C23.4506 25.8035 24.9655 22.3797 24.9842 18.6022C24.975 20.408 24.6165 22.2041 23.9187 23.8888C23.2333 25.5434 22.2406 27.0425 21.0019 28.3113Z" fill="#333333"/>
-<path d="M24.9841 18.4483C24.9621 14.6515 23.4287 11.2129 20.9551 8.70353C22.8742 10.6505 24.1817 13.1173 24.7154 15.8C24.8897 16.6764 24.9789 17.5632 24.9841 18.4483Z" fill="#333333"/>
-<path d="M18.0554 11.4602C16.2458 9.65054 13.7458 8.53125 10.9844 8.53125C8.22295 8.53125 5.72295 9.65054 3.91331 11.4602L5.32752 12.8744C6.77523 11.4267 8.77523 10.5312 10.9844 10.5312C13.1935 10.5312 15.1935 11.4267 16.6412 12.8744L18.0554 11.4602Z" fill="#333333"/>
-<path d="M15.227 14.2886C14.1412 13.2028 12.6412 12.5312 10.9844 12.5312C9.32752 12.5312 7.82752 13.2028 6.74173 14.2886L8.15595 15.7028C8.8798 14.979 9.8798 14.5312 10.9844 14.5312C12.0889 14.5312 13.0889 14.979 13.8128 15.7028L15.227 14.2886Z" fill="#333333"/>
-<path d="M12.3986 17.117C12.0367 16.7551 11.5367 16.5312 10.9844 16.5312C10.4321 16.5312 9.93209 16.7551 9.57016 17.117L10.9844 18.5312L12.3986 17.117Z" fill="#333333"/>
-</g>
-<defs>
-<clipPath id="clip0">
-<rect width="22" height="22" fill="white"/>
-</clipPath>
-</defs>
+<path d="M1.08488 8.63175C3.61838 6.09825 7.11838 4.53125 10.9844 4.53125C14.8504 4.53125 18.3504 6.09825 20.8839 8.63175L19.4697 10.046C17.2981 7.87439 14.2981 6.53125 10.9844 6.53125C7.67066 6.53125 4.67066 7.8744 2.49909 10.046L1.08488 8.63175Z" stroke="none"/>
+<path d="M1.20434 28.5488C3.72784 31.0128 7.17878 32.5312 10.9844 32.5312C14.7486 32.5312 18.1658 31.0457 20.6818 28.6288C20.0912 29.196 19.4494 29.7127 18.7624 30.1718C16.4601 31.7102 13.7533 32.5312 10.9844 32.5312C8.21543 32.5312 5.50867 31.7102 3.20639 30.1718C2.48717 29.6913 1.81751 29.1474 1.20434 28.5488Z" stroke="none"/>
+<path d="M18.0554 11.4602C16.2458 9.65054 13.7458 8.53125 10.9844 8.53125C8.22295 8.53125 5.72295 9.65054 3.91331 11.4602L5.32752 12.8744C6.77523 11.4267 8.77523 10.5312 10.9844 10.5312C13.1935 10.5312 15.1935 11.4267 16.6412 12.8744L18.0554 11.4602Z" stroke="none"/>
+<path d="M15.227 14.2886C14.1412 13.2028 12.6412 12.5312 10.9844 12.5312C9.32752 12.5312 7.82752 13.2028 6.74173 14.2886L8.15595 15.7028C8.8798 14.979 9.8798 14.5312 10.9844 14.5312C12.0889 14.5312 13.0889 14.979 13.8128 15.7028L15.227 14.2886Z" stroke="none"/>
+<path d="M12.3986 17.117C12.0367 16.7551 11.5367 16.5312 10.9844 16.5312C10.4321 16.5312 9.93209 16.7551 9.57016 17.117L10.9844 18.5312L12.3986 17.117Z" stroke="none"/>
</symbol>
</svg>
diff --git a/src/assets/scss/_inputs.scss b/src/assets/scss/_inputs.scss
index dac479e10cf68b8bfad2187cdfb5feff2f38e9da..e672692f6e3e66ced23a2d0175dd1a3bfe61c43d 100644
--- a/src/assets/scss/_inputs.scss
+++ b/src/assets/scss/_inputs.scss
@@ -1,3 +1,6 @@
+@import './color';
+@import './shapes';
+
@mixin input-search {
width: 100%;
border: none;
@@ -7,3 +10,16 @@
outline: none;
font-style: italic;
}
+
+.form-input {
+ min-width: 290px;
+ background: $grey-6;
+ border: 1px solid $grey-4;
+ box-sizing: border-box;
+ border-radius: $input-radius;
+ height: 40px;
+}
+.form-input:focus {
+ border: 1px solid $blue;
+ outline: none !important;
+}
diff --git a/src/assets/scss/_shapes.scss b/src/assets/scss/_shapes.scss
index fec384566eade89e0d916b65b1cf54f3845054fe..c85355e0f9d902d9636af3a4f3d464f137190d62 100644
--- a/src/assets/scss/_shapes.scss
+++ b/src/assets/scss/_shapes.scss
@@ -2,7 +2,7 @@
$card-radius: 0.625em;
$bouton-radius: 0.625em;
-$input-radius: 0.3125em;
+$input-radius: 4px;
$bouton-width: 12.25em;
$round-bouton-radius: 1.25em;
$round-radius: 50%;
diff --git a/src/assets/scss/_z-index.scss b/src/assets/scss/_z-index.scss
index 1f6dbcd22289984b44529458df1b94e40d7cfb2d..a9230fbd4da7814c07407923abced79e6a5c7f48 100644
--- a/src/assets/scss/_z-index.scss
+++ b/src/assets/scss/_z-index.scss
@@ -1,5 +1,9 @@
-$structure-details-z-index: 1002;
-$modal-add-structure-z-index: 1002;
-$modal-filter-structure-z-index: 1002;
-$modal-menu-phone-z-index: 1002;
-$btn-phone-switch-map-list-z-index: 1001;
+// Phone view
+$btn-phone-switch-map-list-z-index: 1002;
+$menu-phone-z-index: 1003;
+
+// Structure details
+$structure-details-z-index: 1001;
+
+// Modals (filters/confirmationPopup/authen/...)
+$modal-z-index: 1002;
diff --git a/src/styles.scss b/src/styles.scss
index 3e993cf999755166bef51cc59f18f3645bdd2ee0..1773ee54cf9ba8e8bb68207ec02196d7a1b57db6 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -4,6 +4,7 @@
@import 'assets/scss/color';
@import 'assets/scss/breakpoint';
@import 'assets/scss/icons';
+@import 'assets/scss/inputs';
@import '../node_modules/leaflet.locatecontrol/dist/L.Control.Locate.css';
html {