From 1a8d01079da4a5610443a0537dbf4667d61b9ef0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=A9mie=20BRISON?=
<ext.sopra.jbrison@grandlyon.com>
Date: Tue, 24 Nov 2020 14:16:08 +0100
Subject: [PATCH] fix: typo, alignements and others
---
src/app/header/header.component.html | 4 ++--
.../components/card/card.component.html | 10 ++++------
.../components/card/card.component.scss | 2 ++
.../modal-filter/modal-filter.component.scss | 2 +-
.../components/search/search.component.html | 4 ++--
.../components/search/search.component.scss | 2 +-
.../structure-details.component.html | 14 ++++++++++----
.../structure-details.component.ts | 7 +++++++
src/styles.scss | 1 -
9 files changed, 29 insertions(+), 17 deletions(-)
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
index 045aa764b..600d0e766 100644
--- a/src/app/header/header.component.html
+++ b/src/app/header/header.component.html
@@ -3,13 +3,13 @@
<div fxLayout="row">
<!-- <img class="logo-grand-lyon" src="/assets/logos/ram_logo.svg" alt /> -->
<div fxLayout="column" fxLayoutAlign="center">
- <p>Réseau des Acteurs de la Médiation</p>
+ <p>Réseau des Acteurs de la Médiation Numérique</p>
<p>de la Métropole de Lyon</p>
</div>
</div>
</div>
<div fxLayout="row" class="right-header" fxLayoutAlign="center center" fxLayoutGap="3vw">
- <a routerLink="/home" [routerLinkActive]="'active'" i18n>Acteurs de la médiation</a>
+ <a routerLink="/home" [routerLinkActive]="'active'" i18n>Acteurs de la médiation numérique</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/structure-list/components/card/card.component.html b/src/app/structure-list/components/card/card.component.html
index 4848aad29..8bedea0fb 100644
--- a/src/app/structure-list/components/card/card.component.html
+++ b/src/app/structure-list/components/card/card.component.html
@@ -1,14 +1,11 @@
<div class="structure" fxLayout="column" (click)="cardClicked()" (mouseover)="cardHover()">
- <span class="nomStructure">{{ structure.nomDeVotreStructure }}</span>
-
- <div class="headerStructure" fxLayout="row" fxLayoutAlign="space-between center">
- <span class="typeStructure">{{ structure.typeDeStructure }}</span>
-
+ <div class="headerStructure" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
+ <span class="nomStructure">{{ structure.nomDeVotreStructure }}</span>
<div
*ngIf="structure.distance"
class="distanceStructure"
fxLayout="row"
- fxLayoutAlign="center center"
+ fxLayoutAlign="end center"
fxLayoutGap="20px"
>
<div fxLayout="row" fxLayoutAlign="center center">
@@ -19,6 +16,7 @@
</div>
</div>
</div>
+ <span class="typeStructure">{{ structure.typeDeStructure }}</span>
<br />
<app-structure-opening-status [structure]="structure"></app-structure-opening-status>
</div>
diff --git a/src/app/structure-list/components/card/card.component.scss b/src/app/structure-list/components/card/card.component.scss
index aefdd8ed8..47ca330e6 100644
--- a/src/app/structure-list/components/card/card.component.scss
+++ b/src/app/structure-list/components/card/card.component.scss
@@ -31,10 +31,12 @@
color: $grey-1;
@include cn-bold-20;
padding-bottom: 5px;
+ width: 100%;
}
.distanceStructure {
@include cn-regular-16;
color: $grey-1;
+ width: 50%;
}
&:last-child {
border-bottom: none;
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 96e21d4c8..e33b41fe5 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
@@ -72,7 +72,7 @@
}
}
.ligneFiltre {
- padding: 0 5px;
+ padding: 5px;
}
h4 {
@include cn-bold-14;
diff --git a/src/app/structure-list/components/search/search.component.html b/src/app/structure-list/components/search/search.component.html
index 35639e453..197c25733 100644
--- a/src/app/structure-list/components/search/search.component.html
+++ b/src/app/structure-list/components/search/search.component.html
@@ -6,7 +6,7 @@
<form
[formGroup]="searchForm"
fxLayout="row"
- fxLayoutGap="1.5vw"
+ fxLayoutGap="16px"
fxLayoutAlign=" center"
(ngSubmit)="applyFilter(searchForm.value.searchTerm)"
>
@@ -20,7 +20,7 @@
</form>
</div>
<div (clickOutside)="closeModal()">
- <div class="btnSection" fxLayout="row" fxLayoutAlign="space-between center">
+ <div class="btnSection" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
<button
class="btn-filter"
type="button"
diff --git a/src/app/structure-list/components/search/search.component.scss b/src/app/structure-list/components/search/search.component.scss
index 1c2a86a42..af7bfa1ad 100644
--- a/src/app/structure-list/components/search/search.component.scss
+++ b/src/app/structure-list/components/search/search.component.scss
@@ -39,7 +39,7 @@
button {
background: $white;
height: 40px;
- width: 190px;
+ width: 100%;
border: 1px solid $grey-4;
padding: 3px 16px 3px 16px;
outline: none;
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 c81d453cb..3d2d9253f 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
@@ -48,7 +48,7 @@
</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.derniereModification | date: 'shortDate' }}</p>
+ <p>Mise-Ã -jour le {{ structure.derniereModification | date: 'mediumDate' }}</p>
</div>
</div>
</div>
@@ -73,17 +73,23 @@
</div>
</div>
<!-- Services -->
- <div fxLayout="column" class="structrue-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="20px">
+ <div
+ *ngIf="isBaseSkills() || isAccessRights()"
+ fxLayout="column"
+ class="structrue-details-block"
+ fxLayoutAlign="baseline baseline"
+ fxLayoutGap="20px"
+ >
<div fxLayout="row" fxLayoutAlign="none flex-end" fxLayoutGap="20px">
<app-svg-icon [type]="'ico'" [icon]="'services'" [iconClass]="'icon-32'"></app-svg-icon>
<h2>Services</h2>
</div>
<div fxLayout="row" class="w-100">
- <div fxFlex="50%" *ngIf="baseSkills && baseSkills[0] !== undefined">
+ <div fxFlex="50%" *ngIf="isBaseSkills()">
<h3 class="subtitle">Compétences de base</h3>
<p *ngFor="let skill of baseSkills">{{ skill.text }}</p>
</div>
- <div fxFlex="50%" *ngIf="accessRights && accessRights[0] !== undefined">
+ <div fxFlex="50%" *ngIf="isAccessRights()">
<h3 class="subtitle">Accès au droits</h3>
<p *ngFor="let rights of accessRights">{{ rights.text }}</p>
</div>
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 995d148ac..825eb64bd 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
@@ -81,4 +81,11 @@ export class StructureDetailsComponent implements OnInit {
}
public keepOriginalOrder = (a, b) => a.key;
+
+ public isBaseSkills(): boolean {
+ return this.baseSkills && this.baseSkills[0] !== undefined;
+ }
+ public isAccessRights(): boolean {
+ return this.accessRights && this.accessRights[0] !== undefined;
+ }
}
diff --git a/src/styles.scss b/src/styles.scss
index 2d6db92a4..5cd277a87 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -88,7 +88,6 @@ a {
}
}
label {
- align-items: center;
grid-template-columns: min-content auto;
display: inline-grid;
cursor: pointer;
--
GitLab