aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2016-06-04 18:53:11 +0200
committerChocobozzz <florian.bigard@gmail.com>2016-06-04 18:53:11 +0200
commit7914607ecde6fa6a3cb197a4369e7514833af3a2 (patch)
tree5f9bd4f576cbb2f2be1fe7f5862c0211ae452721 /client/src/app
parent192ea60b82806669fd633888fe9641f24bd5abd3 (diff)
downloadPeerTube-7914607ecde6fa6a3cb197a4369e7514833af3a2.tar.gz
PeerTube-7914607ecde6fa6a3cb197a4369e7514833af3a2.tar.zst
PeerTube-7914607ecde6fa6a3cb197a4369e7514833af3a2.zip
Apply a fade instead of a loader when loading videos
Diffstat (limited to 'client/src/app')
-rw-r--r--client/src/app/videos/video-list/video-list.component.html4
-rw-r--r--client/src/app/videos/video-list/video-list.component.scss16
2 files changed, 15 insertions, 5 deletions
diff --git a/client/src/app/videos/video-list/video-list.component.html b/client/src/app/videos/video-list/video-list.component.html
index 80b1e7b1b..155025b5e 100644
--- a/client/src/app/videos/video-list/video-list.component.html
+++ b/client/src/app/videos/video-list/video-list.component.html
@@ -4,11 +4,9 @@
4</div> 4</div>
5 5
6<div class="videos-miniatures"> 6<div class="videos-miniatures">
7 <my-loader [loading]="loading"></my-loader>
8
9 <div class="col-md-12 no-video" *ngIf="noVideo()">There is no video.</div> 7 <div class="col-md-12 no-video" *ngIf="noVideo()">There is no video.</div>
10 8
11 <my-video-miniature *ngFor="let video of videos" [video]="video" [user]="user" (removed)="onRemoved(video)"> 9 <my-video-miniature class="ng-animate "*ngFor="let video of videos" [video]="video" [user]="user" (removed)="onRemoved(video)">
12 </my-video-miniature> 10 </my-video-miniature>
13</div> 11</div>
14 12
diff --git a/client/src/app/videos/video-list/video-list.component.scss b/client/src/app/videos/video-list/video-list.component.scss
index 9441d80c3..5ba39f8f2 100644
--- a/client/src/app/videos/video-list/video-list.component.scss
+++ b/client/src/app/videos/video-list/video-list.component.scss
@@ -21,8 +21,20 @@
21.videos-miniatures { 21.videos-miniatures {
22 min-height: 600px; 22 min-height: 600px;
23 23
24 my-videos-miniature { 24 my-video-miniature {
25 display: inline-block; 25 transition: all 0.5s ease;
26
27 &.ng-enter {
28 opacity: 0;
29 }
30
31 &.ng-enter-active {
32 opacity: 1;
33 }
34
35 &.ng-leave {
36 opacity: 0;
37 }
26 } 38 }
27 39
28 .no-video { 40 .no-video {