diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index 9b85e5e1b9a7b32d1d1860bf83368e27910561fc..b8a27b65e0260fe2bd65a2d575b8af3506c09d3e 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -88,7 +88,7 @@ const routes: Routes = [
canDeactivate: [DeactivateGuard],
},
{
- path: 'posts',
+ path: 'news',
loadChildren: () => import('./post/post.module').then((m) => m.PostModule),
},
{
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index ba93e485c8a2f372dc765459109e4740bb14a29d..f6a2d3edfa97ff90f40610254e9685406ff05517 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -7,6 +7,11 @@
flex-direction: column;
}
+@media print {
+ .app-body {
+ height: 100% !important;
+ }
+}
.app-body {
flex: 1 1 auto;
overflow-y: auto;
diff --git a/src/app/form/form.component.html b/src/app/form/form.component.html
index a3d85c2a6c444ba89b0008442c29479f0b66a29b..46b374e8754b7dd64adab067332bdfe1761e0ee6 100644
--- a/src/app/form/form.component.html
+++ b/src/app/form/form.component.html
@@ -331,7 +331,7 @@
</div>
<div *ngIf="currentPage == pageTypeEnum.structurePhone" class="page">
<div class="title">
- <h3>Quel numéro appelé pour joindre votre structure ?</h3>
+ <h3>Quel numéro appeler pour joindre votre structure ?</h3>
</div>
<div class="form-group" fxLayout="column">
<label for="contactPhone">Téléphone de la structure</label>
@@ -1151,6 +1151,7 @@
*ngIf="currentPage == nbPagesForm && profile"
class="btn-primary unique"
routerLink="/home"
+ [queryParams]="{ id: createdStructure._id }"
[state]="{ data: createdStructure }"
>
Voir ma structure
@@ -1193,6 +1194,7 @@
*ngIf="currentPage == nbPagesForm && profile"
class="btn-primary unique"
routerLink="/home"
+ [queryParams]="{ id: createdStructure._id }"
[state]="{ data: createdStructure }"
>
Voir ma structure
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
index 9d31ad373f001e665fc94c0dd52a5943ca6c0b4e..7fc0ea9a68139de58d4d68c2c85c34288b4ec9f3 100644
--- a/src/app/header/header.component.html
+++ b/src/app/header/header.component.html
@@ -9,14 +9,10 @@
<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>
+ <a routerLink="/news" [routerLinkActive]="'active'" i18n>Actualités</a>
+ <a routerLink="/home" [routerLinkActive]="'active'" i18n>Cartographie de acteurs</a>
<a routerLink="/about" [routerLinkActive]="'active'" i18n>Qui sommes-nous ?</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">
- <app-svg-icon [type]="'ico'" [iconClass]="'icon-32'" [icon]="'user'" [iconColor]="'currentColor'"></app-svg-icon>
- </a> -->
<button *ngIf="isLoggedIn" class="red" routerLink="/profile" [routerLinkActive]="'active'">
{{ displayName }}
</button>
@@ -32,7 +28,8 @@
<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="/news" [routerLinkActive]="'active'" (click)="closeMenu()" i18n>Actualités</a>
+ <a routerLink="/home" [routerLinkActive]="'active'" (click)="closeMenu()" i18n>Cartographie de acteurs</a>
<a routerLink="/about" [routerLinkActive]="'active'" i18n>Qui sommes-nous ?</a>
<a *ngIf="isAdmin" routerLink="/admin" [routerLinkActive]="'active'" (click)="closeMenu()">Administration</a>
</div>
@@ -47,7 +44,6 @@
</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> -->
<ng-template #customTitle>
<img class="desktop-show logo-grand-lyon" src="/assets/logos/resin.svg" alt />
diff --git a/src/app/header/header.component.scss b/src/app/header/header.component.scss
index 8369791d6b97afa68908f614481edc4f8e6f8fdf..6a991d53b94f128faca52e2aa178ae1258504d87 100644
--- a/src/app/header/header.component.scss
+++ b/src/app/header/header.component.scss
@@ -41,6 +41,11 @@ button {
&.red {
@include btn-red;
border: none;
+ // user name ellipsis handling
+ white-space: nowrap;
+ width: 100px;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
}
diff --git a/src/app/post/components/post-card/post-card.component.ts b/src/app/post/components/post-card/post-card.component.ts
index e97a5fe74994a03a6177ba277cdaa57496c41d95..78970f17fde1248ad7c9604de683217b361ce432 100644
--- a/src/app/post/components/post-card/post-card.component.ts
+++ b/src/app/post/components/post-card/post-card.component.ts
@@ -16,6 +16,6 @@ export class PostCardComponent implements OnInit {
ngOnInit(): void {}
public showDetails(post: Post): void {
- this.router.navigateByUrl('posts/details/' + post.id, { state: { data: post } });
+ this.router.navigateByUrl('news/details/' + post.id, { state: { data: post } });
}
}
diff --git a/src/app/post/components/post-details/post-details.component.ts b/src/app/post/components/post-details/post-details.component.ts
index 31f7b0f6264140035968c940b6f111293cf409a8..797763328a00fcac9c3ca4decdd414ea0573b935 100644
--- a/src/app/post/components/post-details/post-details.component.ts
+++ b/src/app/post/components/post-details/post-details.component.ts
@@ -31,6 +31,6 @@ export class PostDetailsComponent implements OnInit {
}
public backToPosts(): void {
- this.router.navigateByUrl('/posts');
+ this.router.navigateByUrl('/news');
}
}
diff --git a/src/app/post/components/post-header/post-header.component.html b/src/app/post/components/post-header/post-header.component.html
index 6d9a4faabbac6b5578463cf7364c21fd7670cd5c..6b48f6d33f96eba0e3c0870fda0c0386008b31d0 100644
--- a/src/app/post/components/post-header/post-header.component.html
+++ b/src/app/post/components/post-header/post-header.component.html
@@ -1 +1,75 @@
-<div class="header-container">post-header works!</div>
+<div class="header-container">
+ <div class="section-container" fxLayout="column" fxLayoutAlign="space-between">
+ <h1>Actualités</h1>
+ <div fxLayout="row" fxLayoutGap="5px" fxLayoutAlign="space-between flex-end" class="overflow">
+ <div fxLayout="row" class="row-mobile">
+ <div fxLayout="row" fxLayoutAlign="center center" *ngFor="let tag of tags.others">
+ <span
+ class="tag-button"
+ tabindex="0"
+ (click)="activateTag(tag)"
+ (keydown.enter)="activateTag(tag)"
+ [ngClass]="{ active: tag.slug === mainActiveTag.slug }"
+ >{{ tag.name }}</span
+ >
+ </div>
+ </div>
+ <div
+ class="btnSection"
+ fxLayout="row"
+ fxLayoutAlign="space-between center"
+ fxLayoutGap="16px"
+ (clickOutside)="closeModal()"
+ >
+ <button
+ type="button"
+ fxLayout="row"
+ [ngClass]="{
+ selected: modalTypeOpened === TypeModal.public,
+ containCheckedFilters: checkedPublicTags.length > 0
+ }"
+ fxLayoutAlign="space-between center"
+ (click)="openModal(TypeModal.public)"
+ >
+ <span class="text">Tout public</span>
+ <app-svg-icon
+ class="icon"
+ [type]="'ico'"
+ [iconClass]="modalTypeOpened === TypeModal.public ? 'white' : 'grey-1'"
+ [icon]="'news-public'"
+ ></app-svg-icon>
+ <div class="arrow"></div>
+ </button>
+ <button
+ class="btn-filter-no-margin"
+ type="button"
+ fxLayout="row"
+ [ngClass]="{
+ selected: modalTypeOpened === TypeModal.location,
+ containCheckedFilters: checkedLocationTags.length > 0
+ }"
+ fxLayoutAlign="space-between center"
+ (click)="openModal(TypeModal.location)"
+ >
+ <span class="text">Toutes les communes</span>
+ <app-svg-icon
+ class="icon"
+ [type]="'ico'"
+ [iconClass]="modalTypeOpened === TypeModal.location ? 'white' : 'grey-1'"
+ [icon]="'news-location'"
+ ></app-svg-icon>
+ <div class="arrow"></div>
+ </button>
+ <div *ngIf="modalTypeOpened">
+ <app-post-modal-filters
+ [modalType]="modalTypeOpened"
+ [tags]="getModalData()"
+ [inputCheckedTags]="getCheckedModalData()"
+ (searchEvent)="filter($event)"
+ (closeEvent)="closeModal()"
+ ></app-post-modal-filters>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
diff --git a/src/app/post/components/post-header/post-header.component.scss b/src/app/post/components/post-header/post-header.component.scss
index 526d1120163fd06547a46203cf6394a4c9ca09b5..46d4f71b12decf8b428f60d42a2a2b7c3be01021 100644
--- a/src/app/post/components/post-header/post-header.component.scss
+++ b/src/app/post/components/post-header/post-header.component.scss
@@ -1,7 +1,157 @@
@import '../../../../assets/scss/color';
+@import '../../../../assets/scss/buttons';
+@import '../../../../assets/scss/typography';
+@import '../../../../assets/scss/breakpoint';
@import '../../../../assets/scss/layout';
+h1 {
+ margin-bottom: 0px;
+}
+
.header-container {
height: #{$header-post-height};
background: $white;
}
+
+.section-container {
+ height: 100%;
+}
+
+.btnSection {
+ padding: 16px 0 0px 0;
+ button {
+ background: $white;
+ height: 40px;
+ width: 100%;
+ border: 1px solid $grey-4;
+ padding: 3px 16px 3px 16px;
+ outline: none;
+ border-radius: 4px;
+ cursor: pointer;
+ white-space: nowrap;
+ @include btn-normal;
+ .arrow {
+ background-color: transparent;
+ border-bottom: 1px solid $grey-2;
+ border-right: 1px solid $grey-2;
+ transform: translateY(-25%) rotate(45deg);
+ margin: 0 5px 0 10px;
+ height: 7px;
+ width: 7px;
+ }
+ &:focus {
+ border-color: $blue-hover;
+ }
+ }
+ .selected {
+ background-color: $secondary-color;
+ border-color: $secondary-color !important;
+ color: $white;
+ .arrow {
+ background-color: transparent;
+ border-bottom: 1px solid $white;
+ border-right: 1px solid $white;
+ transform: translateY(25%) rotate(-135deg);
+ margin: 0 5px 0 10px;
+ height: 7px;
+ width: 7px;
+ }
+ }
+ .containCheckedFilters {
+ border-color: $secondary-color;
+ }
+ .icon {
+ display: none !important;
+ }
+ @media #{$desktop} {
+ button {
+ width: 90px;
+ }
+ .text {
+ display: none !important;
+ }
+ .icon {
+ display: inherit !important;
+ }
+ }
+ @media #{$tablet} {
+ button {
+ display: none !important;
+ }
+ }
+}
+
+// .btnSection {
+// padding: 16px 0 0px 0;
+// button {
+// background: $white;
+// height: 40px;
+// width: 210px;
+// border: 1px solid $grey-4;
+// padding: 3px 16px 3px 16px;
+// outline: none;
+// border-radius: 4px;
+// cursor: pointer;
+// white-space: nowrap;
+// @include btn-normal;
+// .arrow {
+// background-color: transparent;
+// border-bottom: 1px solid $grey-2;
+// border-right: 1px solid $grey-2;
+// transform: translateY(-25%) rotate(45deg);
+// margin: 0 5px 0 10px;
+// height: 7px;
+// width: 7px;
+// }
+// &:focus {
+// border-color: $blue-hover;
+// }
+// }
+// .selected {
+// border-color: $primary-color !important;
+// color: inherit;
+// .arrow {
+// background-color: transparent;
+// border-bottom: 1px solid $primary-color;
+// border-right: 1px solid $primary-color;
+// transform: translateY(25%) rotate(-135deg);
+// margin: 0 5px 0 10px;
+// height: 7px;
+// width: 7px;
+// }
+// }
+// .containCheckedFilters {
+// border-color: $secondary-color;
+// }
+// }
+
+.tag-button {
+ padding: 8px 10px;
+ @include cn-regular-16;
+ cursor: pointer;
+ white-space: nowrap;
+ &.active {
+ background-color: $secondary-color;
+ color: $white;
+ }
+ &:focus {
+ outline-color: $secondary-color;
+ }
+}
+
+// Remove margin right on filter pop-up trigger
+.btn-filter-no-margin {
+ margin-right: 0 !important;
+}
+
+.row-mobile {
+ @media #{$tablet} {
+ width: 100%;
+ justify-content: space-between;
+ }
+}
+.overflow {
+ @media #{$tablet} {
+ overflow-y: scroll;
+ }
+}
diff --git a/src/app/post/components/post-header/post-header.component.ts b/src/app/post/components/post-header/post-header.component.ts
index 4927d262b6ce2a9499bd42389d73b44c654b0f6b..1cbc7f338536e9de749a7068acd5bf95a0bb0bd9 100644
--- a/src/app/post/components/post-header/post-header.component.ts
+++ b/src/app/post/components/post-header/post-header.component.ts
@@ -1,15 +1,106 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, EventEmitter, OnInit, Output } from '@angular/core';
+import { Tag } from '../../models/tag.model';
+import { TagWithMeta } from '../../models/tagWithMeta.model';
+import * as _ from 'lodash';
+import { TypeModalNews } from '../../enum/typeModalNews.enum';
+import { ActivatedRoute, Router } from '@angular/router';
+import { TagEnum } from '../../enum/tag.enum';
+import { parseSlugToTag } from '../utils/NewsUtils';
@Component({
selector: 'app-post-header',
templateUrl: './post-header.component.html',
- styleUrls: ['./post-header.component.scss']
+ styleUrls: ['./post-header.component.scss'],
})
export class PostHeaderComponent implements OnInit {
+ public modalTypeOpened: TypeModalNews;
+ public tags: TagWithMeta;
+ public mainActiveTag: Tag = new Tag({ slug: TagEnum.aLaUne });
+ public tagEnum = TagEnum;
- constructor() { }
+ public checkedPublicTags: Tag[] = [];
+ public checkedLocationTags: Tag[] = [];
+
+ constructor(private route: ActivatedRoute, private router: Router) {}
ngOnInit(): void {
+ this.route.data.subscribe((data) => {
+ if (data.tags) {
+ this.tags = data.tags;
+ }
+ });
+
+ this.route.queryParams.subscribe((queryParams) => {
+ if (queryParams.mainTag) {
+ this.mainActiveTag = new Tag({ slug: queryParams.mainTag });
+ }
+ if (queryParams.publicTags) {
+ this.checkedPublicTags = parseSlugToTag(queryParams.publicTags);
+ }
+ if (queryParams.locationTags) {
+ this.checkedLocationTags = parseSlugToTag(queryParams.locationTags);
+ }
+ });
+ }
+
+ // Open the modal and display the list according to the right filter button
+ public openModal(modalType: TypeModalNews): void {
+ // if modal already opened, reset type
+ if (this.modalTypeOpened === modalType) {
+ this.closeModal();
+ } else if (this.modalTypeOpened !== modalType) {
+ this.modalTypeOpened = modalType;
+ }
+ }
+
+ public closeModal(): void {
+ this.modalTypeOpened = undefined;
+ }
+
+ // Accessor to template angular.
+ public get TypeModal(): typeof TypeModalNews {
+ return TypeModalNews;
+ }
+
+ public getModalData(): Tag[] {
+ if (this.modalTypeOpened === this.TypeModal.public) {
+ return this.tags.public;
+ }
+ return this.tags.commune;
+ }
+
+ public getCheckedModalData(): Tag[] {
+ if (this.modalTypeOpened === this.TypeModal.public) {
+ return this.checkedPublicTags;
+ }
+ return this.checkedLocationTags;
+ }
+
+ public activateTag(tag: Tag): void {
+ this.mainActiveTag = tag;
+ this.setQueryParam();
}
+ public filter(data: Tag[]): void {
+ if (this.modalTypeOpened === this.TypeModal.public) {
+ this.checkedPublicTags = data;
+ } else {
+ this.checkedLocationTags = data;
+ }
+
+ this.setQueryParam();
+ this.closeModal();
+ }
+
+ private setQueryParam(): void {
+ this.router.navigate([], {
+ relativeTo: this.route,
+ queryParams: {
+ mainTag: this.mainActiveTag.slug,
+ publicTags: this.checkedPublicTags.map((tag) => tag.slug),
+ locationTags: this.checkedLocationTags.map((tag) => tag.slug),
+ },
+ queryParamsHandling: 'merge',
+ });
+ }
}
diff --git a/src/app/post/components/post-list/post-list.component.html b/src/app/post/components/post-list/post-list.component.html
index 190d108eb99494d32bf027791b1009d981b05723..00642e6c004de4d319ecc55fe9f50016f8b25a46 100644
--- a/src/app/post/components/post-list/post-list.component.html
+++ b/src/app/post/components/post-list/post-list.component.html
@@ -1,13 +1,28 @@
-<div class="section-container" fxLayout="row" fxLayoutGap="32px">
+<div *ngIf="!isPublishMode" class="section-container" fxLayout="row" fxLayoutGap="32px">
<div fxLayout="column" class="list-container" fxLayoutGap="16px">
- <div fxLayout="column">
+ <div fxLayout="column" *ngIf="displayTags()">
+ <div fxLayout="row wrap" fxLayoutAlign="none center" fxLayoutGap="8px">
+ <div
+ fxLayout="row"
+ fxLayoutAlign="start center"
+ fxLayoutGap="9px"
+ *ngFor="let filter of filters | slice: 1"
+ class="tag"
+ (click)="removeTag(filter)"
+ >
+ <p>{{ filter.slug | titlecase }}</p>
+ <app-svg-icon [type]="'ico'" [iconColor]="'currentColor'" [icon]="'cancel'"></app-svg-icon>
+ </div>
+ </div>
+ </div>
+ <div fxLayout="column" *ngIf="isALaUneTag() && !displayTags()">
<div fxLayout="row" class="row-border" fxLayoutAlign="space-between center">
<h2>Ã la une</h2>
<app-button
[type]="'button'"
[style]="'buttonWithHash'"
[text]="'Publier votre actu'"
- (action)="publishNews()"
+ (action)="togglePublishNews()"
></app-button>
</div>
<app-post-card [class]="'bigNew'" [post]="bigNews"></app-post-card>
@@ -16,18 +31,33 @@
<div class="background-project-container">
<div class="project-content mobile" fxLayout="column">
<h2>appels à projets</h2>
- <app-post-card
- [post]="news"
- [class]="'project'"
- [ngClass]="{ 'last-child': last }"
- *ngFor="let news of projectsNew; let last = last"
- ></app-post-card>
+ <div *ngIf="projectsNew.length !== 0">
+ <app-post-card
+ [post]="news"
+ [class]="'project'"
+ [ngClass]="{ 'last-child': last }"
+ *ngFor="let news of projectsNew; let last = last"
+ ></app-post-card>
+ </div>
+ <div *ngIf="projectsNew.length === 0">
+ <p>Aucun appels à projet pour le moment.</p>
+ </div>
</div>
</div>
</div>
<div fxLayout="column">
- <div fxLayout="row" class="row-border otherNews">
- <h2>autres actualités</h2>
+ <div fxLayout="row" class="row-border" fxLayoutAlign="space-between center">
+ <h2 [ngClass]="{ 'padding-16-Top': isALaUneTag() && !displayTags() }">{{ getDisplayedTag() }}</h2>
+ <app-button
+ *ngIf="displayTags() || !isALaUneTag()"
+ [type]="'button'"
+ [style]="'buttonWithHash'"
+ [text]="'Publier votre actu'"
+ (action)="publishNews()"
+ ></app-button>
+ </div>
+ <div *ngIf="leftColumnPosts.length <= 0" fxLayout="column">
+ <p>Aucun résultat ne correspond a votre recherche.</p>
</div>
<div fxLayout="row" fxLayoutGap="33px">
<div fxLayout="column" class="columnPosts">
@@ -47,13 +77,19 @@
<div class="project-content" fxLayout="column">
<app-svg-icon [iconClass]="'icon-80'" [iconColor]="'inherit'" [type]="'post'" [icon]="'appels'"></app-svg-icon>
<h2>appels à projets</h2>
- <app-post-card
- [post]="news"
- [class]="'project'"
- [ngClass]="{ 'last-child': last }"
- *ngFor="let news of projectsNew; let last = last"
- ></app-post-card>
+ <div *ngIf="projectsNew.length !== 0">
+ <app-post-card
+ [post]="news"
+ [class]="'project'"
+ [ngClass]="{ 'last-child': last }"
+ *ngFor="let news of projectsNew; let last = last"
+ ></app-post-card>
+ </div>
+ <div *ngIf="projectsNew.length === 0">
+ <p>Aucun appels à projet pour le moment.</p>
+ </div>
</div>
</div>
</div>
</div>
+<app-post-publish *ngIf="isPublishMode" (closePublish)="togglePublishNews()"></app-post-publish>
diff --git a/src/app/post/components/post-list/post-list.component.scss b/src/app/post/components/post-list/post-list.component.scss
index 27a518b912adfc47476fe0f2b56fe55b5685769c..ea2f433a97865800f2f865667c04436aec37b698 100644
--- a/src/app/post/components/post-list/post-list.component.scss
+++ b/src/app/post/components/post-list/post-list.component.scss
@@ -6,12 +6,11 @@
.section-container {
background: $grey-6;
margin-top: 40px;
+ min-height: 68vh;
+ width: 100%;
.row-border {
border-bottom: 1px dashed $grey-4;
padding-bottom: 16px;
- &.otherNews {
- padding-top: 24px;
- }
}
h2 {
font-style: italic !important;
@@ -100,3 +99,19 @@ h2 {
}
}
}
+.tag {
+ background: $grey-3;
+ color: $white;
+ border-radius: 20px;
+ cursor: pointer;
+ margin-bottom: 10px;
+ padding: 0 20px;
+ p {
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+}
+
+.padding-16-Top {
+ padding-top: 16px;
+}
diff --git a/src/app/post/components/post-list/post-list.component.ts b/src/app/post/components/post-list/post-list.component.ts
index 807c2b9c29415e771c45fef6bf6cacd6559d67a7..6bba022048db48864888ef6b0b02d36f054d6ee0 100644
--- a/src/app/post/components/post-list/post-list.component.ts
+++ b/src/app/post/components/post-list/post-list.component.ts
@@ -3,8 +3,12 @@ import { WindowScrollService } from '../../../shared/service/windowScroll.servic
import { TagEnum } from '../../enum/tag.enum';
import { Pagination } from '../../models/pagination.model';
import { Post } from '../../models/post.model';
+import { Tag } from '../../models/tag.model';
import { PostWithMeta } from '../../models/postWithMeta.model';
import { PostService } from '../../services/post.service';
+import { ActivatedRoute, Router } from '@angular/router';
+import * as _ from 'lodash';
+import { parseSlugToTag } from '../utils/NewsUtils';
@Component({
selector: 'app-post-list',
@@ -12,7 +16,25 @@ import { PostService } from '../../services/post.service';
styleUrls: ['./post-list.component.scss'],
})
export class PostListComponent implements OnInit {
- constructor(private postService: PostService, private windowScrollService: WindowScrollService) {
+ public selectedMainTagSlug = '';
+ public selectedLocationTagSlug = [];
+ public selectedPublicTagsSlug = [];
+ public filters: Tag[];
+ public postsMobileView: Post[] = [];
+ public leftColumnPosts: Post[] = [];
+ public rightColumnPosts: Post[] = [];
+ public projectsNew: Post[] = [];
+ public bigNews: Post;
+ public pagination: Pagination;
+ public isLoading = false;
+ public isPublishMode = false;
+
+ constructor(
+ private postService: PostService,
+ private windowScrollService: WindowScrollService,
+ private route: ActivatedRoute,
+ private router: Router
+ ) {
this.windowScrollService.scrollY$.subscribe((evt: any) => {
if (evt && evt.target.offsetHeight + evt.target.scrollTop >= evt.target.scrollHeight - 200) {
if (!this.isLoading) {
@@ -21,28 +43,89 @@ export class PostListComponent implements OnInit {
}
});
}
- public postsMobileView: Post[] = [];
- public leftColumnPosts: Post[] = [];
- public rightColumnPosts: Post[] = [];
- public projectsNew: Post[] = [];
- public bigNews: Post;
- public pagination: Pagination;
- public isLoading = false;
ngOnInit(): void {
this.isLoading = true;
- this.postService.getPosts(1).subscribe((news) => {
- this.setNews(news);
+ // Init APP news list
+ this.postService.getPosts(1, [TagEnum.appels]).subscribe((news) => {
+ let projectNews = news.posts.map((news) => (news = this.addAuthorToPost(news)));
+ this.projectsNew = projectNews;
});
this.postService.getPosts(1, [TagEnum.aLaUne]).subscribe((news) => {
this.bigNews = this.addAuthorToPost(news.posts[0]);
});
- this.postService.getPosts(1, [TagEnum.appels]).subscribe((news) => {
- let projectNews = news.posts.map((news) => (news = this.addAuthorToPost(news)));
- this.projectsNew = projectNews;
+ this.route.queryParams.subscribe((queryParams) => {
+ // If main tag is in route, set it
+ if (queryParams.mainTag) {
+ this.selectedMainTagSlug = queryParams.mainTag;
+ this.selectedPublicTagsSlug = parseSlugToTag(queryParams.publicTags);
+ this.selectedLocationTagSlug = parseSlugToTag(queryParams.locationTags);
+ // Set filters for search and display
+ this.filters = [
+ new Tag({ slug: queryParams.mainTag }),
+ ...this.selectedLocationTagSlug,
+ ...this.selectedPublicTagsSlug,
+ ];
+ // Apply search
+ this.getPosts(this.filters);
+ } else {
+ // Init default news list
+ this.postService.getPosts(1).subscribe((news) => {
+ this.setNews(news);
+ });
+ }
+ });
+ }
+
+ public togglePublishNews(): void {
+ this.isPublishMode = !this.isPublishMode;
+ }
+ public getPosts(filters?: Tag[]): void {
+ // Parse filter
+ let parsedFilters = null;
+ if (filters) {
+ parsedFilters = filters.map((filter) => {
+ return filter.slug;
+ });
+
+ // remove 'a la une' filter
+ parsedFilters = parsedFilters.filter((item) => {
+ return item !== TagEnum.aLaUne;
+ });
+
+ if (parsedFilters.length <= 0) {
+ parsedFilters = null;
+ }
+ }
+
+ // Reset posts
+ this.resetPosts();
+
+ this.postService.getPosts(1, parsedFilters).subscribe((news) => {
+ this.setNews(news);
});
}
+ public getDisplayedTag(): string {
+ if (!this.isALaUneTag()) {
+ return this.selectedMainTagSlug;
+ }
+ return 'autres actualités';
+ }
+
+ public isALaUneTag(): boolean {
+ if (!this.filters || this.filters[0].slug === TagEnum.aLaUne) {
+ return true;
+ }
+ return false;
+ }
+
+ public resetPosts(): void {
+ this.leftColumnPosts = [];
+ this.rightColumnPosts = [];
+ this.postsMobileView = [];
+ }
+
public publishNews(): void {}
//Transform excerpt post to have a custom author.
@@ -78,4 +161,22 @@ export class PostListComponent implements OnInit {
});
this.isLoading = false;
}
+
+ public removeTag(tagToRemove: Tag): void {
+ _.remove(this.selectedPublicTagsSlug, { slug: tagToRemove.slug });
+ _.remove(this.selectedLocationTagSlug, { slug: tagToRemove.slug });
+ this.router.navigate([], {
+ relativeTo: this.route,
+ queryParams: {
+ mainTag: this.selectedMainTagSlug,
+ publicTags: this.selectedPublicTagsSlug.map((tag) => tag.slug),
+ locationTags: this.selectedLocationTagSlug.map((tag) => tag.slug),
+ },
+ queryParamsHandling: 'merge',
+ });
+ }
+
+ public displayTags(): boolean {
+ return this.selectedLocationTagSlug.length > 0 || this.selectedPublicTagsSlug.length > 0;
+ }
}
diff --git a/src/app/post/components/post-modal-filters/post-modal-filters.component.html b/src/app/post/components/post-modal-filters/post-modal-filters.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..7ee54d56c10e422264d97c78d783c8dc4dd70f15
--- /dev/null
+++ b/src/app/post/components/post-modal-filters/post-modal-filters.component.html
@@ -0,0 +1,34 @@
+<div *ngIf="modalType" fxLayout="column" fxLayoutAlign="space-between" [ngClass]="['modal', 'modal' + getModalType()]">
+ <div class="body-wrap" fxLayout="column" fxLayoutAlign="space-between">
+ <div class="titleFilter" fxLayout="row" fxLayoutAlign="space-between">
+ <span>Filtres</span>
+ <div (click)="closeModal()" class="ico-close-details"></div>
+ </div>
+ <div class="contentModal" fxLayout="row wrap" fxLayoutAlign="flex-start" *ngIf="tags.length > 0">
+ <div class="blockFiltre">
+ <ul class="blockLigne">
+ <div fxLayout="row" class="ligneFiltre" *ngFor="let tag of tags">
+ <li class="checkbox">
+ <div class="checkboxItem">
+ <label>
+ <input
+ type="checkbox"
+ [checked]="getIndex(checkedTags, tag.slug) > -1"
+ [value]="tag.id"
+ (change)="onCheckboxChange($event, tag)"
+ />
+ <span class="customCheck"></span>
+ <div class="label">{{ tag.name }}</div>
+ </label>
+ </div>
+ </li>
+ </div>
+ </ul>
+ </div>
+ </div>
+ <div class="footer" fxLayout="row" fxLayoutAlign="end center" fxLayoutGap="3vw">
+ <a (click)="clearFilters()" tabindex="0">Effacer</a>
+ <app-button [style]="'button'" [text]="'Appliquer'" (click)="emit(checkedTags)"></app-button>
+ </div>
+ </div>
+</div>
diff --git a/src/app/post/components/post-modal-filters/post-modal-filters.component.scss b/src/app/post/components/post-modal-filters/post-modal-filters.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..c897edd1c2a742c12ad461c4fc9acead50512623
--- /dev/null
+++ b/src/app/post/components/post-modal-filters/post-modal-filters.component.scss
@@ -0,0 +1,132 @@
+@import '../../../../assets/scss/icons';
+@import '../../../../assets/scss/color';
+@import '../../../../assets/scss/typography';
+@import '../../../../assets/scss/breakpoint';
+@import '../../../../assets/scss/shapes';
+@import '../../../../assets/scss/hyperlink';
+@import '../../../../assets/scss/z-index';
+
+.modallocation {
+ margin-left: -341px;
+}
+.modalpublic {
+ @media #{$desktop} {
+ margin-left: -446px;
+ }
+ margin-left: -566px;
+}
+.modal {
+ max-width: 341px;
+ width: 94%;
+ z-index: $modal-z-index !important;
+ position: absolute;
+ border-radius: 6px;
+ margin-top: 24px;
+ @media #{$large-phone} {
+ height: 100%;
+ max-height: auto;
+ max-width: auto;
+ width: 100%;
+ position: fixed;
+ top: 0;
+ left: 0;
+ border: none;
+ padding: 0;
+ }
+ @include background-hash($grey-2);
+ border: 1px solid $grey-4;
+ ::-webkit-scrollbar {
+ width: 16px;
+ }
+ ::-webkit-scrollbar-track {
+ background: $grey-6;
+ }
+ ::-webkit-scrollbar-thumb {
+ background: $grey;
+ border-radius: 6px;
+ }
+ .body-wrap {
+ @media #{$large-phone} {
+ height: 100vh;
+ height: -webkit-fill-available;
+ }
+ .titleFilter {
+ display: none !important;
+ margin: 27px 25px 0px 25px;
+ @include cn-bold-26;
+ @media #{$large-phone} {
+ display: flex !important;
+ }
+ }
+ }
+ .contentModal {
+ overflow-y: auto;
+ max-width: 1100px;
+ border-bottom: 1px solid $grey;
+ margin-bottom: 16px;
+ max-height: 40vh;
+ @media #{$large-phone} {
+ max-height: none;
+ height: 100%;
+ }
+ .blockFiltre {
+ width: 100%;
+ margin: 0 32px;
+ padding: 40px 0;
+ border-bottom: 1px dashed $grey-4;
+
+ &:last-child {
+ padding-bottom: 32px;
+ border-bottom: none;
+ }
+ @media #{$large-phone} {
+ margin: 0 18px;
+ padding: 25px 0;
+ }
+ }
+ .blockLigne {
+ padding-left: 0;
+ -moz-column-count: 1;
+ -moz-column-gap: 46px;
+ -webkit-column-count: 1;
+ -webkit-column-gap: 46px;
+ column-count: 1;
+ column-gap: 46px;
+ margin: 0px;
+ @media #{$large-phone} {
+ -moz-column-count: 1;
+ -webkit-column-count: 1;
+ column-count: 1;
+ }
+ }
+ .ligneFiltre {
+ padding: 5px 0;
+ }
+ h4 {
+ @include cn-bold-16;
+ line-height: 17px;
+ text-transform: uppercase;
+ color: $grey-3;
+ display: flex;
+ align-items: center;
+ margin-top: 0;
+ margin-bottom: 9px;
+ }
+ .nbResult {
+ @include cn-regular-14;
+ line-height: 16px;
+ color: $grey-3;
+ padding-top: 3px;
+ }
+ label {
+ @include cn-regular-14;
+ }
+ }
+ .footer {
+ margin: 0px 20px 16px 0;
+ height: 32px;
+ }
+}
+a {
+ @include hyperlink;
+}
diff --git a/src/app/post/components/post-modal-filters/post-modal-filters.component.spec.ts b/src/app/post/components/post-modal-filters/post-modal-filters.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..601a25abe56e12ba27750f23a88fb3fa9c4e9ecc
--- /dev/null
+++ b/src/app/post/components/post-modal-filters/post-modal-filters.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PostModalFiltersComponent } from './post-modal-filters.component';
+
+describe('PostModalFiltersComponent', () => {
+ let component: PostModalFiltersComponent;
+ let fixture: ComponentFixture<PostModalFiltersComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ PostModalFiltersComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(PostModalFiltersComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/post/components/post-modal-filters/post-modal-filters.component.ts b/src/app/post/components/post-modal-filters/post-modal-filters.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..6624c5d0e7e2c021ac81839cb620a7ee9ae9f00c
--- /dev/null
+++ b/src/app/post/components/post-modal-filters/post-modal-filters.component.ts
@@ -0,0 +1,72 @@
+import { Component, EventEmitter, Input, OnInit, Output, SimpleChanges } from '@angular/core';
+import { Tag } from '../../models/tag.model';
+import { TypeModalNews } from '../../enum/typeModalNews.enum';
+import { OnChanges } from '@angular/core';
+
+@Component({
+ selector: 'app-post-modal-filters',
+ templateUrl: './post-modal-filters.component.html',
+ styleUrls: ['./post-modal-filters.component.scss'],
+})
+export class PostModalFiltersComponent implements OnInit, OnChanges {
+ @Input() public modalType: TypeModalNews;
+ @Input() public tags: Tag[];
+ @Output() searchEvent = new EventEmitter();
+ @Output() closeEvent = new EventEmitter();
+ // Checkbox variable
+ @Input() public inputCheckedTags: Tag[] = [];
+ public checkedTags: Tag[] = [];
+
+ constructor() {}
+
+ ngOnChanges(changes: SimpleChanges): void {
+ if (changes.inputCheckedTags) {
+ this.checkedTags = this.inputCheckedTags;
+ }
+ }
+
+ ngOnInit(): void {
+ this.checkedTags = this.inputCheckedTags;
+ }
+
+ // Management of the checkbox event (Check / Uncheck)
+ public onCheckboxChange(event, tag: Tag): void {
+ if (event.target.checked) {
+ this.checkedTags.push(tag);
+ } else {
+ // Check if the module is present in the list and remove it
+ if (this.getIndex(this.checkedTags, tag.slug) > -1) {
+ this.checkedTags.splice(this.getIndex(this.checkedTags, tag.slug), 1);
+ }
+ }
+ }
+
+ // Clear only filters in the current modal
+ public clearFilters(): void {
+ this.checkedTags = [];
+ this.searchEvent.emit(this.checkedTags);
+ }
+
+ public getModalType(): string {
+ switch (this.modalType) {
+ case TypeModalNews.location:
+ return 'location';
+ case TypeModalNews.public:
+ return 'public';
+ default:
+ return '';
+ }
+ }
+
+ public emit(data: Tag[]): void {
+ this.searchEvent.emit(data);
+ }
+
+ public getIndex(array: Tag[], slug: string): number {
+ return array.findIndex((tag: Tag) => tag.slug === slug);
+ }
+
+ public closeModal(): void {
+ this.closeEvent.emit();
+ }
+}
diff --git a/src/app/post/components/post-publish/post-publish.component.html b/src/app/post/components/post-publish/post-publish.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..1578c1ea97a04c19055055da475f82247ca5a0c5
--- /dev/null
+++ b/src/app/post/components/post-publish/post-publish.component.html
@@ -0,0 +1,35 @@
+<div class="container" fxLayout="column" fxLayoutGap="16px">
+ <div fxLayout="row">
+ <div class="backLink" fxLayout="row" fxLayoutAlign=" center" (click)="backToPosts()">
+ <svg class="chevronLeft" aria-hidden="true">
+ <use [attr.xlink:href]="'assets/form/sprite.svg#chevronLeft'"></use>
+ </svg>
+ <span>Retour à la liste d'acutalités</span>
+ </div>
+ </div>
+ <div fxLayout="column" class="content" fxLayoutGap="16px">
+ <h2>Publier votre actualité</h2>
+ <div class="image">
+ <svg aria-hidden="true">
+ <use [attr.xlink:href]="'../../../../assets/post/sprite.svg#publishLogo'"></use>
+ </svg>
+ </div>
+ <div class="informations">
+ <p>Vous pouvez nous envoyer votre actualité en distinguant ces 4 éléments :</p>
+ <ul>
+ <li>- le titre</li>
+ <li>- le texte</li>
+ <li>- l’auteur</li>
+ <li>- l’image (facultatif)</li>
+ </ul>
+ <br />
+ <p>Si votre actualité existe déjà sur un autre site, envoyez-nous simplement son adresse URL</p>
+ <br />
+ </div>
+ <div>
+ <a class="btn-primary" href="mailto:inclusionnumerique@grandlyon.com?subject=Nouvelle actualité à intégrer"
+ >Envoyer votre actu par mail</a
+ >
+ </div>
+ </div>
+</div>
diff --git a/src/app/post/components/post-publish/post-publish.component.scss b/src/app/post/components/post-publish/post-publish.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..8c66547d0f1d8ee5a7a8e5cabfdfbc5cc34bf6ef
--- /dev/null
+++ b/src/app/post/components/post-publish/post-publish.component.scss
@@ -0,0 +1,62 @@
+@import '../../../../assets/scss/color';
+@import '../../../../assets/scss/typography';
+@import '../../../../assets/scss/layout';
+
+$margin-post: 20px;
+
+.container {
+ max-width: 832px;
+ width: 95%;
+ margin: $margin-post auto;
+ min-height: calc(
+ var(--vh, 1vh) * 100 - #{$header-height} - #{$footer-height} - #{$header-post-height} - #{$margin-post}* 2
+ );
+}
+.chevronLeft {
+ height: 24px;
+ width: 24px;
+ stroke: $black;
+ margin-right: 10px;
+}
+.backLink {
+ cursor: pointer;
+ color: $grey-2;
+ @include cn-bold-16;
+ &:hover {
+ opacity: 0.4;
+ }
+}
+.content {
+ color: $grey-1;
+ h2 {
+ @include cn-bold-30;
+ margin: 0;
+ }
+ .image {
+ width: 100%;
+ text-align: center;
+ svg {
+ max-width: 300px;
+ height: 300px;
+ }
+ }
+ .informations {
+ @include cn-regular-18;
+ ul {
+ margin: 0;
+ padding: 0;
+ list-style: none;
+ }
+ p {
+ margin: 0;
+ }
+ }
+
+ a {
+ text-decoration: none;
+ width: auto;
+ padding: 10.5px 24px;
+ @include cn-regular-16;
+ font-size: 16px;
+ }
+}
diff --git a/src/app/post/components/post-publish/post-publish.component.spec.ts b/src/app/post/components/post-publish/post-publish.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..ed2451eff03e05dd0f15a691aafe36e625dd1cb3
--- /dev/null
+++ b/src/app/post/components/post-publish/post-publish.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PostPublishComponent } from './post-publish.component';
+
+describe('PostPublishComponent', () => {
+ let component: PostPublishComponent;
+ let fixture: ComponentFixture<PostPublishComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ PostPublishComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(PostPublishComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/post/components/post-publish/post-publish.component.ts b/src/app/post/components/post-publish/post-publish.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..a1df80d6ea8d58d7558ad2dbeddbaac3ca5292b7
--- /dev/null
+++ b/src/app/post/components/post-publish/post-publish.component.ts
@@ -0,0 +1,17 @@
+import { Component, EventEmitter, OnInit, Output } from '@angular/core';
+
+@Component({
+ selector: 'app-post-publish',
+ templateUrl: './post-publish.component.html',
+ styleUrls: ['./post-publish.component.scss'],
+})
+export class PostPublishComponent implements OnInit {
+ @Output() closePublish = new EventEmitter<boolean>();
+ constructor() {}
+
+ ngOnInit(): void {}
+
+ public backToPosts(): void {
+ this.closePublish.emit(true);
+ }
+}
diff --git a/src/app/post/components/utils/NewsUtils.ts b/src/app/post/components/utils/NewsUtils.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4bb4eea6b9bada44033a1746d1eb200fd1dfd032
--- /dev/null
+++ b/src/app/post/components/utils/NewsUtils.ts
@@ -0,0 +1,11 @@
+import { Tag } from '../../models/tag.model';
+
+export function parseSlugToTag(data: Tag[] | string): Tag[] {
+ let otherTags = [];
+ if (Array.isArray(data)) {
+ otherTags = data.map((slug) => new Tag({ slug: slug }));
+ } else if (data) {
+ otherTags = [new Tag({ slug: data })];
+ }
+ return otherTags;
+}
diff --git a/src/app/post/enum/tag.enum.ts b/src/app/post/enum/tag.enum.ts
index 0b6c049d9c31201ed0765164d4fd649e990c1782..8b95ae41bf996f7e1f5614333f5973b905a26d29 100644
--- a/src/app/post/enum/tag.enum.ts
+++ b/src/app/post/enum/tag.enum.ts
@@ -1,4 +1,10 @@
export enum TagEnum {
aLaUne = 'a-la-une',
appels = 'appels',
+ projets = 'projets',
+ formations = 'formations',
+ infos = 'infos',
+ dossiers = 'dossiers',
+ etudes = 'etudes',
+ ressources = 'ressources',
}
diff --git a/src/app/post/enum/typeModalNews.enum.ts b/src/app/post/enum/typeModalNews.enum.ts
new file mode 100644
index 0000000000000000000000000000000000000000..d15c4e7022702da270c81011d06dfe0bb185243d
--- /dev/null
+++ b/src/app/post/enum/typeModalNews.enum.ts
@@ -0,0 +1,4 @@
+export enum TypeModalNews {
+ public = 1,
+ location,
+}
diff --git a/src/app/post/models/tag.model.ts b/src/app/post/models/tag.model.ts
index df72a66b1135466ee3ccb13a8117cbce4e40ea32..53b77b9e07a0012f14068f6af1333f8d32fdf229 100644
--- a/src/app/post/models/tag.model.ts
+++ b/src/app/post/models/tag.model.ts
@@ -1,4 +1,10 @@
export class Tag {
+ id: string;
name: string;
slug: string;
+ description: string; // Description is used to ut categories on tags
+
+ constructor(obj?: any) {
+ Object.assign(this, obj);
+ }
}
diff --git a/src/app/post/models/tagWithMeta.model.ts b/src/app/post/models/tagWithMeta.model.ts
new file mode 100644
index 0000000000000000000000000000000000000000..6b28aa489dd4c663bd6074ac66b6db4bd458ecaf
--- /dev/null
+++ b/src/app/post/models/tagWithMeta.model.ts
@@ -0,0 +1,7 @@
+import { Tag } from './tag.model';
+
+export class TagWithMeta {
+ commune: Tag[];
+ public: Tag[];
+ others: Tag[];
+}
diff --git a/src/app/post/news.component.html b/src/app/post/news.component.html
index ba58f058ba0384781d74c5390e0ff2d9c0634ac3..93d25593614704c3f94172331359df4dcc1bacec 100644
--- a/src/app/post/news.component.html
+++ b/src/app/post/news.component.html
@@ -1,4 +1,5 @@
-<app-post-header></app-post-header>
+<app-post-header (filterTags)="setFilters($event)"></app-post-header>
<div class="section-container">
+ <!-- <app-post-list [filters]="filters"></app-post-list> -->
<router-outlet></router-outlet>
</div>
diff --git a/src/app/post/news.component.ts b/src/app/post/news.component.ts
index ce2f45998ad77c03b1b4ab2826f86c82d31e774f..40e2377766e92e84c50eb184be8f87604c2a288b 100644
--- a/src/app/post/news.component.ts
+++ b/src/app/post/news.component.ts
@@ -1,4 +1,5 @@
import { Component, OnInit } from '@angular/core';
+import { Tag } from './models/tag.model';
@Component({
selector: 'app-news',
@@ -6,7 +7,12 @@ import { Component, OnInit } from '@angular/core';
styleUrls: ['./news.component.scss'],
})
export class NewsComponent implements OnInit {
+ public filters: Tag[];
constructor() {}
ngOnInit(): void {}
+
+ public setFilters(tags: Tag[]): void {
+ this.filters = tags;
+ }
}
diff --git a/src/app/post/post-routing.module.ts b/src/app/post/post-routing.module.ts
index e6f6a3e0098cb96afa1d2ddca401fcfe8e5c1e37..c95c0ba7cbea2c96e03ae08ecea77819b367b348 100644
--- a/src/app/post/post-routing.module.ts
+++ b/src/app/post/post-routing.module.ts
@@ -3,11 +3,15 @@ import { Routes, RouterModule } from '@angular/router';
import { PostDetailsComponent } from './components/post-details/post-details.component';
import { PostListComponent } from './components/post-list/post-list.component';
import { NewsComponent } from './news.component';
+import { TagResolver } from './resolvers/tags.resolver';
const routes: Routes = [
{
path: '',
component: NewsComponent,
+ resolve: {
+ tags: TagResolver,
+ },
children: [
{
path: '',
diff --git a/src/app/post/post.module.ts b/src/app/post/post.module.ts
index d51f1291cbdef35fa12d1f9dc2d0fdb6c7b4751b..a4f19045817563190f78f433ecca44d8bf0b1cf1 100644
--- a/src/app/post/post.module.ts
+++ b/src/app/post/post.module.ts
@@ -7,9 +7,21 @@ import { PostListComponent } from './components/post-list/post-list.component';
import { PostDetailsComponent } from './components/post-details/post-details.component';
import { SharedModule } from '../shared/shared.module';
import { PostCardComponent } from './components/post-card/post-card.component';
+import { PostPublishComponent } from './components/post-publish/post-publish.component';
+import { PostModalFiltersComponent } from './components/post-modal-filters/post-modal-filters.component';
+import { TagResolver } from './resolvers/tags.resolver';
@NgModule({
- declarations: [NewsComponent, PostHeaderComponent, PostListComponent, PostDetailsComponent, PostCardComponent],
+ declarations: [
+ NewsComponent,
+ PostHeaderComponent,
+ PostListComponent,
+ PostDetailsComponent,
+ PostCardComponent,
+ PostModalFiltersComponent,
+ PostPublishComponent,
+ ],
imports: [CommonModule, PostRoutingModule, SharedModule],
+ providers: [TagResolver],
})
export class PostModule {}
diff --git a/src/app/post/resolvers/tags.resolver.ts b/src/app/post/resolvers/tags.resolver.ts
new file mode 100644
index 0000000000000000000000000000000000000000..6f92f989e8b3b4d3b4a12a9322ef41f0a19d91bf
--- /dev/null
+++ b/src/app/post/resolvers/tags.resolver.ts
@@ -0,0 +1,21 @@
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router';
+import { Observable } from 'rxjs';
+import { map, catchError } from 'rxjs/operators';
+import { TagWithMeta } from '../models/tagWithMeta.model';
+import { PostService } from '../services/post.service';
+
+@Injectable()
+export class TagResolver implements Resolve<TagWithMeta> {
+ constructor(private postService: PostService, private router: Router) {}
+
+ resolve(): Observable<TagWithMeta> {
+ return this.postService.getTags().pipe(
+ map((res) => res),
+ catchError(() => {
+ this.router.navigate(['/home']);
+ return new Observable<TagWithMeta>();
+ })
+ );
+ }
+}
diff --git a/src/app/post/services/post.service.ts b/src/app/post/services/post.service.ts
index d70e18881db9ddd10f11df0a19db6dc2f47bee44..b0fc02fb257ff31679d55e5ca1f0b63a9b0e0439 100644
--- a/src/app/post/services/post.service.ts
+++ b/src/app/post/services/post.service.ts
@@ -5,6 +5,8 @@ import { map } from 'rxjs/operators';
import { Post } from '../models/post.model';
import { TagEnum } from '../enum/tag.enum';
import { PostWithMeta } from '../models/postWithMeta.model';
+import { Tag } from '../models/tag.model';
+import { TagWithMeta } from '../models/tagWithMeta.model';
@Injectable({
providedIn: 'root',
@@ -37,14 +39,18 @@ export class PostService {
tags.forEach((tag, index) => {
tagsString += tag;
if (index != tags.length - 1) {
- tagsString += ',';
+ tagsString += '+tags:';
}
});
return this.http
- .get<PostWithMeta>(`${this.baseUrl}?include=tags,authors&filter=tag:[${tagsString}]`)
+ .get<PostWithMeta>(`${this.baseUrl}?include=tags,authors&filter=tags:${encodeURIComponent(tagsString)}`)
.pipe(map((item: PostWithMeta) => new PostWithMeta(item)));
}
+ public getTags(): Observable<TagWithMeta> {
+ return this.http.get<TagWithMeta>(`${this.baseUrl}/tags`);
+ }
+
private addAuthorToPost(post: Post): Post {
post.author = post.excerpt;
post.excerpt = post.html.replace(/<[^>]*>/g, '');
diff --git a/src/app/profile/services/profile.service.ts b/src/app/profile/services/profile.service.ts
index 370137312c0da1f504f624ec8be949cfc7683559..2f044a5f52502d5d275524387de0ec6d6bacf647 100644
--- a/src/app/profile/services/profile.service.ts
+++ b/src/app/profile/services/profile.service.ts
@@ -40,7 +40,6 @@ export class ProfileService {
if (!this.currentProfile) {
return false;
}
- console.log(this.currentProfile.pendingStructuresLink);
return this.currentProfile.pendingStructuresLink.includes(idStructure);
}
diff --git a/src/app/shared/components/address-autocomplete/address-autocomplete.component.ts b/src/app/shared/components/address-autocomplete/address-autocomplete.component.ts
index 5bfb99bbf029f3be7c478223e83dddfe3b800a30..e04af8369835b9022f41bad9143b2c680460b379 100644
--- a/src/app/shared/components/address-autocomplete/address-autocomplete.component.ts
+++ b/src/app/shared/components/address-autocomplete/address-autocomplete.component.ts
@@ -20,7 +20,12 @@ export class AddressAutocompleteComponent implements OnInit {
ngOnInit(): void {
if (this.address) {
- const address_str = this.address.numero + ' ' + this.address.street + ' ' + this.address.commune;
+ let address_str = null;
+ if (this.address.numero) {
+ address_str = this.address.numero + ' ' + this.address.street + ' ' + this.address.commune;
+ } else {
+ address_str = this.address.street + ' ' + this.address.commune;
+ }
this.searchAddress.nativeElement.value = address_str;
}
}
@@ -28,7 +33,7 @@ export class AddressAutocompleteComponent implements OnInit {
if (!this.isAlreadySearching) {
this.isAlreadySearching = true;
this.addressService.searchAddress(searchString).subscribe((data) => {
- this.data = data.hits.hits.slice(0, this.AUTOCOMPLETE_NBR);
+ this.data = data.features;
this.isAlreadySearching = false;
});
}
@@ -37,9 +42,9 @@ export class AddressAutocompleteComponent implements OnInit {
public selectedResult(hit: any): void {
const address = new Address();
- address.numero = hit._source['data-fr'].properties.numero_str;
- address.street = hit._source['data-fr'].properties.voie_str;
- address.commune = hit._source['data-fr'].properties.commune_str;
+ address.numero = hit.properties.housenumber ? hit.properties.housenumber : null;
+ address.street = hit.properties.street;
+ address.commune = hit.properties.city;
const value = this.parseHitToAddress(hit);
// Set input value
this.searchAddress.nativeElement.value = value;
@@ -50,6 +55,9 @@ export class AddressAutocompleteComponent implements OnInit {
}
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}`;
+ if (hit.properties.housenumber) {
+ return `${hit.properties.housenumber} ${hit.properties.street} ${hit.properties.city}`;
+ }
+ return `${hit.properties.street} ${hit.properties.city}`;
}
}
diff --git a/src/app/shared/components/svg-icon/svg-icon.component.scss b/src/app/shared/components/svg-icon/svg-icon.component.scss
index 0d40e293ba4dd5ae8d2c04d35678170f5ae2ee7a..ceb7b8decc61a40756a3bcedb75648657f63d89b 100644
--- a/src/app/shared/components/svg-icon/svg-icon.component.scss
+++ b/src/app/shared/components/svg-icon/svg-icon.component.scss
@@ -3,6 +3,10 @@
display: inline-block;
height: 2em;
width: 1.5em;
+ &.icon-28 {
+ width: 28px;
+ height: 28px;
+ }
&.icon-32 {
width: 2em;
}
@@ -23,6 +27,14 @@
opacity: 0.8;
}
}
+ &.white {
+ fill: $white;
+ stroke: $white;
+ path {
+ stroke: $white;
+ fill: $white;
+ }
+ }
&.grey {
fill: $grey-3;
stroke: $grey-3;
diff --git a/src/app/structure-list/components/card/card.component.html b/src/app/structure-list/components/card/card.component.html
index 1111644351601efa7e80b94c4aed177aa1b68b5d..ca492505150b2e60a136b393172950367583a457 100644
--- a/src/app/structure-list/components/card/card.component.html
+++ b/src/app/structure-list/components/card/card.component.html
@@ -1,6 +1,6 @@
<div class="structure" fxLayout="column" (click)="cardClicked()" (mouseenter)="cardHover()">
<div class="headerStructure" fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="16px">
- <span class="structure-name">{{ structure.structureName }}</span>
+ <span class="structure-name" [ngClass]="{ notClaimed: !isClaimed }">{{ structure.structureName }}</span>
<div
*ngIf="structure.distance"
class="distanceStructure"
diff --git a/src/app/structure-list/components/card/card.component.scss b/src/app/structure-list/components/card/card.component.scss
index 687abf098d16804365bd2c3b0d1dd13940809f52..fe17d873498c1c91b65ba030f42843cfd067253b 100644
--- a/src/app/structure-list/components/card/card.component.scss
+++ b/src/app/structure-list/components/card/card.component.scss
@@ -17,11 +17,17 @@
font-style: italic;
}
.structure-name {
+ &.notClaimed {
+ color: $red-info;
+ }
color: $grey-1;
@include cn-bold-18;
padding-bottom: 5px;
width: 100%;
- text-transform: capitalize;
+ text-transform: lowercase;
+ &::first-letter {
+ text-transform: uppercase;
+ }
}
.distanceStructure {
@include cn-regular-16;
diff --git a/src/app/structure-list/components/card/card.component.ts b/src/app/structure-list/components/card/card.component.ts
index ed8b3158f0c7c573c571d644a3c6eb1a1bbc3206..b3a414f4a8fd446011c456f9652fe29a26ae8f7a 100644
--- a/src/app/structure-list/components/card/card.component.ts
+++ b/src/app/structure-list/components/card/card.component.ts
@@ -1,6 +1,9 @@
import { Component, Input, Output, OnInit, EventEmitter } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
import { Structure } from '../../../models/structure.model';
+import { ProfileService } from '../../../profile/services/profile.service';
import { GeojsonService } from '../../../services/geojson.service';
+import { StructureService } from '../../../services/structure.service';
@Component({
selector: 'app-card',
@@ -11,9 +14,24 @@ export class CardComponent implements OnInit {
@Input() public structure: Structure;
@Output() public showDetails: EventEmitter<Structure> = new EventEmitter<Structure>();
@Output() public hover: EventEmitter<Structure> = new EventEmitter<Structure>();
+ public isClaimed = true;
- constructor(private geoJsonService: GeojsonService) {}
- ngOnInit(): void {}
+ constructor(
+ private route: ActivatedRoute,
+ private router: Router,
+ private profileService: ProfileService,
+ private structureService: StructureService
+ ) {}
+ ngOnInit(): void {
+ if (this.profileService.isAdmin()) {
+ this.setClaimIndicator();
+ }
+ }
+
+ // Check if structure haven't owners to help admin vision.
+ async setClaimIndicator() {
+ this.isClaimed = await this.structureService.isClaimed(this.structure._id, null).toPromise();
+ }
/**
* Display distance in m or km according to value
@@ -28,6 +46,12 @@ export class CardComponent implements OnInit {
public cardClicked(): void {
this.showDetails.emit(this.structure);
+ this.router.navigate([], {
+ relativeTo: this.route,
+ queryParams: {
+ id: this.structure._id,
+ },
+ });
}
public cardHover(): void {
diff --git a/src/app/structure-list/components/search/search.component.scss b/src/app/structure-list/components/search/search.component.scss
index ec415e8960e6076b0c573254c2cb15fb2e0423e4..89773e528bcbc3181ef547b07b5c8f315dcd33de 100644
--- a/src/app/structure-list/components/search/search.component.scss
+++ b/src/app/structure-list/components/search/search.component.scss
@@ -60,12 +60,13 @@
}
}
.selected {
- border-color: $primary-color !important;
- color: inherit;
+ background-color: $secondary-color;
+ border-color: $secondary-color !important;
+ color: $white;
.arrow {
background-color: transparent;
- border-bottom: 1px solid $primary-color;
- border-right: 1px solid $primary-color;
+ border-bottom: 1px solid $white;
+ border-right: 1px solid $white;
transform: translateY(25%) rotate(-135deg);
margin: 0 5px 0 10px;
height: 7px;
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 f7683fb0c2acdcc662f7d430e236f0ffa1324e03..160c48a0b30d7d0a7d4442e9d6e546c97bf10a8d 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
@@ -1,7 +1,7 @@
<div class="structrue-details-container" *ngIf="structure && !isLoading">
<!-- Header info -->
<div fxLayout="row" fxLayoutAlign="end center">
- <div (click)="close(false)" class="ico-close-details"></div>
+ <div (click)="close()" class="ico-close-details"></div>
</div>
<div fxLayout="row" class="structure-details-block" fxLayoutAlign="baseline baseline" fxLayoutGap="8px">
<div fxLayout="column" fxLayoutGap="10px" fxFlex="100%">
@@ -336,7 +336,7 @@
<app-modal-confirmation
[openned]="claimModalOpenned"
[content]="
- 'Voulez-vous vraiment revendiquer cette structure ? Une demande sera envoyée a l\'administrateur pour validation'
+ 'Voulez-vous vraiment revendiquer cette structure ? Une demande sera envoyée à l\'administrateur pour validation'
"
(closed)="claimStructure($event)"
></app-modal-confirmation>
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 19284a7cc69c13612863296b2667cefa0dfa7332..77a9025cc2ea1a08097687f61b7cfa76d1b9acda 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
@@ -18,7 +18,7 @@ a {
left: 0;
max-width: 980px;
width: 100%;
- height: calc(100vh - #{$header-height} - #{$footer-height});
+ height: calc(100vh - #{$header-height} - #{$footer-height} - 20px);
padding: 10px 24px;
overflow: auto;
@media #{$tablet} {
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 9604623b998ad702839646fcd29bad779078a6e6..2bea610b866f383a497841222d6c0497d8b063ae 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
@@ -107,8 +107,10 @@ export class StructureDetailsComponent implements OnInit {
}
}
- public close(refreshRequired: boolean): void {
- this.closeDetails.emit(refreshRequired);
+ public close(): void {
+ this.router.navigate([], {
+ relativeTo: this.route,
+ });
}
public print(): void {
@@ -202,7 +204,7 @@ export class StructureDetailsComponent implements OnInit {
case PublicCategorie.young:
return 'Jeunes (16 - 25 ans)';
case PublicCategorie.adult:
- return 'Adultes (25 - 65 ans)';
+ return 'Adultes';
case PublicCategorie.elderly:
return 'Séniors (+ de 65 ans)';
case PublicCategorie.all:
diff --git a/src/app/structure-list/structure-list.component.ts b/src/app/structure-list/structure-list.component.ts
index 45624ec9e82de52c0c5bb07504e1ae6719840317..22404f28f83b5e1d3da84f4b27216dc6b0a024b0 100644
--- a/src/app/structure-list/structure-list.component.ts
+++ b/src/app/structure-list/structure-list.component.ts
@@ -3,6 +3,8 @@ import { Filter } from './models/filter.model';
import { Structure } from '../models/structure.model';
import { GeoJson } from '../map/models/geojson.model';
import * as _ from 'lodash';
+import { ActivatedRoute, Router } from '@angular/router';
+import { StructureService } from '../services/structure.service';
@Component({
selector: 'app-structure-list',
@@ -28,11 +30,29 @@ export class StructureListComponent implements OnChanges {
private arrayChunked: Structure[][] = [];
private chunck = 10;
- constructor() {}
+ constructor(private route: ActivatedRoute, private router: Router, private structureService: StructureService) {
+ this.route.queryParams.subscribe((queryParams) => {
+ if (queryParams.id) {
+ if (!this.structure) {
+ this.structureService.getStructure(queryParams.id).subscribe((s) => {
+ this.showDetails(new Structure(s));
+ });
+ }
+ } else {
+ this.closeDetails();
+ }
+ });
+ }
ngOnChanges(changes: SimpleChanges): void {
if (changes.selectedStructure && this.selectedStructure) {
this.showDetails(this.selectedStructure);
+ this.router.navigate([], {
+ relativeTo: this.route,
+ queryParams: {
+ id: this.selectedStructure._id,
+ },
+ });
}
if (changes.structureList) {
this.structuresListChunked = this.chunckAnArray(this.structureList);
diff --git a/src/app/user-verification/user-verification.component.html b/src/app/user-verification/user-verification.component.html
index 628bb8efe98b0575616bac18c89923a28424e1f0..c1e11207de2a2234f859bfea4c4f7a6494075bb2 100644
--- a/src/app/user-verification/user-verification.component.html
+++ b/src/app/user-verification/user-verification.component.html
@@ -37,7 +37,13 @@
></div>
</div>
<div class="btnSection" fxLayout="row" fxLayoutAlign="space-around center">
- <button *ngIf="structure && verificationSuccess" class="btn" routerLink="/home" [state]="{ data: structure }">
+ <button
+ *ngIf="structure && verificationSuccess"
+ class="btn"
+ routerLink="/home"
+ [queryParams]="{ id: structure._id }"
+ [state]="{ data: structure }"
+ >
Voir ma structure
</button>
</div>
diff --git a/src/assets/ico/sprite.svg b/src/assets/ico/sprite.svg
index 748235c0a0461254caeaa04b05c826036ee2ebb0..08a36d469f3f3996f893aa748235f81fef761570 100644
--- a/src/assets/ico/sprite.svg
+++ b/src/assets/ico/sprite.svg
@@ -204,6 +204,28 @@
<rect x="5" y="21" width="23" height="2" rx="1" fill="#333333"/>
</symbol>
+<symbol id="news-location" viewBox="0 0 29 31" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.8789 7.40777L13.8789 1.18555" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M13.3789 3.44639V1.86578C13.3665 1.85795 13.3533 1.84995 13.3392 1.84189C13.2087 1.76732 13.0017 1.68555 12.7122 1.68555C12.4228 1.68555 12.2158 1.76732 12.0853 1.84189C12.0712 1.84995 12.058 1.85795 12.0456 1.86578V3.44639C12.2373 3.38974 12.4598 3.35221 12.7122 3.35221C12.9647 3.35221 13.1872 3.38974 13.3789 3.44639Z"/>
+<path d="M11.0469 2.81338V4.39398C11.0345 4.40181 11.0212 4.40981 11.0071 4.41787C10.8766 4.49245 10.6696 4.57422 10.3802 4.57422C10.0908 4.57422 9.88378 4.49245 9.75328 4.41787C9.73917 4.40981 9.72592 4.40181 9.71354 4.39398V2.81338C9.90529 2.87003 10.1278 2.90755 10.3802 2.90755C10.6326 2.90755 10.8551 2.87003 11.0469 2.81338Z"/>
+<path d="M4.34813 13.1299L14.2096 7.21298L24.0711 13.1299H4.34813Z"/>
+<path d="M3.04297 14.1299H25.3763V14.1854C25.3763 14.4616 25.1524 14.6854 24.8763 14.6854H3.54297C3.26683 14.6854 3.04297 14.4616 3.04297 14.1854V14.1299Z" stroke-width="0.777778"/>
+<path d="M3.04297 27.3521H25.3763V27.9076H3.04297V27.3521Z" stroke-width="0.777778"/>
+<path d="M0.710938 29.6855H27.7109V30.2411H0.710938V29.6855Z" stroke-width="0.777778"/>
+<rect x="5.37891" y="16.4634" width="1.33333" height="9.11111"/>
+<rect x="10.8203" y="16.4634" width="1.33333" height="9.11111"/>
+<rect x="16.2656" y="16.4634" width="1.33333" height="9.11111"/>
+<rect x="21.7109" y="16.4634" width="1.33333" height="9.11111"/>
+</symbol>
+
+<symbol id="news-public" viewBox="0 0 29 26" xmlns="http://www.w3.org/2000/svg">
+<path d="M15.8488 19.9496C16.7844 19.3911 17.4109 18.3687 17.4109 17.2C17.4109 15.4327 15.9782 14 14.2109 14C12.4436 14 11.0109 15.4327 11.0109 17.2C11.0109 18.3687 11.6375 19.3911 12.573 19.9496C11.1806 20.5754 10.2109 21.9745 10.2109 23.6V26H18.2109V23.6C18.2109 21.9745 17.2413 20.5754 15.8488 19.9496Z" />
+<path d="M5.84883 19.9496C6.78438 19.3911 7.41094 18.3687 7.41094 17.2C7.41094 15.4327 5.97825 14 4.21094 14C2.44363 14 1.01094 15.4327 1.01094 17.2C1.01094 18.3687 1.6375 19.3911 2.57304 19.9496C1.18059 20.5754 0.210938 21.9745 0.210938 23.6V26H8.21094V23.6C8.21094 21.9745 7.24128 20.5754 5.84883 19.9496Z" />
+<path d="M10.8488 5.94963C11.7844 5.39114 12.4109 4.36874 12.4109 3.2C12.4109 1.43269 10.9782 0 9.21094 0C7.44363 0 6.01094 1.43269 6.01094 3.2C6.01094 4.36874 6.6375 5.39114 7.57304 5.94963C6.18059 6.57538 5.21094 7.97445 5.21094 9.6V12H13.2109V9.6C13.2109 7.97445 12.2413 6.57538 10.8488 5.94963Z" />
+<path d="M25.8488 19.9496C26.7844 19.3911 27.4109 18.3687 27.4109 17.2C27.4109 15.4327 25.9782 14 24.2109 14C22.4436 14 21.0109 15.4327 21.0109 17.2C21.0109 18.3687 21.6375 19.3911 22.573 19.9496C21.1806 20.5754 20.2109 21.9745 20.2109 23.6V26H28.2109V23.6C28.2109 21.9745 27.2413 20.5754 25.8488 19.9496Z" />
+<path d="M20.8488 5.94963C21.7844 5.39114 22.4109 4.36874 22.4109 3.2C22.4109 1.43269 20.9782 0 19.2109 0C17.4436 0 16.0109 1.43269 16.0109 3.2C16.0109 4.36874 16.6375 5.39114 17.573 5.94963C16.1806 6.57538 15.2109 7.97445 15.2109 9.6V12H23.2109V9.6C23.2109 7.97445 22.2413 6.57538 20.8488 5.94963Z"/>
+</symbol>
+
<symbol id="calendar" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
<path d="M8 10H5V13H8V10Z" fill="#333333"/>
diff --git a/src/assets/logos/resin.jpg b/src/assets/logos/resin.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..2e7db87ce1a2a1c6359b707d9e8a6bc599f3ad42
Binary files /dev/null and b/src/assets/logos/resin.jpg differ
diff --git a/src/assets/post/sprite.svg b/src/assets/post/sprite.svg
index fe3e4e45abe4590b91cafff792b4fec8ab443602..53003c36700969b4c82ee8a2e8ee9de0ed0c77da 100644
--- a/src/assets/post/sprite.svg
+++ b/src/assets/post/sprite.svg
@@ -62,4 +62,46 @@
<path fill-rule="evenodd" clip-rule="evenodd" d="M29.2607 17.2341L30.049 14.2559C30.1737 13.7846 29.9418 13.3205 29.5453 13.113L20.8378 26H23.3378L29.2607 17.2341ZM24.8378 26H26.1709C26.6247 26 27.0215 25.6945 27.1376 25.2559L28.2948 20.8837L24.8378 26ZM25.6216 13H28.1216L19.3378 26H16.8378L25.6216 13ZM24.1216 13H21.6216L12.8378 26H15.3378L24.1216 13ZM17.6216 13H20.1216L11.3378 26H8.83784L17.6216 13ZM16.1216 13H13.6216L4.83784 26H7.33784L16.1216 13ZM9.62162 13H12.1216L3.33784 26H3.20521C2.57898 26 2.10683 25.431 2.22239 24.8155L2.44717 23.6182L9.62162 13ZM8.12162 13H5.27041C5.26124 13 5.2521 13.0001 5.24299 13.0004L4.13187 14.6448L3.02434 20.544L8.12162 13Z" stroke="none"/>
</symbol>
+<symbol id="publishLogo" viewBox="0 0 310 273" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g opacity="0.35" filter="url(#filter0_f)">
+<path d="M12 76.7061L181.621 30.7062L283.777 208.44L114.155 254.44L12 76.7061Z" fill="#348899"/>
+</g>
+<path d="M114.638 253.273L13.5131 77.3318L181.138 31.8732L282.263 207.814L114.638 253.273Z" fill="#EAF8FB" stroke="#79ACB6" stroke-width="2"/>
+<path d="M56.0084 117.902C54.7257 115.671 55.8543 112.826 58.3181 112.08L188.148 72.8014C189.929 72.2624 191.847 73.0232 192.774 74.6367L215.093 113.467C216.376 115.699 215.247 118.544 212.783 119.289L82.9533 158.568C81.172 159.107 79.2544 158.346 78.327 156.733L56.0084 117.902Z" fill="#ABE6F2"/>
+<path d="M72.5 81.3037L150.685 57.8712L154.671 64.8072L76.4866 88.2397L72.5 81.3037Z" fill="#117083"/>
+<path d="M86.5 167.953L139.359 152.241L142.5 157.706L89.6408 173.418L86.5 167.953Z" fill="#117083"/>
+<path d="M91.5 176.445L144.359 160.733L147.5 166.198L94.6408 181.91L91.5 176.445Z" fill="#117083"/>
+<path d="M96.5 185.445L149.359 169.733L152.5 175.198L99.6408 190.91L96.5 185.445Z" fill="#117083"/>
+<path d="M102.5 193.444L155.359 177.732L158.5 183.197L105.641 198.909L102.5 193.444Z" fill="#117083"/>
+<path d="M107.5 202.444L160.359 186.732L163.5 192.197L110.641 207.909L107.5 202.444Z" fill="#117083"/>
+<path d="M112.5 211.444L165.359 195.732L168.5 201.197L115.641 216.909L112.5 211.444Z" fill="#117083"/>
+<path d="M116.5 221.444L169.359 205.732L172.5 211.197L119.641 226.909L116.5 221.444Z" fill="#117083"/>
+<path d="M145.5 150.444L198.359 134.732L201.5 140.197L148.641 155.909L145.5 150.444Z" fill="#117083"/>
+<path d="M151.5 158.444L204.359 142.732L207.5 148.197L154.641 163.909L151.5 158.444Z" fill="#117083"/>
+<path d="M156.5 167.444L178.359 161.241L181.5 166.706L159.641 172.909L156.5 167.444Z" fill="#117083"/>
+<path d="M100 84.6553L139.091 72.7225L143.078 79.6584L103.987 91.5912L100 84.6553Z" fill="#117083"/>
+<g opacity="0.35" filter="url(#filter1_f)">
+<path d="M252.112 73.7334C249.503 71.652 246.024 71.6753 244.34 73.7856L235.054 85.4249L235.088 85.4519L190.698 141.075L205.252 152.855L190.571 141.242L189.299 142.837C188.606 143.704 188.299 144.837 188.429 146.05L186.205 161.648L185.788 163.604C185.445 165.216 187.089 166.528 188.585 165.835L189.273 165.516C189.436 165.526 189.6 165.521 189.763 165.502L205.18 159.287C206.391 159.144 207.427 158.594 208.12 157.726L209.393 156.131L209.391 156.129L253.778 100.509L253.779 100.51L263.064 88.8704C264.748 86.7602 263.999 83.3622 261.391 81.2807L252.112 73.7334Z" fill="#DC2A59"/>
+</g>
+<path d="M252.739 72.9577L252.739 72.9576L252.732 72.9518C249.854 70.6558 245.7 70.4733 243.554 73.1618L243.554 73.1619L234.269 84.8012L233.648 85.5792L233.682 85.6061L189.913 140.452L189.293 141.228L189.297 141.231L188.513 142.213C187.666 143.275 187.298 144.626 187.418 146.026L185.216 161.473L184.806 163.395C184.291 165.813 186.758 167.781 189.001 166.743L189.48 166.521C189.612 166.519 189.744 166.511 189.876 166.495L190.009 166.48L190.133 166.43L205.432 160.262C206.819 160.067 208.052 159.409 208.898 158.35L210.17 156.755L210.798 155.969L210.796 155.967L253.929 101.918L253.93 101.918L254.557 101.133L263.842 89.4942C265.986 86.807 264.889 82.7988 262.014 80.5023C262.013 80.5013 262.012 80.5002 262.01 80.4991L252.739 72.9577Z" fill="#E04971" stroke="#E0718E" stroke-width="2"/>
+<path d="M244.336 73.7856C246.02 71.6754 249.499 71.652 252.108 73.7335L261.386 81.2808C263.995 83.3622 264.744 86.7602 263.06 88.8705L253.775 100.51L235.05 85.4249L244.336 73.7856Z" fill="#E04971"/>
+<path d="M254.161 100.03L235.505 84.9298L190.698 141.076L209.354 156.176L254.161 100.03Z" fill="#E0718E"/>
+<path d="M209.393 156.131L190.571 141.242L189.298 142.837C188.606 143.705 188.299 144.838 188.429 146.05L186.075 162.56C186.257 164.27 188.054 165.704 189.762 165.503L205.18 159.288C206.391 159.145 207.427 158.594 208.12 157.727L209.393 156.131Z" fill="#FDECF0"/>
+<path d="M185.399 164.08C185.176 165.596 186.672 166.789 188.101 166.236L194.734 163.665C194.734 163.665 194.763 161.501 191.65 159.018C188.537 156.534 186.434 157.041 186.434 157.041L185.399 164.08Z" fill="#E04971"/>
+<rect x="190.742" y="140.706" width="24.0099" height="2" transform="rotate(38.3738 190.742 140.706)" fill="white"/>
+<rect x="236.152" y="84.0303" width="24.0422" height="2" transform="rotate(38.3738 236.152 84.0303)" fill="white"/>
+<defs>
+<filter id="filter0_f" x="0" y="18.7061" width="295.777" height="247.734" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="6" result="effect1_foregroundBlur"/>
+</filter>
+<filter id="filter1_f" x="173.742" y="60.1875" width="102.221" height="117.837" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="6" result="effect1_foregroundBlur"/>
+</filter>
+</defs>
+</symbol>
+
</svg>
diff --git a/src/assets/scss/_layout.scss b/src/assets/scss/_layout.scss
index 2a4a34f6e6a7f63f32a0113379bd9ccc4c302c31..3da7ec5824fd3a195d13192e2ec305972e27637d 100644
--- a/src/assets/scss/_layout.scss
+++ b/src/assets/scss/_layout.scss
@@ -3,4 +3,4 @@ $footer-height: 56px;
$header-height-phone: 70px;
$footer-height-phone: 75px;
$progressBar-height: 50px;
-$header-post-height: 180px;
+$header-post-height: 140px;
diff --git a/src/index.html b/src/index.html
index 17a60d8dc5ca086b2bc6e590f6f49aa944a87ad5..7a2041e9771b12f05c52401b5b56a440c11229c9 100644
--- a/src/index.html
+++ b/src/index.html
@@ -11,8 +11,6 @@
content="Plateforme à destination des acteurs de l'inclusion numérique de la métropole de Lyon"
/>
<meta property="og:image" content="https://resin.grandlyon.com/assets/logos/logo_1200.svg" />
- >
-
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<link rel="stylesheet" href="https://openlayers.org/en/v4.6.5/css/ol.css" type="text/css" />
<link
diff --git a/src/styles.scss b/src/styles.scss
index af9bc276813e243bbb1b06f9a424dd65c48d93cd..a6fabff7a520ed058b50f3eb538c6a9d51ebda58 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -106,7 +106,7 @@ button {
opacity: 0;
display: none;
&:checked ~ .customCheck {
- background-color: $primary-color;
+ background-color: $green-1;
border-color: transparent;
}
&:checked ~ .customCheck:after {