fix(button): remove unecessary css and add dark toolbar test

references #14850
ionic-team · Sep 5, 2018 · ea81a21 · ea81a21
1 parent 0c56728
commit ea81a21
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 18 deletions.
diff --git a/core/src/components/button/test/toolbar/index.html b/core/src/components/button/test/toolbar/index.html
@@ -61,6 +61,23 @@
         <ion-title>This is a long title with buttons. It just goes on and on my friend.</ion-title>
       </ion-toolbar>
 
+      <ion-toolbar color="dark">
+        <ion-buttons slot="secondary">
+          <ion-button class="closeButton" fill="solid">
+            Close
+          </ion-button>
+          <ion-button fill="solid">
+            <ion-icon slot="icon-only" name="search"></ion-icon>
+          </ion-button>
+        </ion-buttons>
+        <ion-buttons slot="primary">
+          <ion-button fill="solid" color="secondary">
+            <ion-icon slot="icon-only" name="more"></ion-icon>
+          </ion-button>
+        </ion-buttons>
+        <ion-title>This is a long title with buttons. It just goes on and on my friend.</ion-title>
+      </ion-toolbar>
+
       <ion-toolbar>
         <ion-buttons slot="secondary">
           <ion-button>

diff --git a/core/src/components/buttons/buttons.ios.scss b/core/src/components/buttons/buttons.ios.scss
@@ -32,12 +32,16 @@
 // iOS Toolbar Clear Button
 // --------------------------------------------------
 
-::slotted(*) .button.button-clear .button-native {
-  height: 35px;
+::slotted(*) .button-clear.activated {
+  color: $toolbar-ios-button-color;
 }
 
-::slotted(*) .button.button-clear.activated {
-  color: $toolbar-ios-button-color;
+
+// iOS Toolbar Button Solid
+// --------------------------------------------------
+
+::slotted(*) .button-solid-ios:hover {
+  opacity: .4;
 }
 
 
@@ -74,13 +78,6 @@
 }
 
 
-// iOS Toolbar Button Solid
-// --------------------------------------------------
-
-::slotted(*) .button.button-solid-ios:hover {
-  opacity: .4;
-}
-
 // iOS Toolbar Menu Toggle
 // --------------------------------------------------
 

diff --git a/core/src/components/buttons/buttons.md.scss b/core/src/components/buttons/buttons.md.scss
@@ -33,7 +33,7 @@
 // Material Design Toolbar Solid Button
 // --------------------------------------------------
 
-::slotted(*) .button.button-solid {
+::slotted(*) .button-solid {
   --color: #{$toolbar-md-background-color};
   --color-activated: #{$toolbar-md-background-color};
   --background: #{$toolbar-md-text-color};
@@ -44,7 +44,7 @@
 // Material Design Toolbar Outline Button
 // --------------------------------------------------
 
-::slotted(*) .button.button-outline {
+::slotted(*) .button-outline {
   --color: #{$toolbar-md-text-color};
   --color-activated: #{$toolbar-md-text-color};
   --background: transparent;
@@ -56,16 +56,12 @@
 // Material Design Toolbar Clear Button
 // --------------------------------------------------
 
-::slotted(*) .button.button-clear {
+::slotted(*) .button-clear {
   --color: #{$toolbar-md-text-color};
   --color-activated: #{$toolbar-md-text-color};
   --background: transparent;
 }
 
-::slotted(*) .button.button-clear .button-native {
-  height: 45px;
-}
-
 
 // Material Design Toolbar Button Icon
 // --------------------------------------------------