Merge pull request #30 from treehouse/forms-contrast

Forms contrast
treehouse · May 15, 2018 · a8bed7d · a8bed7d
2 parents a55effc + 38a8e1c
commit a8bed7d
Show file tree

Hide file tree

Showing 14 changed files with 1,297 additions and 94 deletions.
diff --git a/README.md b/README.md
@@ -4,7 +4,7 @@ Leap is an internal CSS library made for Treehouse. It contains immutable utilit
 ## Quick Start
 Several options are available for installing Leap into your project.
 
-* [Download the latest release](https://github.com/treehouse/project-leap/archive/v0.9.0.zip)
+* [Download the latest release](https://github.com/treehouse/project-leap/archive/v0.9.1.zip)
 
 * Clone the repo: `git clone https://github.com/treehouse/project-leap.git`
 * Install with [Bower](http://bower.io)

diff --git a/_sass/leap/_variables.scss b/_sass/leap/_variables.scss
@@ -1,9 +1,12 @@
-$leap-version: "0.9.0";
+$leap-version: "0.9.1";
 
 // Brand Colors
 $brand-colors: (
   "green": #5fcf80,
-  "gray":  #3e474f
+  "gray":  #3e474f,
+  "blue-light": #387bab, // AA 4.58
+  "blue-medium": #2a5d81,
+  "blue-dark": #303853
 );
 
 // Text Colors
@@ -12,7 +15,10 @@ $text-colors: (
   "medium":   #4b5658,
   "base":     #576366,
   "light":    #7b8b8e,
-  "white":    #fff
+  "white":    #fff,
+  "blue-light":    #387bab, // AA 4.58
+  "blue-medium":    #2a5d81,
+  "blue-dark":    #303853
 );
 
 // Gray Colors
@@ -30,7 +36,10 @@ $ui-colors: (
   "green":        #36b55c,
   "yellow":       #ffd466,
   "orange":       #ff9f1f,
-  "red":          #ed5a5a
+  "red":          #ed5a5a,
+  "error":          #be4a4a,
+  "warning":          #bf570f,
+  "success":          #24793d
 );
 
 // Topic Colors

diff --git a/_sass/leap/atoms/_button.sass b/_sass/leap/atoms/_button.sass
@@ -42,10 +42,20 @@
     svg
       fill: #fff !important
     +selected
-      background-color: darken(brand-color(green), 10%) !important
-      border-color: darken(brand-color(green), 10%) !important
+      background-color: darken(brand-color(green), 15%) !important
+      border-color: darken(brand-color(green), 15%) !important
       color: #fff !important
 
+  &--primary-blue
+    background-color: brand-color(blue-light) !important
+    border-color: brand-color(blue-light) !important
+    color: #fff !important
+    svg
+      fill: #fff !important
+    +selected
+      background-color: brand-color(blue-medium) !important
+      border-color: brand-color(blue-medium) !important
+      color: #fff !important
 
 
   // Secondary buttons