From 083865546cf32c0f209abe3f3a48db5d6c7cdf94 Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Wed, 3 Feb 2021 16:11:29 +0100
Subject: [PATCH 1/3] feat: update header/footer design
---
src/app/about/about.component.html | 2 +-
.../components/panel/panel.component.html | 2 +-
src/app/footer/footer.component.html | 2 +-
src/app/header/header.component.html | 25 +++++++---------
src/app/header/header.component.scss | 20 +++++++------
src/app/header/header.component.ts | 8 ++---
.../legal-notice/legal-notice.component.html | 10 +++----
src/app/menu-phone/menu-phone.component.html | 29 +++++++++----------
src/app/menu-phone/menu-phone.component.scss | 29 ++++++++++---------
src/app/menu-phone/menu-phone.component.ts | 4 +++
src/app/models/user-auth.model.ts | 2 ++
src/app/profile/profile.component.html | 1 +
src/app/profile/profile.component.ts | 12 ++++++--
src/app/services/auth.service.ts | 4 +++
src/assets/logos/ram_logo.svg | 10 -------
src/assets/logos/resin.svg | 4 +++
src/assets/scss/_buttons.scss | 24 +++++++++++++--
src/assets/scss/_color.scss | 1 +
src/assets/scss/_shapes.scss | 1 -
src/assets/scss/_typography.scss | 7 +++++
src/styles.scss | 11 ++++++-
21 files changed, 128 insertions(+), 80 deletions(-)
delete mode 100644 src/assets/logos/ram_logo.svg
create mode 100644 src/assets/logos/resin.svg
diff --git a/src/app/about/about.component.html b/src/app/about/about.component.html
index 3f71ab09c..0b50d93e3 100644
--- a/src/app/about/about.component.html
+++ b/src/app/about/about.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="column" class="content-container">
+<div fxLayout="column" class="content-container full-screen">
<div class="section-container">
<h1>Qui sommes-nous ?</h1>
<p>
diff --git a/src/app/admin/components/panel/panel.component.html b/src/app/admin/components/panel/panel.component.html
index 163961e48..2d2501106 100644
--- a/src/app/admin/components/panel/panel.component.html
+++ b/src/app/admin/components/panel/panel.component.html
@@ -1,4 +1,4 @@
-<div fxLayout="column" class="content-container">
+<div fxLayout="column" class="content-container full-screen">
<div fxLayout="row" fxLayoutAlign="center center"><h1>Administration</h1></div>
<app-admin-claim-structure></app-admin-claim-structure>
</div>
diff --git a/src/app/footer/footer.component.html b/src/app/footer/footer.component.html
index b04879372..e043a1e44 100644
--- a/src/app/footer/footer.component.html
+++ b/src/app/footer/footer.component.html
@@ -2,8 +2,8 @@
<div fxLayout="row">
<a class="clickable text-align-center" routerLink="/legal-notice" i18n>Mentions légales</a>
<!-- <a class="clickable text-align-center" routerLink="/sitemap" i18n>Plan du site</a> -->
-
<a class="clickable text-align-center" href="mailto:inclusionnumerique@grandlyon.com">Contact</a>
+ <a routerLink="/about" i18n>Qui sommes-nous ?</a>
</div>
<a
class="metro-link"
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
index 87806a669..26670df24 100644
--- a/src/app/header/header.component.html
+++ b/src/app/header/header.component.html
@@ -1,8 +1,8 @@
<div fxLayout="row" class="header hide-on-print">
<div class="logo clickable" routerLink="/home">
- <img class="logo-grand-lyon" src="/assets/logos/ram_logo.svg" alt />
+ <img class="logo-grand-lyon" src="/assets/logos/resin.svg" alt />
<div class="logo-text" fxLayout="column" fxLayoutAlign="center">
- <p>Réseau des Acteurs de la Médiation Numérique de la Métropole de Lyon</p>
+ <p>Réseau des acteurs de l'inclusion numérique de la métropole de Lyon</p>
</div>
</div>
<div class="containerIconMenu" (click)="openMenu()">
@@ -10,21 +10,16 @@
</div>
<div fxLayout="row" class="right-header" fxLayoutAlign="center center" fxLayoutGap="3vw">
<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>
- <!-- <a routerLink="/login" [routerLinkActive]="'active'" i18n><span class="clickable ico-mglass purple"></span></a> -->
- <a *ngIf="!isLoggedIn" (click)="isPopUpOpen = !isPopUpOpen">
- <span class="ico-profile" fxLayout="column" fxLayoutAlign="center center">
- <span class="head"></span>
- <span class="body"></span>
- </span>
- </a>
+ <!-- <a routerLink="/news" [routerLinkActive]="'active'" i18n>Actualités</a> -->
+ <!-- <a routerLink="/resources" [routerLinkActive]="'active'" i18n>Ressources</a> -->
<a *ngIf="isAdmin" routerLink="/admin" [routerLinkActive]="'active'">Administration</a>
- <a *ngIf="isLoggedIn" routerLink="/profile" [routerLinkActive]="'active'" fxLayout="row" fxLayoutGap="1.5vh">
+ <!-- <a *ngIf="isLoggedIn" routerLink="/profile" [routerLinkActive]="'active'" fxLayout="row" fxLayoutGap="1.5vh">
<app-svg-icon [type]="'ico'" [iconClass]="'icon-32'" [icon]="'user'" [iconColor]="'currentColor'"></app-svg-icon>
- </a>
- <button *ngIf="isLoggedIn" (click)="logout()">Logout</button>
+ </a> -->
+ <button *ngIf="isLoggedIn" class="red" routerLink="/profile" [routerLinkActive]="'active'">
+ {{ displayName }}
+ </button>
+ <button *ngIf="!isLoggedIn" (click)="isPopUpOpen = !isPopUpOpen">Se connecter</button>
</div>
</div>
<app-menu-phone *ngIf="showMenu" (closeEvent)="closeMenu($event)"></app-menu-phone>
diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss
index 2e49b9b20..67a3956d4 100644
--- a/src/app/header/header.component.scss
+++ b/src/app/header/header.component.scss
@@ -4,6 +4,7 @@
@import '../../assets/scss/color';
@import '../../assets/scss/breakpoint';
@import '../../assets/scss/shapes';
+@import '../../assets/scss/buttons';
.header {
height: $header-height;
@@ -14,19 +15,12 @@
background-color: $white;
padding: 0 20px;
a {
- font-style: italic;
color: $grey-2;
&.active {
font-weight: bold;
color: $grey-1;
- &:before {
- color: $primary-color;
- content: '// ';
- }
- &:after {
- color: $primary-color;
- content: ' //';
- }
+ border-bottom: 2px solid $red-default;
+ text-decoration: none;
}
}
.right-header {
@@ -50,6 +44,14 @@
}
}
+button {
+ @include btn-grey;
+ &.red {
+ @include btn-red;
+ border: none;
+ }
+}
+
@media print {
div {
display: none !important;
diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts
index 22e7fc842..f91c0fa2d 100644
--- a/src/app/header/header.component.ts
+++ b/src/app/header/header.component.ts
@@ -26,10 +26,6 @@ export class HeaderComponent implements OnInit {
return this.authService.isLoggedIn();
}
- public logout(): void {
- this.authService.logout();
- }
-
public closeSignInModal(): void {
this.isPopUpOpen = false;
this.displaySignUp = true;
@@ -46,4 +42,8 @@ export class HeaderComponent implements OnInit {
public get isAdmin(): boolean {
return this.profileService.isAdmin();
}
+
+ public get displayName(): string {
+ return this.authService.getUsernameDisplay();
+ }
}
diff --git a/src/app/legal-notice/legal-notice.component.html b/src/app/legal-notice/legal-notice.component.html
index f3a346d71..cac0b8d3a 100644
--- a/src/app/legal-notice/legal-notice.component.html
+++ b/src/app/legal-notice/legal-notice.component.html
@@ -151,18 +151,18 @@
<p>
Les bases de données sont protégées par la loi du 1er juillet 1998 et le régime français du droit d'auteur.
</p>
- <p><strong>Établissements de liens vers le site www.ram.grandlyon.com</strong></p>
+ <p><strong>Établissements de liens vers le site www.resin.grandlyon.com</strong></p>
<p>
- La Métropole de Lyon autorise la mise en place d'un lien hypertexte vers son site www.ram.grandlyon.com pour
+ La Métropole de Lyon autorise la mise en place d'un lien hypertexte vers son site www.resin.grandlyon.com pour
tous les sites Internet, à l'exclusion de ceux diffusant des informations à caractère polémique,
pornographique, xénophobe ou pouvant, dans une plus large mesure porter atteinte à la sensibilité du plus grand
- nombre. Le lien doit aboutir à la page d'accueil du site (home page) et le site www.ram.grandlyon.com doit
- apparaître dans une nouvelle fenêtre. Les pages du site www.ram.grandlyon.com ne doivent en aucun cas être
+ nombre. Le lien doit aboutir à la page d'accueil du site (home page) et le site www.resin.grandlyon.com doit
+ apparaître dans une nouvelle fenêtre. Les pages du site www.resin.grandlyon.com ne doivent en aucun cas être
intégrées à l'intérieur des pages d'un autre site (Frame). Dans tous les cas d'espèce, la Métropole de
Lyon se réserve le droit de demander la suppression d'un lien si elle estime que le site cible ne respecte pas
les règles ainsi définies.
</p>
- <p><strong>Liens vers des sites tiers depuis le site www.ram.grandlyon.com</strong></p>
+ <p><strong>Liens vers des sites tiers depuis le site www.resin.grandlyon.com</strong></p>
<p>
Les liens hypertextes mis en œuvre au sein du site en direction d'autres sites et/ou de pages personnelles et
d'une manière générale vers toutes ressources existantes sur internet ne sauraient engager la responsabilité
diff --git a/src/app/menu-phone/menu-phone.component.html b/src/app/menu-phone/menu-phone.component.html
index 3551f848e..b473206e4 100644
--- a/src/app/menu-phone/menu-phone.component.html
+++ b/src/app/menu-phone/menu-phone.component.html
@@ -2,16 +2,14 @@
<div class="outside" (click)="closeMenu()"></div>
<div class="contentMenu" fxLayout="column" fxLayoutAlign="space-between">
<div>
- <div class="titleFilter" fxLayout="row" fxLayoutAlign="space-between">
+ <div class="titleFilter" fxLayout="row" fxLayoutAlign="space-between center">
<span>Menu</span>
<div (click)="closeMenu()" class="ico-close-details"></div>
</div>
- <div fxLayout="column" class="right-header" fxLayoutGap="3vw">
+ <div fxLayout="column" class="right-header" fxLayoutAlign="none baseline" fxLayoutGap="5vw">
<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>
-
+ <!-- <a routerLink="/resources" [routerLinkActive]="'active'" i18n>Ressources</a> -->
+ <!-- <a routerLink="/projects" [routerLinkActive]="'active'" i18n>Projets</a> -->
<a *ngIf="isAdmin" routerLink="/admin" [routerLinkActive]="'active'">Administration</a>
<!--<a routerLink="/login" [routerLinkActive]="'active'" i18n><span class="clickable ico-mglass purple"></span></a>
<a routerLink="/home" [routerLinkActive]="'active'" i18n
@@ -19,15 +17,16 @@
<span class="head"></span>
<span class="body"></span> </span
></a> -->
- <a *ngIf="isLoggedIn" routerLink="/profile" [routerLinkActive]="'active'" fxLayout="row" fxLayoutGap="1.5vh">
- <app-svg-icon
- [type]="'ico'"
- [iconClass]="'icon-32'"
- [icon]="'user'"
- [iconColor]="'currentColor'"
- ></app-svg-icon>
- </a>
- <button *ngIf="isLoggedIn" (click)="logout()">Logout</button>
+ <button
+ *ngIf="isLoggedIn"
+ class="red"
+ routerLink="/profile"
+ [routerLinkActive]="'active'"
+ (click)="closeMenu()"
+ >
+ {{ displayName }}
+ </button>
+ <button *ngIf="!isLoggedIn" (click)="isPopUpOpen = !isPopUpOpen; closeMenu()">Se connecter</button>
</div>
</div>
<!--<div class="footer" fxLayout="row" fxLayoutGap="1.5vh">
diff --git a/src/app/menu-phone/menu-phone.component.scss b/src/app/menu-phone/menu-phone.component.scss
index ea2eb05ce..21f6d72cc 100644
--- a/src/app/menu-phone/menu-phone.component.scss
+++ b/src/app/menu-phone/menu-phone.component.scss
@@ -2,6 +2,7 @@
@import '../../assets/scss/z-index';
@import '../../assets/scss/typography';
@import '../../assets/scss/breakpoint';
+@import '../../assets/scss/buttons';
@keyframes slideMenu {
from {
@@ -43,7 +44,10 @@
}
.titleFilter {
margin-bottom: 35px;
- @include cn-bold-28;
+ @include cn-regular-28;
+ span {
+ color: $grey-2;
+ }
}
.footer {
a {
@@ -53,22 +57,21 @@
margin: auto 0 auto 0;
}
}
+
a {
- @include cn-bold-18;
- font-style: italic;
color: $grey-2;
- height: 70px;
- margin: 0;
&.active {
font-weight: bold;
color: $grey-1;
- &:before {
- color: $primary-color;
- content: '// ';
- }
- &:after {
- color: $primary-color;
- content: ' //';
- }
+ border-bottom: 2px solid $red-default;
+ text-decoration: none;
+ }
+}
+
+button {
+ @include btn-grey;
+ &.red {
+ @include btn-red;
+ border: none;
}
}
diff --git a/src/app/menu-phone/menu-phone.component.ts b/src/app/menu-phone/menu-phone.component.ts
index a0276b4c6..b9c375e93 100644
--- a/src/app/menu-phone/menu-phone.component.ts
+++ b/src/app/menu-phone/menu-phone.component.ts
@@ -24,4 +24,8 @@ export class MenuPhoneComponent implements OnInit {
public get isAdmin(): boolean {
return this.profileService.isAdmin();
}
+
+ public get displayName(): string {
+ return this.authService.getUsernameDisplay();
+ }
}
diff --git a/src/app/models/user-auth.model.ts b/src/app/models/user-auth.model.ts
index 0c3ddbf83..54ebec022 100644
--- a/src/app/models/user-auth.model.ts
+++ b/src/app/models/user-auth.model.ts
@@ -1,5 +1,7 @@
export class UserAuth {
username: string;
+ name: string;
+ surname: string;
accessToken: string;
expiresAt: string;
}
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index e28fca468..4bb888233 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -4,6 +4,7 @@
<div *ngIf="userProfile" fxLayout="column" fxLayoutAlign="center" fxLayoutGap="10px">
<p>Id: {{ userProfile._id }}</p>
<p>Email: {{ userProfile.email }}</p>
+ <button (click)="logout()">Logout</button>
<p fxLayout="column" *ngIf="userProfile.structuresLink.length > 0">
Mes structures :
<span *ngFor="let structureId of userProfile.structuresLink">
diff --git a/src/app/profile/profile.component.ts b/src/app/profile/profile.component.ts
index 1c7bd1c42..5f3b49a73 100644
--- a/src/app/profile/profile.component.ts
+++ b/src/app/profile/profile.component.ts
@@ -1,7 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
-import { Structure } from '../models/structure.model';
import { User } from '../models/user.model';
+import { AuthService } from '../services/auth.service';
import { MustMatch } from '../shared/validator/form';
import { ProfileService } from './services/profile.service';
@@ -20,7 +20,11 @@ export class ProfileComponent implements OnInit {
public formEmail: FormGroup;
public addStructure = false;
- constructor(private formBuilder: FormBuilder, private profileService: ProfileService) {}
+ constructor(
+ private authService: AuthService,
+ private formBuilder: FormBuilder,
+ private profileService: ProfileService
+ ) {}
ngOnInit(): void {
this.profileService.getProfile().then((profile) => {
@@ -98,4 +102,8 @@ export class ProfileComponent implements OnInit {
}
);
}
+
+ public logout(): void {
+ this.authService.logout();
+ }
}
diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts
index bb6b1f569..ba2da5e75 100644
--- a/src/app/services/auth.service.ts
+++ b/src/app/services/auth.service.ts
@@ -42,6 +42,10 @@ export class AuthService {
return false;
}
+ public getUsernameDisplay(): string {
+ return `${this.userValue.name}`;
+ }
+
private getExpiration(): DateTime {
return DateTime.fromISO(this.userValue.expiresAt, { zone: 'Europe/Paris' });
}
diff --git a/src/assets/logos/ram_logo.svg b/src/assets/logos/ram_logo.svg
deleted file mode 100644
index 48c8f1d64..000000000
--- a/src/assets/logos/ram_logo.svg
+++ /dev/null
@@ -1,10 +0,0 @@
-<svg width="121" height="29" viewBox="0 0 121 29" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M54 27.5C54 26.6716 54.6716 26 55.5 26H67.5C68.3284 26 69 26.6716 69 27.5V27.5C69 28.3284 68.3284 29 67.5 29H55.5C54.6716 29 54 28.3284 54 27.5V27.5Z" fill="#ED3939"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M71 8H74V8.80269C74.8825 8.29218 75.9071 8 77 8C80.3137 8 83 10.6863 83 14V27.5C83 28.3284 82.3284 29 81.5 29C80.6716 29 80 28.3284 80 27.5V14C80 12.3431 78.6569 11 77 11C75.3431 11 74 12.3431 74 14V22V27.5C74 28.3284 73.3284 29 72.5 29C71.6716 29 71 28.3284 71 27.5V22V14V8Z" fill="#4F4F4F"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M103 8H100V14V22V27.5C100 28.3284 100.672 29 101.5 29C102.328 29 103 28.3284 103 27.5V22V14C103 12.3431 104.343 11 106 11C107.657 11 109 12.3431 109 14V27.5C109 28.3284 109.672 29 110.5 29C111.328 29 112 28.3284 112 27.5V14C112 12.3431 113.343 11 115 11C116.657 11 118 12.3431 118 14V27.5C118 28.3284 118.672 29 119.5 29C120.328 29 121 28.3284 121 27.5V14C121 10.6863 118.314 8 115 8C113.208 8 111.599 8.78563 110.5 10.0313C109.401 8.78563 107.792 8 106 8C104.907 8 103.883 8.29218 103 8.80269V8Z" fill="#4F4F4F"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M85.5 23C85.5 26.3137 88.1863 29 91.5 29C94.8137 29 97.5 26.3137 97.5 23V9.5C97.5 8.67157 96.8284 8 96 8C95.1716 8 94.5 8.67157 94.5 9.5V23C94.5 24.6569 93.1569 26 91.5 26C89.8431 26 88.5 24.6569 88.5 23V9.5C88.5 8.67157 87.8284 8 87 8C86.1716 8 85.5 8.67157 85.5 9.5V23Z" fill="#4F4F4F"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M34 11C32.3115 11 30.5 12.747 30.5 15.5C30.5 16.3284 31.1716 17 32 17H34.75C37.2353 17 39.25 19.0147 39.25 21.5H39.2268C39.2268 25.3744 36.5611 29 32.7268 29C30.6938 29 28.9456 27.9361 27.7976 26.3968C27.3023 25.7327 27.4391 24.7929 28.1032 24.2976C28.7672 23.8023 29.7071 23.9391 30.2024 24.6032C30.8854 25.5189 31.7982 26 32.7268 26C34.4154 26 36.2268 24.253 36.2268 21.5C36.2268 21.4365 36.2308 21.374 36.2384 21.3126C36.1462 20.5726 35.515 20 34.75 20H32C29.5147 20 27.5 17.9853 27.5 15.5C27.5 11.6256 30.1657 8 34 8C36.0331 8 37.7812 9.06393 38.9292 10.6032C39.4245 11.2673 39.2877 12.2071 38.6237 12.7024C37.9596 13.1977 37.0198 13.0609 36.5245 12.3968C35.8415 11.4811 34.9286 11 34 11Z" fill="#4F4F4F"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M3 3H6C7.65685 3 9 4.34315 9 6V13C9 14.6569 7.65685 16 6 16H4.5H3V3ZM0 17.5V0H6C9.31371 0 12 2.68629 12 6V13C12 15.0173 11.0044 16.8022 9.47774 17.8899C11.025 19.2638 12 21.268 12 23.5V27.5C12 28.3284 11.3284 29 10.5 29C9.67157 29 9 28.3284 9 27.5V23.5C9 21.0147 6.98528 19 4.5 19H3V27.5C3 28.3284 2.32843 29 1.5 29C0.671573 29 0 28.3284 0 27.5V19V17.5Z" fill="#4F4F4F"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M50 23V14C50 12.3431 48.6569 11 47 11C45.3431 11 44 12.3431 44 14V23C44 24.6569 45.3431 26 47 26C48.6569 26 50 24.6569 50 23ZM47 8C43.6863 8 41 10.6863 41 14V23C41 26.3137 43.6863 29 47 29C50.3137 29 53 26.3137 53 23V14C53 10.6863 50.3137 8 47 8Z" fill="#4F4F4F"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M23 14V14.5C23 16.1569 21.6569 17.5 20 17.5H18C17.4477 17.5 17 17.0523 17 16.5V14.5V14C17 12.3431 18.3431 11 20 11C21.6569 11 23 12.3431 23 14ZM17 20.374C17.3196 20.4562 17.6547 20.5 18 20.5H20C23.3137 20.5 26 17.8137 26 14.5V14C26 10.6863 23.3137 8 20 8C16.6863 8 14 10.6863 14 14V14.5V16.5V23.5C14 26.5376 16.4624 29 19.5 29H24C24.8284 29 25.5 28.3284 25.5 27.5C25.5 26.6716 24.8284 26 24 26H19.5C18.1193 26 17 24.8807 17 23.5V20.374Z" fill="#4F4F4F"/>
-</svg>
diff --git a/src/assets/logos/resin.svg b/src/assets/logos/resin.svg
new file mode 100644
index 000000000..6a2f80d71
--- /dev/null
+++ b/src/assets/logos/resin.svg
@@ -0,0 +1,4 @@
+<svg width="108" height="37" viewBox="0 0 108 37" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M104.933 7.60039C105.747 8.22003 106.427 9.00169 106.945 9.92797C107.456 10.8602 107.705 11.9128 107.726 13.0853V31.9332C107.726 33.2027 106.576 34.2251 105.163 34.2251H105.116C103.695 34.2251 102.552 33.1963 102.552 31.9332V13.0853C102.539 12.0387 102.189 11.2629 101.482 10.7696C100.809 10.2525 99.9682 10.0058 99.0266 9.9939C98.0846 9.98795 97.2777 10.2469 96.5779 10.722C95.878 11.197 95.5345 11.9732 95.5417 13.0134L95.5816 31.9217C95.5816 33.1848 94.4378 34.2136 93.0181 34.2136C91.5984 34.2136 90.4547 33.1908 90.4547 31.9217C90.4547 30.0179 90.4604 27.5464 90.4616 27.0237C90.4618 26.9619 90.4618 26.9273 90.4618 26.9242L90.4214 12.9773C90.4142 11.7627 90.6497 10.6739 91.1545 9.76C91.6589 8.83967 92.2983 8.06989 93.1323 7.47449C93.933 6.87866 94.8479 6.42786 95.8975 6.12122C96.9475 5.82055 97.97 5.68234 99.0195 5.69425C100.069 5.70616 101.119 5.86224 102.148 6.18716C103.177 6.51803 104.092 6.98712 104.933 7.60039ZM73.465 9.35682C73.465 7.34181 71.6346 5.70616 69.3809 5.70616C67.1272 5.70616 65.2969 7.34181 65.2969 9.35682V13.0071H69.4413V13.0011C71.6689 12.9709 73.465 11.3535 73.465 9.35682ZM81.1952 5.70616C82.7834 5.70616 84.0685 6.85484 84.0685 8.27403V31.6448C84.0685 33.0645 82.7834 34.2132 81.1952 34.2132C79.6076 34.2132 78.3226 33.0645 78.3226 31.6448V8.27403C78.3226 6.85484 79.6081 5.70616 81.1952 5.70616Z" fill="#E30613"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M37.694 5.2482C38.3089 4.21039 37.8663 2.92346 36.7053 2.37377C35.5443 1.82409 34.1046 2.21979 33.4896 3.2576L33.4896 3.25763C33.4891 3.2585 33.4797 3.27387 33.4577 3.30447C33.4352 3.33564 33.4038 3.37674 33.3621 3.4275C33.2781 3.5299 33.1644 3.65674 33.0207 3.80252C32.7325 4.09505 32.3557 4.43154 31.9199 4.76486C31.2055 5.31117 30.4449 5.76348 29.754 6.03653C29.5884 6.08152 29.4245 6.13163 29.2626 6.18713C28.2064 6.52395 27.3048 6.93307 26.4708 7.53442C25.6434 8.14173 24.9636 8.88173 24.4322 9.82587C23.9007 10.7704 23.6785 11.8468 23.6785 12.9951L23.6048 26.882V26.9241V26.9484C23.6048 30.2078 26.0674 33.0045 29.4178 33.8287L29.4986 33.8648L29.512 33.8708C30.434 34.1238 31.3423 34.2318 32.2029 34.2318C32.2174 34.2318 32.2318 34.2301 32.2452 34.2286C32.2568 34.2272 32.2676 34.2259 32.2772 34.2259C32.2904 34.2259 32.3022 34.2274 32.3139 34.2289L32.314 34.2289L32.3141 34.2289C32.3258 34.2304 32.3376 34.2318 32.3509 34.2318C33.4071 34.2318 34.4633 34.0936 35.4457 33.7568C36.5024 33.42 37.4035 33.0113 38.2381 32.4095C39.0316 31.8145 39.6373 31.2132 40.1487 30.2988C40.2163 30.1784 40.2834 30.0462 40.3371 29.9139C40.9699 28.4756 39.7049 26.942 37.9893 26.942C36.953 26.942 35.991 27.5013 35.6608 28.3795C35.1427 29.7327 33.8448 30.2499 32.3237 30.2499C30.9307 30.2499 29.7399 29.5341 29.148 28.4998C29.0605 28.3552 28.9934 28.1991 28.9329 28.0367C28.8183 27.7241 28.7445 27.3992 28.7445 27.056C28.7445 27.0511 28.7451 27.0466 28.7459 27.0423C28.7465 27.0389 28.7473 27.0355 28.7481 27.0322C28.7499 27.0247 28.7517 27.0173 28.7517 27.0083C28.7517 26.9962 28.7499 26.9855 28.7481 26.9749C28.7463 26.9643 28.7445 26.9539 28.7445 26.942V20.4708H32.2295C33.34 20.4708 34.4366 20.2845 35.4657 19.9298C36.4415 19.593 37.4174 19.1903 38.2447 18.5889C39.0792 17.9812 39.752 17.2416 40.2834 16.297C40.8149 15.3529 41.037 14.2765 41.037 13.1278V13.0615C41.037 13.0485 41.035 13.0356 41.0331 13.0237L41.0331 13.0237C41.0314 13.0133 41.0299 13.0036 41.0299 12.9951H41.037C41.037 11.8468 40.8082 10.7704 40.2834 9.82587C39.752 8.88173 39.0792 8.14173 38.2447 7.53442C37.7376 7.16193 37.2001 6.8417 36.6168 6.58721C37.0715 6.12274 37.4488 5.66194 37.694 5.2482ZM19.7696 9.93433C19.2515 9.00805 18.5716 8.22597 17.7575 7.60675C16.9164 6.99348 16.0019 6.52397 14.9724 6.19352C13.9428 5.8686 12.8933 5.71208 11.8437 5.70017C10.7942 5.68826 9.77174 5.82649 8.72171 6.12717C7.67216 6.43423 6.75725 6.88504 5.95653 7.48044C5.70865 7.65729 5.47798 7.84957 5.26295 8.05661C4.77815 7.66996 4.23024 7.32763 3.62332 7.03472C3.59049 7.02196 3.55103 7.00283 3.5182 6.98369C1.92151 6.26538 0.0393351 7.33159 0.00317654 8.92471L0.000330739 9.18966C-0.0163212 10.0555 0.597416 10.7943 1.47997 11.1502C1.90436 11.3186 2.25264 11.5691 2.51764 11.8894C2.90317 12.3167 3.14129 12.8116 3.2462 13.355L3.28554 26.9301L3.28532 27.0309C3.2841 27.5564 3.2784 30.0257 3.2784 31.9281C3.2784 33.1967 4.42217 34.2195 5.84235 34.2195C7.26157 34.2195 8.40577 33.1912 8.40577 31.9221L8.36535 13.0138C8.35821 11.9736 8.70171 11.1974 9.40157 10.7224C10.1014 10.2474 10.9088 9.98834 11.8503 9.99429C12.7919 10.0062 13.6331 10.2529 14.3058 10.77C14.6555 11.0167 14.9253 11.3357 15.0999 11.7201C15.4701 12.5201 16.2774 13.0917 17.2461 13.1036L17.5425 13.1095C19.3252 13.1278 20.5765 11.4798 19.8233 10.0304C19.8029 10.0003 19.7829 9.9641 19.7696 9.93433ZM34.773 15.4133C35.4529 14.9438 35.8292 14.1319 35.8292 13.1214V13.0496C35.8292 12.0391 35.4529 11.2332 34.773 10.7581C34.0194 10.2831 33.2658 10.0122 32.2838 10.0122C31.3018 10.0122 30.4744 10.2831 29.7946 10.7581C29.1152 11.2272 28.7383 12.0391 28.7383 13.0496V16.1529H32.2838C33.2658 16.1529 34.0932 15.8883 34.773 15.4133ZM57.6823 19.6653L52.1853 15.1369C51.0549 14.2225 50.6248 13.3081 50.6248 12.3461C50.6248 10.8066 51.8085 9.50776 53.6925 9.50776C55.3278 9.50776 56.2765 10.3979 56.8612 11.8171C57.1709 12.569 57.9445 13.0861 58.8394 13.0861H58.8594C60.2929 13.0861 61.2882 11.829 60.8376 10.6084C59.7881 7.76366 57.3588 5.7006 53.477 5.7006C48.6322 5.7006 45.4503 8.1545 45.4503 12.5388C45.4503 15.8101 47.1188 17.6928 49.2717 19.3289L54.6003 23.4185C56.3763 24.7654 57.13 25.9681 57.13 27.5561C57.13 29.3368 55.9995 30.491 53.9542 30.491C52.2519 30.491 51.1148 29.7634 50.3812 28.2897C49.9711 27.4719 49.1028 26.9246 48.1003 26.9246H47.9662C46.1359 26.9246 44.965 28.6385 45.759 30.1121C47.1583 32.7042 49.8359 34.2977 53.4694 34.2977C58.5825 34.2977 62.088 31.9404 62.088 27.1712C62.1027 23.6163 59.8956 21.4932 57.6823 19.6653Z" fill="black"/>
+</svg>
diff --git a/src/assets/scss/_buttons.scss b/src/assets/scss/_buttons.scss
index 84fb5a756..6f8458fcf 100644
--- a/src/assets/scss/_buttons.scss
+++ b/src/assets/scss/_buttons.scss
@@ -18,7 +18,7 @@
height: 31px;
border: none;
color: $primary-color;
- padding: 3px 16px 3px 16px;
+ padding: 3px 16px;
outline: none;
cursor: pointer;
display: table-cell;
@@ -29,7 +29,7 @@
background: $secondary-color;
height: 40px;
color: $white;
- padding: 4px 37px 4px 37px;
+ padding: 4px 37px;
border-radius: 4px;
outline: none;
border: 1px solid transparent;
@@ -42,3 +42,23 @@
color: $secondary-color;
outline: none;
}
+@mixin btn-grey {
+ border: 1px solid $grey-4;
+ box-sizing: border-box;
+ border-radius: 6px;
+ background: $white;
+ color: $grey-2;
+ cursor: pointer;
+ @include cn-regular-12;
+ line-height: 18px;
+ padding: 8px 15px;
+}
+@mixin btn-red {
+ border-radius: 6px;
+ background: $red-default;
+ color: $white;
+ cursor: pointer;
+ @include cn-regular-12;
+ line-height: 18px;
+ padding: 8px 15px;
+}
diff --git a/src/assets/scss/_color.scss b/src/assets/scss/_color.scss
index ad8ba7e92..63829c4a2 100644
--- a/src/assets/scss/_color.scss
+++ b/src/assets/scss/_color.scss
@@ -17,6 +17,7 @@ $blue-hover: #117083;
$blue-active: #8cb6be;
$red-metro: #d50000;
$red-info: #a00000;
+$red-default: #ed3939;
/* APP COLORS */
$primary-color: $red-metro;
$secondary-color: $blue;
diff --git a/src/assets/scss/_shapes.scss b/src/assets/scss/_shapes.scss
index c85355e0f..d2c8d0472 100644
--- a/src/assets/scss/_shapes.scss
+++ b/src/assets/scss/_shapes.scss
@@ -6,7 +6,6 @@ $input-radius: 4px;
$bouton-width: 12.25em;
$round-bouton-radius: 1.25em;
$round-radius: 50%;
-$footer-height: 60px;
$round-button: 40px;
$simple-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
$mat-tab-shadow: 0px 2px 7px rgba(0, 0, 0, 0.25);
diff --git a/src/assets/scss/_typography.scss b/src/assets/scss/_typography.scss
index e7469954d..5ac70fdc4 100644
--- a/src/assets/scss/_typography.scss
+++ b/src/assets/scss/_typography.scss
@@ -2,6 +2,7 @@ $text-font: 'Trebuchet MS', 'Helvetica', sans-serif;
$footer-text-font: 'Arial', 'Helvetica', sans-serif;
$title-font: 'Trebuchet MS', 'Helvetica', sans-serif;
+$font-size-xxsmall: 0.75em; // 12px
$font-size-xsmall: 0.875em; // 14px
$font-size-small: 1em; // 16px
$font-size-medium: 1.25em; // 20px
@@ -156,6 +157,12 @@ h6,
font-weight: normal;
font-size: $font-size-xsmall;
}
+@mixin cn-regular-12 {
+ font-family: $text-font;
+ font-style: normal;
+ font-weight: normal;
+ font-size: $font-size-xxsmall;
+}
@mixin text-ellipsis {
overflow: hidden;
diff --git a/src/styles.scss b/src/styles.scss
index 76e407a18..fe31c70d7 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -7,6 +7,7 @@
@import 'assets/scss/inputs';
@import 'assets/scss/hyperlink';
@import 'assets/scss/layout';
+@import 'assets/scss/buttons';
@import '../node_modules/leaflet.locatecontrol/dist/L.Control.Locate.css';
html {
@@ -36,6 +37,7 @@ a {
}
&:hover {
text-decoration: underline;
+ outline-color: $blue-hover;
}
&.primary {
@include hyperlink;
@@ -70,7 +72,7 @@ a {
padding: 0 0 30px 0;
}
&.full-screen {
- height: calc(100vh - #{$header-height} - #{$footer-height});
+ min-height: calc(100vh - #{$header-height} - #{$footer-height});
}
@media #{$phone} {
padding-top: 30px;
@@ -92,6 +94,13 @@ a {
}
}
+/** Buttons **/
+button {
+ &:focus {
+ outline-color: $blue-hover;
+ }
+}
+
/** Checkboxes **/
.checkbox {
--
GitLab
From cb2607f6a28ed51ad1d4cf985a0baf8b75329ebf Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Wed, 3 Feb 2021 17:10:50 +0100
Subject: [PATCH 2/3] fix: remove menu-phone component and fix bug
---
src/app/app.module.ts | 2 -
src/app/header/header.component.html | 27 ++++++-
src/app/header/header.component.scss | 74 +++++++++++++++---
src/app/menu-phone/menu-phone.component.html | 37 ---------
src/app/menu-phone/menu-phone.component.scss | 77 -------------------
.../menu-phone/menu-phone.component.spec.ts | 26 -------
src/app/menu-phone/menu-phone.component.ts | 31 --------
src/app/profile/profile.component.html | 2 +-
src/assets/ico/sprite.svg | 8 ++
src/assets/logos/ram_logo.svg | 10 +++
10 files changed, 108 insertions(+), 186 deletions(-)
delete mode 100644 src/app/menu-phone/menu-phone.component.html
delete mode 100644 src/app/menu-phone/menu-phone.component.scss
delete mode 100644 src/app/menu-phone/menu-phone.component.spec.ts
delete mode 100644 src/app/menu-phone/menu-phone.component.ts
create mode 100644 src/assets/logos/ram_logo.svg
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 6f992a733..5edc4cd02 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -19,7 +19,6 @@ import { StructureOpeningStatusComponent } from './structure-list/components/str
import { ModalFilterComponent } from './structure-list/components/modal-filter/modal-filter.component';
import { LegalNoticeComponent } from './legal-notice/legal-notice.component';
import { AboutComponent } from './about/about.component';
-import { MenuPhoneComponent } from './menu-phone/menu-phone.component';
import { FormComponent } from './form/form.component';
import { UserVerificationComponent } from './user-verification/user-verification.component';
import { AuthGuard } from './guards/auth.guard';
@@ -44,7 +43,6 @@ import { AdminGuard } from './guards/admin.guard';
StructureOpeningStatusComponent,
LegalNoticeComponent,
AboutComponent,
- MenuPhoneComponent,
UserVerificationComponent,
ResetEmailComponent,
ResetPasswordComponent,
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
index 26670df24..81feb9cf3 100644
--- a/src/app/header/header.component.html
+++ b/src/app/header/header.component.html
@@ -5,8 +5,8 @@
<p>Réseau des acteurs de l'inclusion numérique de la métropole de Lyon</p>
</div>
</div>
- <div class="containerIconMenu" (click)="openMenu()">
- <span class="ico-menu"></span>
+ <div class="containerIconMenu">
+ <app-svg-icon (click)="openMenu()" [type]="'ico'" [icon]="'menu'" [iconClass]="'icon-32'"></app-svg-icon>
</div>
<div fxLayout="row" class="right-header" fxLayoutAlign="center center" fxLayoutGap="3vw">
<a routerLink="/home" [routerLinkActive]="'active'" i18n>Les acteurs</a>
@@ -22,6 +22,27 @@
<button *ngIf="!isLoggedIn" (click)="isPopUpOpen = !isPopUpOpen">Se connecter</button>
</div>
</div>
-<app-menu-phone *ngIf="showMenu" (closeEvent)="closeMenu($event)"></app-menu-phone>
+<div *ngIf="showMenu" class="mobile-menu" fxLayout="row">
+ <div class="outside" (click)="closeMenu()"></div>
+ <div class="menu-content" fxLayout="column" fxLayoutAlign="space-between">
+ <div>
+ <div class="title" fxLayout="row" fxLayoutAlign="space-between center">
+ <span>Menu</span>
+ <div (click)="closeMenu()" class="ico-close-details"></div>
+ </div>
+ <div fxLayout="column" class="right-header" fxLayoutAlign="none baseline" fxLayoutGap="5vw">
+ <a routerLink="/home" [routerLinkActive]="'active'" (click)="closeMenu()" i18n>Les acteurs</a>
+ <a *ngIf="isAdmin" routerLink="/admin" [routerLinkActive]="'active'">Administration</a>
+ </div>
+ </div>
+ <div>
+ <button *ngIf="isLoggedIn" class="red" routerLink="/profile" [routerLinkActive]="'active'" (click)="closeMenu()">
+ {{ displayName }}
+ </button>
+ <button *ngIf="!isLoggedIn" (click)="isPopUpOpen = !isPopUpOpen; closeMenu()">Se connecter</button>
+ </div>
+ </div>
+</div>
+
<app-signup-modal *ngIf="displaySignUp" [openned]="isPopUpOpen" (closed)="closeSignUpModal($event)"></app-signup-modal>
<app-signin-modal *ngIf="!displaySignUp" [openned]="isPopUpOpen" (closed)="closeSignInModal()"></app-signin-modal>
diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss
index 67a3956d4..c6d868299 100644
--- a/src/app/header/header.component.scss
+++ b/src/app/header/header.component.scss
@@ -5,6 +5,7 @@
@import '../../assets/scss/breakpoint';
@import '../../assets/scss/shapes';
@import '../../assets/scss/buttons';
+@import '../../assets/scss/z-index';
.header {
height: $header-height;
@@ -14,15 +15,6 @@
border-bottom: solid 1px $grey-4;
background-color: $white;
padding: 0 20px;
- a {
- color: $grey-2;
- &.active {
- font-weight: bold;
- color: $grey-1;
- border-bottom: 2px solid $red-default;
- text-decoration: none;
- }
- }
.right-header {
@media #{$tablet} {
display: none !important;
@@ -52,6 +44,16 @@ button {
}
}
+a {
+ color: $grey-2;
+ &.active {
+ font-weight: bold;
+ color: $grey-1;
+ border-bottom: 2px solid $red-default;
+ text-decoration: none;
+ }
+}
+
@media print {
div {
display: none !important;
@@ -71,3 +73,57 @@ button {
display: none !important;
}
}
+
+@keyframes slideMenu {
+ from {
+ width: 0;
+ }
+ to {
+ width: 100%;
+ }
+}
+@keyframes background-fade {
+ 0% {
+ background: none;
+ }
+ 100% {
+ background: none;
+ }
+}
+.mobile-menu {
+ position: fixed;
+ top: 0;
+ right: 0;
+ width: 100%;
+ height: 100%;
+ z-index: $menu-phone-z-index;
+ animation: slideMenu 0.5s;
+ .menu-content {
+ background-color: $white;
+ height: 100vh;
+ width: 350px;
+ padding: 27px 25px;
+ }
+ .outside {
+ width: calc(100% - 350px);
+ height: 100vh;
+ opacity: 0.65;
+ animation: background-fade 0.1s;
+ background-color: $black;
+ }
+}
+.title {
+ margin-bottom: 35px;
+ @include cn-regular-28;
+ span {
+ color: $grey-2;
+ }
+}
+.footer {
+ a {
+ height: unset;
+ display: table-cell;
+ vertical-align: middle;
+ margin: auto 0 auto 0;
+ }
+}
diff --git a/src/app/menu-phone/menu-phone.component.html b/src/app/menu-phone/menu-phone.component.html
deleted file mode 100644
index b473206e4..000000000
--- a/src/app/menu-phone/menu-phone.component.html
+++ /dev/null
@@ -1,37 +0,0 @@
-<div class="containerMenu" fxLayout="row">
- <div class="outside" (click)="closeMenu()"></div>
- <div class="contentMenu" fxLayout="column" fxLayoutAlign="space-between">
- <div>
- <div class="titleFilter" fxLayout="row" fxLayoutAlign="space-between center">
- <span>Menu</span>
- <div (click)="closeMenu()" class="ico-close-details"></div>
- </div>
- <div fxLayout="column" class="right-header" fxLayoutAlign="none baseline" fxLayoutGap="5vw">
- <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 *ngIf="isAdmin" routerLink="/admin" [routerLinkActive]="'active'">Administration</a>
- <!--<a routerLink="/login" [routerLinkActive]="'active'" i18n><span class="clickable ico-mglass purple"></span></a>
- <a routerLink="/home" [routerLinkActive]="'active'" i18n
- ><span class="ico-profile" fxLayout="column" fxLayoutAlign="center center">
- <span class="head"></span>
- <span class="body"></span> </span
- ></a> -->
- <button
- *ngIf="isLoggedIn"
- class="red"
- routerLink="/profile"
- [routerLinkActive]="'active'"
- (click)="closeMenu()"
- >
- {{ displayName }}
- </button>
- <button *ngIf="!isLoggedIn" (click)="isPopUpOpen = !isPopUpOpen; closeMenu()">Se connecter</button>
- </div>
- </div>
- <!--<div class="footer" fxLayout="row" fxLayoutGap="1.5vh">
- <app-svg-icon [type]="'ico'" [iconClass]="'icon-32'" [icon]="'user'" [iconColor]="'currentColor'"></app-svg-icon>
- <a>Mon compte</a>
- </div>-->
- </div>
-</div>
diff --git a/src/app/menu-phone/menu-phone.component.scss b/src/app/menu-phone/menu-phone.component.scss
deleted file mode 100644
index 21f6d72cc..000000000
--- a/src/app/menu-phone/menu-phone.component.scss
+++ /dev/null
@@ -1,77 +0,0 @@
-@import '../../assets/scss/color';
-@import '../../assets/scss/z-index';
-@import '../../assets/scss/typography';
-@import '../../assets/scss/breakpoint';
-@import '../../assets/scss/buttons';
-
-@keyframes slideMenu {
- from {
- width: 0;
- }
- to {
- width: 100%;
- }
-}
-@keyframes background-fade {
- 0% {
- background: none;
- }
- 100% {
- background: none;
- }
-}
-.containerMenu {
- position: fixed;
- top: 0;
- right: 0;
- width: 100%;
- height: 100%;
- z-index: $menu-phone-z-index;
- animation: slideMenu 0.5s;
- .contentMenu {
- background-color: $white;
- height: 100vh;
- width: 350px;
- padding: 27px 25px;
- }
- .outside {
- width: calc(100% - 350px);
- height: 100vh;
- opacity: 0.65;
- animation: background-fade 0.1s;
- background-color: $black;
- }
-}
-.titleFilter {
- margin-bottom: 35px;
- @include cn-regular-28;
- span {
- color: $grey-2;
- }
-}
-.footer {
- a {
- height: unset;
- display: table-cell;
- vertical-align: middle;
- margin: auto 0 auto 0;
- }
-}
-
-a {
- color: $grey-2;
- &.active {
- font-weight: bold;
- color: $grey-1;
- border-bottom: 2px solid $red-default;
- text-decoration: none;
- }
-}
-
-button {
- @include btn-grey;
- &.red {
- @include btn-red;
- border: none;
- }
-}
diff --git a/src/app/menu-phone/menu-phone.component.spec.ts b/src/app/menu-phone/menu-phone.component.spec.ts
deleted file mode 100644
index 718d9c841..000000000
--- a/src/app/menu-phone/menu-phone.component.spec.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { RouterTestingModule } from '@angular/router/testing';
-
-import { MenuPhoneComponent } from './menu-phone.component';
-
-describe('HeaderComponent', () => {
- let component: MenuPhoneComponent;
- let fixture: ComponentFixture<MenuPhoneComponent>;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- imports: [RouterTestingModule],
- declarations: [MenuPhoneComponent],
- }).compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(MenuPhoneComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
diff --git a/src/app/menu-phone/menu-phone.component.ts b/src/app/menu-phone/menu-phone.component.ts
deleted file mode 100644
index b9c375e93..000000000
--- a/src/app/menu-phone/menu-phone.component.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import { Component, EventEmitter, OnInit, Output } from '@angular/core';
-import { ProfileService } from '../profile/services/profile.service';
-import { AuthService } from '../services/auth.service';
-
-@Component({
- selector: 'app-menu-phone',
- templateUrl: './menu-phone.component.html',
- styleUrls: ['./menu-phone.component.scss'],
-})
-export class MenuPhoneComponent implements OnInit {
- constructor(private authService: AuthService, private profileService: ProfileService) {}
-
- @Output() closeEvent = new EventEmitter();
- ngOnInit(): void {}
-
- closeMenu(): void {
- this.closeEvent.emit();
- }
-
- public get isLoggedIn(): boolean {
- return this.authService.isLoggedIn();
- }
-
- public get isAdmin(): boolean {
- return this.profileService.isAdmin();
- }
-
- public get displayName(): string {
- return this.authService.getUsernameDisplay();
- }
-}
diff --git a/src/app/profile/profile.component.html b/src/app/profile/profile.component.html
index 4bb888233..a26b3822a 100644
--- a/src/app/profile/profile.component.html
+++ b/src/app/profile/profile.component.html
@@ -4,7 +4,7 @@
<div *ngIf="userProfile" fxLayout="column" fxLayoutAlign="center" fxLayoutGap="10px">
<p>Id: {{ userProfile._id }}</p>
<p>Email: {{ userProfile.email }}</p>
- <button (click)="logout()">Logout</button>
+ <button (click)="logout()">Se déconnecter</button>
<p fxLayout="column" *ngIf="userProfile.structuresLink.length > 0">
Mes structures :
<span *ngFor="let structureId of userProfile.structuresLink">
diff --git a/src/assets/ico/sprite.svg b/src/assets/ico/sprite.svg
index 342b08c58..5a89acce0 100644
--- a/src/assets/ico/sprite.svg
+++ b/src/assets/ico/sprite.svg
@@ -96,6 +96,14 @@
<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="menu" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="5" y="9" width="23" height="2" rx="1" fill="#333333"/>
+<rect x="5" y="15" width="23" height="2" rx="1" fill="#333333"/>
+<rect x="5" y="21" width="23" height="2" rx="1" fill="#333333"/>
+</symbol>
+
+
<symbol id="calendar" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
<path d="M8 10H5V13H8V10Z" fill="#333333"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M6 2C5.44772 2 5 2.44772 5 3V4H3C2.44772 4 2 4.44772 2 5V19C2 19.5523 2.44772 20 3 20H19C19.5523 20 20 19.5523 20 19V5C20 4.44772 19.5523 4 19 4H17V3C17 2.44772 16.5523 2 16 2C15.4477 2 15 2.44772 15 3V4H7V3C7 2.44772 6.55229 2 6 2ZM4 9V18H18V9H4Z" fill="#333333"/>
diff --git a/src/assets/logos/ram_logo.svg b/src/assets/logos/ram_logo.svg
new file mode 100644
index 000000000..48c8f1d64
--- /dev/null
+++ b/src/assets/logos/ram_logo.svg
@@ -0,0 +1,10 @@
+<svg width="121" height="29" viewBox="0 0 121 29" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M54 27.5C54 26.6716 54.6716 26 55.5 26H67.5C68.3284 26 69 26.6716 69 27.5V27.5C69 28.3284 68.3284 29 67.5 29H55.5C54.6716 29 54 28.3284 54 27.5V27.5Z" fill="#ED3939"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M71 8H74V8.80269C74.8825 8.29218 75.9071 8 77 8C80.3137 8 83 10.6863 83 14V27.5C83 28.3284 82.3284 29 81.5 29C80.6716 29 80 28.3284 80 27.5V14C80 12.3431 78.6569 11 77 11C75.3431 11 74 12.3431 74 14V22V27.5C74 28.3284 73.3284 29 72.5 29C71.6716 29 71 28.3284 71 27.5V22V14V8Z" fill="#4F4F4F"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M103 8H100V14V22V27.5C100 28.3284 100.672 29 101.5 29C102.328 29 103 28.3284 103 27.5V22V14C103 12.3431 104.343 11 106 11C107.657 11 109 12.3431 109 14V27.5C109 28.3284 109.672 29 110.5 29C111.328 29 112 28.3284 112 27.5V14C112 12.3431 113.343 11 115 11C116.657 11 118 12.3431 118 14V27.5C118 28.3284 118.672 29 119.5 29C120.328 29 121 28.3284 121 27.5V14C121 10.6863 118.314 8 115 8C113.208 8 111.599 8.78563 110.5 10.0313C109.401 8.78563 107.792 8 106 8C104.907 8 103.883 8.29218 103 8.80269V8Z" fill="#4F4F4F"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M85.5 23C85.5 26.3137 88.1863 29 91.5 29C94.8137 29 97.5 26.3137 97.5 23V9.5C97.5 8.67157 96.8284 8 96 8C95.1716 8 94.5 8.67157 94.5 9.5V23C94.5 24.6569 93.1569 26 91.5 26C89.8431 26 88.5 24.6569 88.5 23V9.5C88.5 8.67157 87.8284 8 87 8C86.1716 8 85.5 8.67157 85.5 9.5V23Z" fill="#4F4F4F"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M34 11C32.3115 11 30.5 12.747 30.5 15.5C30.5 16.3284 31.1716 17 32 17H34.75C37.2353 17 39.25 19.0147 39.25 21.5H39.2268C39.2268 25.3744 36.5611 29 32.7268 29C30.6938 29 28.9456 27.9361 27.7976 26.3968C27.3023 25.7327 27.4391 24.7929 28.1032 24.2976C28.7672 23.8023 29.7071 23.9391 30.2024 24.6032C30.8854 25.5189 31.7982 26 32.7268 26C34.4154 26 36.2268 24.253 36.2268 21.5C36.2268 21.4365 36.2308 21.374 36.2384 21.3126C36.1462 20.5726 35.515 20 34.75 20H32C29.5147 20 27.5 17.9853 27.5 15.5C27.5 11.6256 30.1657 8 34 8C36.0331 8 37.7812 9.06393 38.9292 10.6032C39.4245 11.2673 39.2877 12.2071 38.6237 12.7024C37.9596 13.1977 37.0198 13.0609 36.5245 12.3968C35.8415 11.4811 34.9286 11 34 11Z" fill="#4F4F4F"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3 3H6C7.65685 3 9 4.34315 9 6V13C9 14.6569 7.65685 16 6 16H4.5H3V3ZM0 17.5V0H6C9.31371 0 12 2.68629 12 6V13C12 15.0173 11.0044 16.8022 9.47774 17.8899C11.025 19.2638 12 21.268 12 23.5V27.5C12 28.3284 11.3284 29 10.5 29C9.67157 29 9 28.3284 9 27.5V23.5C9 21.0147 6.98528 19 4.5 19H3V27.5C3 28.3284 2.32843 29 1.5 29C0.671573 29 0 28.3284 0 27.5V19V17.5Z" fill="#4F4F4F"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M50 23V14C50 12.3431 48.6569 11 47 11C45.3431 11 44 12.3431 44 14V23C44 24.6569 45.3431 26 47 26C48.6569 26 50 24.6569 50 23ZM47 8C43.6863 8 41 10.6863 41 14V23C41 26.3137 43.6863 29 47 29C50.3137 29 53 26.3137 53 23V14C53 10.6863 50.3137 8 47 8Z" fill="#4F4F4F"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M23 14V14.5C23 16.1569 21.6569 17.5 20 17.5H18C17.4477 17.5 17 17.0523 17 16.5V14.5V14C17 12.3431 18.3431 11 20 11C21.6569 11 23 12.3431 23 14ZM17 20.374C17.3196 20.4562 17.6547 20.5 18 20.5H20C23.3137 20.5 26 17.8137 26 14.5V14C26 10.6863 23.3137 8 20 8C16.6863 8 14 10.6863 14 14V14.5V16.5V23.5C14 26.5376 16.4624 29 19.5 29H24C24.8284 29 25.5 28.3284 25.5 27.5C25.5 26.6716 24.8284 26 24 26H19.5C18.1193 26 17 24.8807 17 23.5V20.374Z" fill="#4F4F4F"/>
+</svg>
--
GitLab
From 66ca00f332fffdda2115ee050bb834a1821105ea Mon Sep 17 00:00:00 2001
From: Hugo SUBTIL <ext.sopra.husubtil@grandlyon.com>
Date: Wed, 3 Feb 2021 17:12:57 +0100
Subject: [PATCH 3/3] fix: remove locate button on search
---
.../structure-list/components/search/search.component.html | 2 --
.../structure-list/components/search/search.component.scss | 6 ------
2 files changed, 8 deletions(-)
diff --git a/src/app/structure-list/components/search/search.component.html b/src/app/structure-list/components/search/search.component.html
index b1538490b..c1546791d 100644
--- a/src/app/structure-list/components/search/search.component.html
+++ b/src/app/structure-list/components/search/search.component.html
@@ -13,8 +13,6 @@
<div class="inputSection" fxLayout="row" fxLayoutAlign="space-between center">
<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>
</div>
<app-button
class="isntPhoneContent"
diff --git a/src/app/structure-list/components/search/search.component.scss b/src/app/structure-list/components/search/search.component.scss
index 5afee7a7d..bd9fbd745 100644
--- a/src/app/structure-list/components/search/search.component.scss
+++ b/src/app/structure-list/components/search/search.component.scss
@@ -21,12 +21,6 @@
@include input-search;
}
.searchSection {
- .separator {
- height: 100%;
- width: 2px;
- background-color: $grey-4;
- margin: 0 5px 0 5px;
- }
.inputSection {
padding: 6px 3px 6px 6px;
width: 100%;
--
GitLab