From: Mark Rickert <mjar81@gmail.com>
Date: Thu, 12 Dec 2013 17:53:03 +0000 (-0500)
Subject: Adds a variable for the background color of the active tab in the tab component.
X-Git-Tag: 5.0.3~71^2~34^2
X-Git-Url: http://git.ipfire.org/gitweb/?a=commitdiff_plain;h=refs%2Fpull%2F3876%2Fhead;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Adds a variable for the background color of the active tab in the tab component.
---

diff --git a/doc/includes/tabs/examples_tabs_variables.html b/doc/includes/tabs/examples_tabs_variables.html
index ac52a42f0..75355fb1d 100644
--- a/doc/includes/tabs/examples_tabs_variables.html
+++ b/doc/includes/tabs/examples_tabs_variables.html
@@ -3,6 +3,7 @@
 $tabs-navigation-padding: rem-calc(16);
 $tabs-navigation-bg-color: #efefef;
 $tabs-navigation-hover-bg-color: darken($tabs-navigation-bg-color, 5%);
+$tabs-navigation-active-bg-color: #fff;
 $tabs-navigation-font-color: #222;
 $tabs-navigation-font-size: rem-calc(16);
 $tabs-navigation-font-family: $body-font-family;
diff --git a/scss/foundation/_settings.scss b/scss/foundation/_settings.scss
index 2e349244d..c3645c525 100644
--- a/scss/foundation/_settings.scss
+++ b/scss/foundation/_settings.scss
@@ -1,4 +1,4 @@
-// 
+//
 // FOUNDATION SETTINGS
 //
 
@@ -952,6 +952,7 @@
 // $tabs-navigation-padding: rem-calc(16);
 // $tabs-navigation-bg-color: #efefef  ;
 // $tabs-navigation-hover-bg-color: darken($tabs-navigation-bg-color, 5%);
+// $tabs-navigation-active-bg-color: #fff;
 // $tabs-navigation-font-color: #222;
 // $tabs-navigation-font-size: rem-calc(16);
 // $tabs-navigation-font-family: $body-font-family;
diff --git a/scss/foundation/components/_tabs.scss b/scss/foundation/components/_tabs.scss
index 4578574d0..32d75d0e6 100644
--- a/scss/foundation/components/_tabs.scss
+++ b/scss/foundation/components/_tabs.scss
@@ -9,6 +9,7 @@ $include-html-tabs-classes: $include-html-classes !default;
 $tabs-navigation-padding: rem-calc(16) !default;
 $tabs-navigation-bg-color: #efefef !default;
 $tabs-navigation-hover-bg-color: darken($tabs-navigation-bg-color, 5%) !default;
+$tabs-navigation-active-bg-color: #fff !default;
 $tabs-navigation-font-color: #222 !default;
 $tabs-navigation-font-size: rem-calc(16) !default;
 $tabs-navigation-font-family: $body-font-family !default;
@@ -40,7 +41,7 @@ $tabs-vertical-navigation-margin-bottom: 1.25rem !default;
           font-size: $tabs-navigation-font-size; 
           &:hover { background: $tabs-navigation-hover-bg-color; }
         }
-        &.active a { background: #fff; }
+        &.active a { background: $tabs-navigation-active-bg-color; }
       }
       &.radius {
         dd:first-child {