loaders.scss in uniform-ui-3.0.0.beta2

- old
+ new
@@ -1,77 +1,54 @@
 .uniformLoader{
     line-height:1em;
     display:inline-block;
     white-space:nowrap;
-    letter-spacing:-.05em;
-    span{
-        width: 1em;
+    &:before,
+    &:after{
+        margin: 0 0.2em;
+        width: 0.8em;
+        height: 0.8em;
+        border-radius: 50%;
+        background-color: currentColor;
         display: inline-block;
         vertical-align: middle;
-        text-align: center;
-        &:before{
-            animation: uniformLoader 1.4s infinite ease both;
-            animation-delay: 0.3s;
-            line-height: 0;
-            vertical-align: middle;
-            display: inline-block;
-            width: 80%;
-            content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 104 104'><circle cx='52' cy='52' r='52' fill='white'/><circle cx='50' cy='50' r='50' fill='black'/></svg>")
-        }
+        line-height: 0;
+        animation: uniformLoader 1.4s infinite cubic-bezier(0.65,0,0.35,1);
+        content: "";
     }
-    span:first-of-type:before{
-        animation-delay: 0s;
+    &:after{
+        animation-delay: 0.7s;
     }
-    span:last-of-type:before{
-        animation-delay: 0.6s;
-    }
-    .uniformLoader-container{
-        white-space:nowrap;
-    }
-    &.-light{
-        span{
-            &:before{
-                content: url("data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 104 104'><circle cx='52' cy='52' r='52' fill='black'/><circle cx='54' cy='54' r='50' fill='white'/></svg>")
-            }
-        }
-    }
+    
     &.-cover{
-        display:block;
-        background:rgba(white, 0.5);
         position:absolute;
-        top:0;
-        left:0;
-        width:100%;
-        height:100%;
-        z-index:999999999;
-        .uniformLoader-container{
-            position:absolute;
-            @include position-center;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        &:before,
+        &:after{
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            margin-top: -0.4em;
+            margin-left: -0.4em;
         }
-        &.-light{
-            background:rgba(black, .5);
-        }
-        &.transparent{
-            background: none;
-        }
+        &:before {margin-right: 1.2em;}
+        &:after { margin-left: 0.8em;}
     }
-    &.-top{
-        .uniformLoader-container{
-            top: 20px;
-        }
-    }
 }
 
 @keyframes uniformLoader {
     0% {
         -webkit-transform: scale(0);
         transform: scale(0);
         opacity: 0;
     }
-    35%{
+    50%{
         -webkit-transform: scale(1);
         transform: scale(1);
-        opacity: 0.8;
+        opacity: 1;
     }
     100%{
         -webkit-transform: scale(0);
         transform: scale(0);
         opacity: 0;