From 041689b5f5501ee38b8b2fd059aded208c3e186c Mon Sep 17 00:00:00 2001
From: Brandy Carney <brandyscarney@gmail.com>
Date: Tue, 30 May 2017 11:25:29 -0400
Subject: [PATCH] fix(toolbar): use the correct contrast color for MD toolbar

fixes #11848
---
 scripts/e2e/variables.scss                             | 10 +++++++++-
 .../toolbar/test/colors/pages/root-page/root-page.html |  7 +++++++
 src/components/toolbar/toolbar.md.scss                 |  7 +++----
 3 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/scripts/e2e/variables.scss b/scripts/e2e/variables.scss
index 72910b8cc8..a89826721c 100644
--- a/scripts/e2e/variables.scss
+++ b/scripts/e2e/variables.scss
@@ -31,7 +31,15 @@ $colors: (
   light:      #f4f4f4,
   dark:       #222,
   vibrant:    rebeccapurple,
-  bright:     #ffc125
+  bright:     #ffc125,
+  greyYellow: (
+    base:#49606e,
+    contrast:#fbb636
+  ),
+  greyWhite: (
+    base:#49606e,
+    contrast:#fff
+  )
 );
 
 
diff --git a/src/components/toolbar/test/colors/pages/root-page/root-page.html b/src/components/toolbar/test/colors/pages/root-page/root-page.html
index bd836533da..359b031673 100644
--- a/src/components/toolbar/test/colors/pages/root-page/root-page.html
+++ b/src/components/toolbar/test/colors/pages/root-page/root-page.html
@@ -199,4 +199,11 @@
       <ion-icon name="menu"></ion-icon>
     </button>
   </ion-toolbar>
+
+  <ion-toolbar color="greyYellow">
+    <ion-title>Grey Yellow</ion-title>
+  </ion-toolbar>
+  <ion-toolbar color="greyWhite">
+    <ion-title>Grey White</ion-title>
+  </ion-toolbar>
 </ion-content>
diff --git a/src/components/toolbar/toolbar.md.scss b/src/components/toolbar/toolbar.md.scss
index 71cad96362..fa37b1af7f 100644
--- a/src/components/toolbar/toolbar.md.scss
+++ b/src/components/toolbar/toolbar.md.scss
@@ -116,7 +116,6 @@ $toolbar-button-md-strong-font-weight:   bold !default;
 
 @mixin md-toolbar-theme($color-name, $color-base, $color-contrast) {
   .toolbar-md-#{$color-name} {
-    $fg-color: color-contrast($colors-md, $color-base, md);
 
     .toolbar-background-md {
       background: $color-base;
@@ -126,19 +125,19 @@ $toolbar-button-md-strong-font-weight:   bold !default;
     .bar-button-default-md,
     .bar-button-outline-md,
     .toolbar-title-md {
-      color: $fg-color;
+      color: $color-contrast;
     }
 
     .bar-button-clear-md,
     .bar-button-default-md,
     .bar-button-outline-md {
       .button-effect {
-        background-color: $fg-color;
+        background-color: $color-contrast;
       }
     }
 
     .bar-button-outline-md {
-      border-color: $fg-color;
+      border-color: $color-contrast;
     }
 
     @each $color-name, $color-base, $color-contrast in get-colors($colors-md) {