IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Delayed explore query loading indicator and implemented minor ux improvements to it

Browse Source
This commit is contained in:
Dominik Prokop 2019-01-28 14:07:45 +01:00
parent 07331b4c07
commit d947748dd4
1 changed files with 4 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
public/sass/pages/_explore.scss
View File

@ -118,11 +118,6 @@
overflow: hidden; overflow: hidden;
background: none; background: none;
margin: $panel-margin / 2; margin: $panel-margin / 2;
transition: background-color 1s ease;
}
.explore-panel__loader--active {
background: $text-color-faint;
} }
.explore-panel__loader--active:after { .explore-panel__loader--active:after {
@ -133,16 +128,19 @@
top: -50%; top: -50%;
height: 250%; height: 250%;
position: absolute; position: absolute;
animation: loader 2s cubic-bezier(0.17, 0.67, 0.83, 0.67); animation: loader 2s cubic-bezier(0.17, 0.67, 0.83, 0.67) 500ms;
animation-iteration-count: 100; animation-iteration-count: 100;
left: -25%;
background: $blue; background: $blue;
} }
@keyframes loader { @keyframes loader {
from { from {
left: -25%; left: -25%;
opacity: .1;
} }
to { to {
opacity: 1;
left: 100%; left: 100%;
} }
} }