From 157cb9c9713e08ff70078660a32dd77ecb87eabc Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Thu, 26 May 2016 20:40:03 +0200 Subject: Add a loader animation when loading the videos list --- client/angular/videos/loader.component.scss | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) create mode 100644 client/angular/videos/loader.component.scss (limited to 'client/angular/videos/loader.component.scss') diff --git a/client/angular/videos/loader.component.scss b/client/angular/videos/loader.component.scss new file mode 100644 index 000000000..454195811 --- /dev/null +++ b/client/angular/videos/loader.component.scss @@ -0,0 +1,26 @@ +div { + margin-top: 150px; +} + +// Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d +.glyphicon-refresh-animate { + -animation: spin .7s infinite linear; + -ms-animation: spin .7s infinite linear; + -webkit-animation: spinw .7s infinite linear; + -moz-animation: spinm .7s infinite linear; +} + +@keyframes spin { + from { transform: scale(1) rotate(0deg);} + to { transform: scale(1) rotate(360deg);} +} + +@-webkit-keyframes spinw { + from { -webkit-transform: rotate(0deg);} + to { -webkit-transform: rotate(360deg);} +} + +@-moz-keyframes spinm { + from { -moz-transform: rotate(0deg);} + to { -moz-transform: rotate(360deg);} +} -- cgit v1.2.3