From f18e27a183a638580b1b11532e9c0c12979d0132 Mon Sep 17 00:00:00 2001
From: Stephen Abello <stephen.abello@combodo.com>
Date: Wed, 18 Dec 2019 09:39:37 +0100
Subject: [PATCH] =?UTF-8?q?N=C2=B02314=20Setup=20progress=20bar=20is=20now?=
 =?UTF-8?q?=20cuter=20(following=2001cb88a)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 css/setup.css  | 24 +++++++++++++++++++++---
 css/setup.scss | 28 +++++++++++++++++++++++-----
 2 files changed, 44 insertions(+), 8 deletions(-)

diff --git a/css/setup.css b/css/setup.css
index 0e81f5936..2424890f1 100644
--- a/css/setup.css
+++ b/css/setup.css
@@ -25,7 +25,23 @@
     background-color: #fbd38d;
   }
   to {
-    background-color: #f4c56e;
+    background-color: #feebc8;
+  }
+}
+@-webkit-keyframes bg-pan-left {
+  0% {
+    background-position: 100% 50%;
+  }
+  100% {
+    background-position: 0% 50%;
+  }
+}
+@keyframes bg-pan-left {
+  0% {
+    background-position: 100% 50%;
+  }
+  100% {
+    background-position: 0% 50%;
   }
 }
 /* Theme */
@@ -158,9 +174,11 @@ table.formTable {
 #progress .progress {
   color: #000 !important;
   /* !important to overload jQuery UI style */
-  background-color: #fbd38d !important;
+  background-image: linear-gradient(270deg, #fbd38d 50%, #feebc8 55%, #fbd38d 80%) !important;
   /* !important to overload jQuery UI style */
-  animation: progress_bar_color_ongoing 0.8s infinite alternate;
+  animation: bg-pan-left 3s infinite both;
+  background-size: 600% 100%;
+  border-radius: inherit;
 }
 #progress .progress.progress-error {
   background-color: #e53e3e !important;
diff --git a/css/setup.scss b/css/setup.scss
index beb1cbb0e..82b22d046 100644
--- a/css/setup.scss
+++ b/css/setup.scss
@@ -45,8 +45,8 @@ $message-error-bg-color: #FFF5F5 !default;
 // Compilation progress bar
 $progress-bar-color: #000000 !default;
 $progress-bar-ongoing-1-bg-color: #FBD38D !default;
-$progress-bar-ongoing-2-bg-color: #F4C56E !default;
-$progress-bar-error-bg-color: #E53E3E !default;
+$progress-bar-ongoing-2-bg-color: #FEEBC8 !default;
+$progress-bar-error-bg-color: #F56565 !default;
 
 /* Helpers classes */
 .center {
@@ -58,6 +58,22 @@ $progress-bar-error-bg-color: #E53E3E !default;
 	from { background-color: $progress-bar-ongoing-1-bg-color; }
 	to { background-color: $progress-bar-ongoing-2-bg-color; }
 }
+@-webkit-keyframes bg-pan-left {
+    0% {
+        background-position: 100% 50%;
+    }
+    100% {
+        background-position: 0% 50%;
+    }
+}
+@keyframes bg-pan-left {
+    0% {
+        background-position: 100% 50%;
+    }
+    100% {
+        background-position: 0% 50%;
+    }
+}
 
 /* Theme */
 body {
@@ -193,10 +209,12 @@ table.formTable {
     
     .progress{
 		color: $progress-bar-color !important; /* !important to overload jQuery UI style */
-		background-color: $progress-bar-ongoing-1-bg-color !important; /* !important to overload jQuery UI style */
-		animation: progress_bar_color_ongoing 0.8s infinite alternate;
-
+        background-image: linear-gradient(270deg, $progress-bar-ongoing-1-bg-color 50%, $progress-bar-ongoing-2-bg-color 55%, $progress-bar-ongoing-1-bg-color 80%) !important; /* !important to overload jQuery UI style */
+        animation: bg-pan-left 3s infinite both;
+        background-size: 600% 100%;
+        border-radius: inherit;
         &.progress-error{
+            background-image: none !important;
             background-color: $progress-bar-error-bg-color !important; /* !important to overload jQuery UI style */
 			animation: none;
         }