From f47a083d709aebf353695731983bf3d4cc10e544 Mon Sep 17 00:00:00 2001
From: Anton Gorbylev <25773069+keymnsk@users.noreply.github.com>
Date: Fri, 15 Dec 2017 00:33:59 +0200
Subject: [PATCH] feat(css): add a delay before showing loading spinner (#4806)

---
 src/css/components/_loading.scss | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/src/css/components/_loading.scss b/src/css/components/_loading.scss
index f3999c542e..df3c4ea04b 100644
--- a/src/css/components/_loading.scss
+++ b/src/css/components/_loading.scss
@@ -17,11 +17,14 @@
   width: 50px;
   height: 50px;
   border-radius: 25px;
+  visibility: hidden;
 }
 
 .vjs-seeking .vjs-loading-spinner,
 .vjs-waiting .vjs-loading-spinner {
   display: block;
+  // add a delay before actual show the spinner
+  animation: 0s linear 0.3s forwards vjs-spinner-show;
 }
 
 .vjs-loading-spinner:before,
@@ -61,6 +64,18 @@
   animation-delay: 0.44s;
 }
 
+@keyframes vjs-spinner-show {
+  to {
+    visibility: visible;
+  }
+}
+
+@-webkit-keyframes vjs-spinner-show {
+  to {
+    visibility: visible;
+  }
+}
+
 @keyframes vjs-spinner-spin {
   100% {
     transform: rotate(360deg);