refactor color variables.

idmontie · Mar 4, 2015 · cabdd25 · cabdd25
1 parent 2089971
commit cabdd25
Show file tree

Hide file tree

Showing 6 changed files with 12 additions and 10 deletions.
diff --git a/build/hover-effects.css b/build/hover-effects.css
diff --git a/build/hover-effects.css.map b/build/hover-effects.css.map
diff --git a/build/hover-effects.min.css b/build/hover-effects.min.css
diff --git a/src/_variables.scss b/src/_variables.scss
@@ -160,6 +160,8 @@ $hover-effect-winston-delay:                   $hover-effect-default-short-delay
 $hover-effect-winston-speed:                   .45s !default;
 $hover-effect-winston-slow-speed:              $hover-effect-default-speed !default;
 $hover-effect-winston-background-color:        $hover-effect-background-color !default;
+$hover-effect-winston-font-color:              $hover-effect-background-color !default;
+$hover-effect-winston-border-color:            $hover-effect-border-color !default;
 
 // Zoe
 $hover-effect-zoe-speed:                       $hover-effect-default-speed !default;

diff --git a/src/effects/_lexi.scss b/src/effects/_lexi.scss
@@ -3,7 +3,7 @@
 // ====
 .hover-effect figure.effect-lexi {
   background: -webkit-linear-gradient(-45deg, darken($hover-effect-lexi-background-color, 80%) 0%, $hover-effect-lexi-background-color 100%);
-  background: linear-gradient(-45deg, #000 0%, $hover-effect-lexi-background-color 100%);
+  background: linear-gradient(-45deg, darken($hover-effect-lexi-background-color, 80%) 0%, $hover-effect-lexi-background-color 100%);
 
   img {
     @include transition(opacity $hover-effect-lexi-speed, transform $hover-effect-lexi-speed);

diff --git a/src/effects/_winston.scss b/src/effects/_winston.scss
@@ -15,7 +15,7 @@
     @include rotate3d(0, 0, 1, 45deg);
     @include transform-origin(0 100%);
 
-    border-bottom: 300px solid white;
+    border-bottom: 300px solid $hover-effect-winston-border-color;
     border-left: 425px solid transparent;
     content: '';    
     height: 100%;
@@ -45,13 +45,13 @@
   }
 
   a {
-    color: #5d504f;
+    color: $hover-effect-winston-font-color;
     font-size: 170%;
     margin: 0 10px;
 
     &:hover,
     &:focus {
-      color: #cc6055;
+      color: darken($hover-effect-winston-font-color, 40%);
     }
   }