diff --git a/public/app/features/explore/Panel.tsx b/public/app/features/explore/Panel.tsx index dc75cb0ecca..093bcd9c711 100644 --- a/public/app/features/explore/Panel.tsx +++ b/public/app/features/explore/Panel.tsx @@ -13,7 +13,6 @@ export default class Panel extends PureComponent { render() { const { isOpen, loading } = this.props; const iconClass = isOpen ? 'fa fa-caret-up' : 'fa fa-caret-down'; - const loaderClass = loading ? 'explore-panel__loader explore-panel__loader--active' : 'explore-panel__loader'; return (
@@ -24,7 +23,11 @@ export default class Panel extends PureComponent {
{isOpen && (
-
+ {loading && ( + + + + )} {this.props.children}
)} diff --git a/public/sass/pages/_dashboard.scss b/public/sass/pages/_dashboard.scss index a0ff9fd877c..d04e11f8a2b 100644 --- a/public/sass/pages/_dashboard.scss +++ b/public/sass/pages/_dashboard.scss @@ -144,8 +144,8 @@ div.flot-text { .panel-loading { position: absolute; - top: -3px; - right: 0px; + top: 0; + right: 3px; z-index: 800; font-size: $font-size-sm; color: $text-color-weak; diff --git a/public/sass/pages/_explore.scss b/public/sass/pages/_explore.scss index abd13a10368..b99200ae031 100644 --- a/public/sass/pages/_explore.scss +++ b/public/sass/pages/_explore.scss @@ -112,40 +112,6 @@ flex-wrap: wrap; } - .explore-panel__loader { - height: 2px; - position: relative; - overflow: hidden; - background: none; - margin: $panel-margin / 2; - transition: background-color 1s ease; - } - - .explore-panel__loader--active { - background: $text-color-faint; - } - - .explore-panel__loader--active:after { - content: ' '; - display: block; - width: 25%; - top: 0; - top: -50%; - height: 250%; - position: absolute; - animation: loader 2s cubic-bezier(0.17, 0.67, 0.83, 0.67); - animation-iteration-count: 100; - background: $blue; - } - - @keyframes loader { - from { - left: -25%; - } - to { - left: 100%; - } - } .datasource-picker { min-width: 200px;