aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2016-06-05 08:48:44 +0200
committerChocobozzz <florian.bigard@gmail.com>2016-06-05 08:48:44 +0200
commite56b20f5872bc640b59501817bc41fb0db09c253 (patch)
tree3f1ec7e29b96d72f022ed3f0e9a810f6c27edaae
parent1cdb5c0f582502eac4d851cecc015e81cf16316b (diff)
downloadPeerTube-e56b20f5872bc640b59501817bc41fb0db09c253.tar.gz
PeerTube-e56b20f5872bc640b59501817bc41fb0db09c253.tar.zst
PeerTube-e56b20f5872bc640b59501817bc41fb0db09c253.zip
Add loader indication when loading videos list
-rw-r--r--client/src/app/videos/shared/loader/loader.component.html2
-rw-r--r--client/src/app/videos/shared/loader/loader.component.scss4
-rw-r--r--client/src/app/videos/video-list/video-list.component.scss5
-rw-r--r--client/src/app/videos/video-watch/video-watch.component.html3
-rw-r--r--client/src/app/videos/video-watch/video-watch.component.scss7
5 files changed, 14 insertions, 7 deletions
diff --git a/client/src/app/videos/shared/loader/loader.component.html b/client/src/app/videos/shared/loader/loader.component.html
index d02296a2d..38d06950e 100644
--- a/client/src/app/videos/shared/loader/loader.component.html
+++ b/client/src/app/videos/shared/loader/loader.component.html
@@ -1,3 +1,3 @@
1<div id="video-loading" class="col-md-12 text-center" *ngIf="loading"> 1<div id="video-loading" *ngIf="loading">
2 <div class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></div> 2 <div class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></div>
3</div> 3</div>
diff --git a/client/src/app/videos/shared/loader/loader.component.scss b/client/src/app/videos/shared/loader/loader.component.scss
index 454195811..44cf1f9da 100644
--- a/client/src/app/videos/shared/loader/loader.component.scss
+++ b/client/src/app/videos/shared/loader/loader.component.scss
@@ -1,7 +1,3 @@
1div {
2 margin-top: 150px;
3}
4
5// Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d 1// Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d
6.glyphicon-refresh-animate { 2.glyphicon-refresh-animate {
7 -animation: spin .7s infinite linear; 3 -animation: spin .7s infinite linear;
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 5ba39f8f2..dc2c065d8 100644
--- a/client/src/app/videos/video-list/video-list.component.scss
+++ b/client/src/app/videos/video-list/video-list.component.scss
@@ -16,6 +16,11 @@
16 font-size: 13px; 16 font-size: 13px;
17 padding-left: 0; 17 padding-left: 0;
18 } 18 }
19
20 my-loader {
21 display: inline-block;
22 margin-left: 5px;
23 }
19} 24}
20 25
21.videos-miniatures { 26.videos-miniatures {
diff --git a/client/src/app/videos/video-watch/video-watch.component.html b/client/src/app/videos/video-watch/video-watch.component.html
index 6c36b27e2..353cb2241 100644
--- a/client/src/app/videos/video-watch/video-watch.component.html
+++ b/client/src/app/videos/video-watch/video-watch.component.html
@@ -1,6 +1,5 @@
1<my-loader [loading]="loading"></my-loader>
2
3<div class="embed-responsive embed-responsive-19by9"> 1<div class="embed-responsive embed-responsive-19by9">
2 <my-loader [loading]="loading"></my-loader>
4</div> 3</div>
5 4
6<div id="torrent-info"> 5<div id="torrent-info">
diff --git a/client/src/app/videos/video-watch/video-watch.component.scss b/client/src/app/videos/video-watch/video-watch.component.scss
index 1228d42f4..474de74d9 100644
--- a/client/src/app/videos/video-watch/video-watch.component.scss
+++ b/client/src/app/videos/video-watch/video-watch.component.scss
@@ -1,3 +1,10 @@
1my-loader {
2 display: block;
3 padding-top: 200px;
4 width: 100%;
5 text-align: center;
6}
7
1.embed-responsive { 8.embed-responsive {
2 height: 500px; 9 height: 500px;
3} 10}