From d96356fbe2934173474d959b1ff21d736e48e70f Mon Sep 17 00:00:00 2001
From: piensaenpixel <piensaenpixel@gmail.com>
Date: Wed, 4 May 2016 17:41:32 +0200
Subject: [PATCH] add new state

---
 src/scss/cdb-components/loader.scss | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)

diff --git a/src/scss/cdb-components/loader.scss b/src/scss/cdb-components/loader.scss
index 18fa415..a52867d 100644
--- a/src/scss/cdb-components/loader.scss
+++ b/src/scss/cdb-components/loader.scss
@@ -54,7 +54,7 @@ This is the generic loader for widgets, maps, components, ...
   </div>
 </div>
 
-<div style="padding: 20px; background: #2E3C43;">
+<div style="padding: 20px; background: #F9F9F9;">
   <div class="CDB-LoaderIcon is-grey">
     <div class="CDB-LoaderIcon-item">
       <span class="CDB-LoaderIcon-itemClose"></span>
@@ -63,6 +63,15 @@ This is the generic loader for widgets, maps, components, ...
   </div>
 </div>
 
+<div style="padding: 20px; background: #2E3C43;">
+  <div class="CDB-LoaderIcon is-dark">
+    <div class="CDB-LoaderIcon-item">
+      <span class="CDB-LoaderIcon-itemClose"></span>
+      <span class="CDB-LoaderIcon-itemCircle"></span>
+    </div>
+  </div>
+</div>
+
 <div style="padding: 20px; background: #E27D61;">
   <div class="CDB-LoaderIcon is-bg">
     <div class="CDB-LoaderIcon-item">
@@ -85,7 +94,7 @@ This is the generic loader for widgets, maps, components, ...
   &.is-bg {
     border: 2px solid rgba($cWhite, 0.9);
   }
-  &.is-grey {
+  &.is-dark {
     border: 2px solid $cSecondaryText;
   }
 }
@@ -100,7 +109,7 @@ This is the generic loader for widgets, maps, components, ...
   border-radius: 50%;
   background: linear-gradient(to right, rgba($cWhite, 0.1) 10%, rgba($cWhite, 0) 42%);
 
-  &.is-grey {
+  &.is-dark {
     background: linear-gradient(to right, $cMainBg 10%, rgba($cWhite, 0) 42%);
   }
 }
@@ -131,12 +140,15 @@ This is the generic loader for widgets, maps, components, ...
   background: $cWhite;
 }
 
-.CDB-LoaderIcon.is-grey .CDB-LoaderIcon-itemCircle,
-.CDB-LoaderIcon.is-grey .CDB-LoaderIcon-itemClose {
+.CDB-LoaderIcon.is-dark .CDB-LoaderIcon-itemCircle,
+.CDB-LoaderIcon.is-dark .CDB-LoaderIcon-itemClose {
   background: $cMainBg;
 }
 
-
+.CDB-LoaderIcon.is-grey .CDB-LoaderIcon-itemCircle,
+.CDB-LoaderIcon.is-grey .CDB-LoaderIcon-itemClose {
+  background: $cThirdBackground;
+}
 
 @include keyframes(loader-icon) {
   0% {