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 2d6c15596f98a52c5ea0e3b483ee85358844cbbe..c5577e7c1021c71bfd98f967ed6b60652b9e25fd 100644 --- a/src/app/post/components/post-list/post-list.component.html +++ b/src/app/post/components/post-list/post-list.component.html @@ -1,5 +1,8 @@ <div *ngIf="!isPublishMode" class="section-container" fxLayout="row" fxLayoutGap="32px"> - <div fxLayout="column" class="list-container" fxLayoutGap="16px"> + <div *ngIf="isLoading" class="loader"> + <img class="loader-gif" src="/assets/gif/loader_circle.gif" alt /> + </div> + <div *ngIf="!isLoading" fxLayout="column" class="list-container" fxLayoutGap="16px"> <div fxLayout="column" *ngIf="displayTags()"> <div fxLayout="row wrap" fxLayoutAlign="none center" fxLayoutGap="8px"> <div @@ -76,7 +79,7 @@ </div> </div> </div> - <div fxLayout="column" fxLayoutAlign=" center" class="project-container desktop"> + <div *ngIf="!isLoading" fxLayout="column" fxLayoutAlign=" center" class="project-container desktop"> <div class="background-project-container"> <div class="project-content" fxLayout="column"> <app-svg-icon [iconClass]="'icon-80'" [iconColor]="'inherit'" [type]="'post'" [icon]="'appels'"></app-svg-icon> 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 43d3381e4e5a290b96e83a43c57ae0335d204566..a4b612844251f4e976076911f45d4933b3d05461 100644 --- a/src/app/post/components/post-list/post-list.component.scss +++ b/src/app/post/components/post-list/post-list.component.scss @@ -3,6 +3,15 @@ @import '../../../../assets/scss/shapes'; @import '../../../../assets/scss/breakpoint'; +.loader { + width: 100%; + text-align: center; + .loader-gif { + min-width: 10%; + min-height: 10%; + } +} + .section-container { background: $grey-6; min-height: 68vh; diff --git a/src/assets/gif/loader_circle.gif b/src/assets/gif/loader_circle.gif new file mode 100644 index 0000000000000000000000000000000000000000..d6e6ff141451ac14ade4b62c97c353fa0b31faf1 Binary files /dev/null and b/src/assets/gif/loader_circle.gif differ