cartodb4/CartoAssets
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

change loader

Browse Source
This commit is contained in:
piensaenpixel 2017-03-07 12:14:22 +01:00
parent c989154ff5
commit 9de6ac6f4b
1 changed files with 10 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/scss/cdb-components/loader.scss
View File

@ -17,28 +17,26 @@ This is the generic loader for widgets, maps, components, ...
@import '../cdb-variables/sizes'; @import '../cdb-variables/sizes';
.CDB-Loader { .CDB-Loader {
@include css3-prefix(animation, loader-progress 1000ms linear 1);
@include opacity(0);
@include transition(opacity, 1000ms);
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 50%;
height: 2px; height: 3px;
background: rgba($cBlue, 1); transform: translateX(-200%);
background-image: linear-gradient(90deg, rgba($cBlue, 1) 0%, #32BBFE 90%, #FAFEFF 95%);
z-index: 2; z-index: 2;
} }
.CDB-Loader.is-visible { .CDB-Loader.is-visible {
@include css3-prefix(animation, loader-progress 2000ms linear infinite); @include css3-prefix(animation, loader-progress 1s cubic-bezier(0, 0.85, 0.6, 0.6) infinite);
@include opacity(1);
} }
@include keyframes(loader-progress) { @include keyframes(loader-progress) {
0% { from {
width: 0; transform: translateX(-200%);
} }
100% { to {
width: 100%; transform: translateX(200%);
} }
} }