Selaa lähdekoodia

HUE-3586 [editor] Better feedback when waiting for the first progress of a query

Enrico Berti 9 vuotta sitten
vanhempi
commit
cc1175a

+ 17 - 18
desktop/libs/notebook/src/notebook/static/notebook/css/notebook.css

@@ -578,63 +578,62 @@ h1.empty {
 }
 
 .progress-starting .bar {
-  background-color: #CCC;
+  background-color: #fdae6b;
 }
 
 @-webkit-keyframes pulsate {
   0% {
-    opacity: 0;
+    margin-left: 0;
   }
   50% {
-    opacity: 1;
+    margin-left: 30px;
   }
   100% {
-    opacity: 0;
+    margin-left: 0;
   }
 }
 
 @-moz-keyframes pulsate {
   0% {
-    opacity: 0;
+    margin-left: 0;
   }
   50% {
-    opacity: 1;
+    margin-left: 30px;
   }
   100% {
-    opacity: 0;
+    margin-left: 0;
   }
 }
 
 @-o-keyframes pulsate {
   0% {
-    opacity: 0;
+    margin-left: 0;
   }
   50% {
-    opacity: 1;
+    margin-left: 30px;
   }
   100% {
-    opacity: 0;
+    margin-left: 0;
   }
 }
 
 @keyframes pulsate {
   0% {
-    opacity: 0;
+    margin-left: 0;
   }
   50% {
-    opacity: 1;
+    margin-left: 30px;
   }
   100% {
-    opacity: 0;
+    margin-left: 0;
   }
 }
 
 .progress-starting {
-  -webkit-animation: pulsate 2s infinite;
-  -moz-animation: pulsate 2s infinite;
-  -o-animation: pulsate 2s infinite;
-  animation: pulsate 2s infinite;
-  opacity: 0;
+  -webkit-animation: pulsate 1s infinite;
+  -moz-animation: pulsate 1s infinite;
+  -o-animation: pulsate 1s infinite;
+  animation: pulsate 1s infinite;
 }
 
 .progress-success .bar, .progress .bar-success {

+ 1 - 1
desktop/libs/notebook/src/notebook/templates/editor_components.mako

@@ -1086,7 +1086,7 @@ ${ hueIcons.symbols() }
         'progress-warning': progress() > 0 && progress() < 100,
         'progress-success': progress() == 100,
         'progress-danger': progress() == 0 && errors().length > 0}" style="background-color: #FFF; width: 100%">
-        <div class="bar" data-bind="style: {'width': (errors().length > 0 ? 100 : Math.max(1,progress())) + '%'}"></div>
+        <div class="bar" data-bind="style: {'width': (errors().length > 0 ? 100 : Math.max(2,progress())) + '%'}"></div>
       </div>
     </div>
     <div class="snippet-error-container alert alert-error alert-error-gradient" style="margin-bottom: 0" data-bind="visible: errors().length > 0">