From: matthewalbani <matthew.albani@moovweb.com>
Date: Fri, 29 May 2015 21:03:12 +0000 (-0700)
Subject: #6429 added accordion-navigation-active-font-color
X-Git-Tag: v5.5.3~57^2~5^2
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=refs%2Fpull%2F6590%2Fhead;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

#6429 added accordion-navigation-active-font-color
---

diff --git a/doc/includes/accordion/examples_accordion_variables.html b/doc/includes/accordion/examples_accordion_variables.html
index 5c83a34a2..f251da042 100644
--- a/doc/includes/accordion/examples_accordion_variables.html
+++ b/doc/includes/accordion/examples_accordion_variables.html
@@ -6,6 +6,7 @@ $accordion-navigation-padding: rem-calc(16);
 $accordion-navigation-bg-color: $silver;
 $accordion-navigation-hover-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -5%);
 $accordion-navigation-active-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -3%);
+$accordion-navigation-active-font-color: $jet;
 $accordion-navigation-font-color: $jet;
 $accordion-navigation-font-size: rem-calc(16);
 $accordion-navigation-font-family: $body-font-family;
diff --git a/scss/foundation/_settings.scss b/scss/foundation/_settings.scss
index e4b3e92da..3acc2f25e 100644
--- a/scss/foundation/_settings.scss
+++ b/scss/foundation/_settings.scss
@@ -336,6 +336,7 @@ $include-html-global-classes: $include-html-classes;
 // $accordion-navigation-bg-color: $silver;
 // $accordion-navigation-hover-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -5%);
 // $accordion-navigation-active-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -3%);
+// $accordion-navigation-active-font-color: $jet;
 // $accordion-navigation-font-color: $jet;
 // $accordion-navigation-font-size: rem-calc(16);
 // $accordion-navigation-font-family: $body-font-family;
diff --git a/scss/foundation/components/_accordion.scss b/scss/foundation/components/_accordion.scss
index de4a5ea51..cc5138d8c 100644
--- a/scss/foundation/components/_accordion.scss
+++ b/scss/foundation/components/_accordion.scss
@@ -14,6 +14,7 @@ $accordion-navigation-padding: rem-calc(16) !default;
 $accordion-navigation-bg-color: $silver !default;
 $accordion-navigation-hover-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -5%) !default;
 $accordion-navigation-active-bg-color: scale-color($accordion-navigation-bg-color, $lightness: -3%) !default;
+$accordion-navigation-active-font-color: $jet !default;
 $accordion-navigation-font-color: $jet !default;
 $accordion-navigation-font-size: rem-calc(16) !default;
 $accordion-navigation-font-family: $body-font-family !default;
@@ -40,8 +41,9 @@ $accordion-content-active-bg-color: $white !default;
 //    @params $font-color [ color or string ]: Color of the font for accordion
 //    @params $font-size [ number ]: Specifiy the font-size of the text inside the navigation element
 //    @params $font-family [ string ]: Specify the font family for the text of the navigation of the accorion
+//    @params $active-font [ color or string ]: Specify the font color for the navigation element when active.
 
-@mixin accordion-navigation( $bg: $accordion-navigation-bg-color, $hover-bg: $accordion-navigation-hover-bg-color, $active-bg: $accordion-navigation-active-bg-color, $padding: $accordion-navigation-padding, $active_class: 'active',  $font-color: $accordion-navigation-font-color, $font-size: $accordion-navigation-font-size, $font-family: $accordion-navigation-font-family ) {
+@mixin accordion-navigation( $bg: $accordion-navigation-bg-color, $hover-bg: $accordion-navigation-hover-bg-color, $active-bg: $accordion-navigation-active-bg-color, $padding: $accordion-navigation-padding, $active_class: 'active',  $font-color: $accordion-navigation-font-color, $font-size: $accordion-navigation-font-size, $font-family: $accordion-navigation-font-family, $active-font: $accordion-navigation-active-font-color ) {
   display: block;
   margin-bottom: 0 !important;
   @if type-of($active_class) != "string" {
@@ -50,6 +52,7 @@ $accordion-content-active-bg-color: $white !default;
   @else {
     &.#{ $active_class } > a {
       background: $active-bg;
+      color: $active-font;
     }
   }
   > a {
@@ -132,7 +135,7 @@ $accordion-content-active-bg-color: $white !default;
       .accordion-navigation, dd {
         display: block;
         margin-bottom: 0 !important;
-        &.active > a { background: $accordion-navigation-active-bg-color; }
+        &.active > a { background: $accordion-navigation-active-bg-color; color: $accordion-navigation-active-font-color; }
         > a {
           background: $accordion-navigation-bg-color;
           color: $accordion-navigation-font-color;