From f6410bacbdd52d43da7e91844d7a725619d80082 Mon Sep 17 00:00:00 2001
From: Brandy Carney <brandy@ionic.io>
Date: Wed, 7 Feb 2018 17:05:50 -0500
Subject: [PATCH] fix(chip): remove button dependency and fix standalone styles

---
 .../src/components/chip-button/chip-button.scss  | 16 ++++++++++++++++
 .../src/components/chip-button/chip-button.tsx   |  2 +-
 packages/core/src/components/chip/chip.md.scss   |  2 +-
 packages/core/src/components/chip/chip.scss      |  3 +++
 .../components/chip/test/standalone/index.html   |  8 ++++++++
 .../core/src/components/label/label.ios.scss     |  1 -
 packages/core/src/components/label/label.md.scss |  1 -
 .../core/src/themes/ionic.theme.default.md.scss  | 16 +++-------------
 8 files changed, 32 insertions(+), 17 deletions(-)

diff --git a/packages/core/src/components/chip-button/chip-button.scss b/packages/core/src/components/chip-button/chip-button.scss
index ff86205497..209fb10f26 100644
--- a/packages/core/src/components/chip-button/chip-button.scss
+++ b/packages/core/src/components/chip-button/chip-button.scss
@@ -7,6 +7,10 @@
   @include border-radius($chip-button-border-radius);
   @include margin($chip-button-margin-top, $chip-button-margin-end, $chip-button-margin-bottom, $chip-button-margin-start);
 
+  position: relative;
+
+  border: 0;
+
   width: $chip-button-size;
   height: $chip-button-size;
 
@@ -15,3 +19,15 @@
     outline: none;
   }
 }
+
+.chip-button-inner {
+  display: flex;
+
+  flex-flow: row nowrap;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+
+  width: 100%;
+  height: 100%;
+}
\ No newline at end of file
diff --git a/packages/core/src/components/chip-button/chip-button.tsx b/packages/core/src/components/chip-button/chip-button.tsx
index 37e32e0e9c..0abf2c52b8 100644
--- a/packages/core/src/components/chip-button/chip-button.tsx
+++ b/packages/core/src/components/chip-button/chip-button.tsx
@@ -64,7 +64,7 @@ export class ChipButton {
         class={buttonClasses}
         disabled={this.disabled}
         href={this.href}>
-          <span class='button-inner'>
+          <span class='chip-button-inner'>
             <slot></slot>
           </span>
           { this.mode === 'md' && <ion-ripple-effect useTapClick={true} /> }
diff --git a/packages/core/src/components/chip/chip.md.scss b/packages/core/src/components/chip/chip.md.scss
index 5bf6ea8725..8b34ecedcf 100644
--- a/packages/core/src/components/chip/chip.md.scss
+++ b/packages/core/src/components/chip/chip.md.scss
@@ -12,8 +12,8 @@
   height: $chip-md-height;
 
   font-family: $chip-md-font-family;
-
   font-size: $chip-md-font-size;
+
   color: $chip-md-text-color;
   background: $chip-md-background-color;
 }
diff --git a/packages/core/src/components/chip/chip.scss b/packages/core/src/components/chip/chip.scss
index 01c9adc261..6694de60a7 100644
--- a/packages/core/src/components/chip/chip.scss
+++ b/packages/core/src/components/chip/chip.scss
@@ -12,6 +12,9 @@ ion-chip {
 
   font-weight: normal;
   vertical-align: middle;
+
+  -webkit-font-smoothing: antialiased;
+  font-smoothing: antialiased;
 }
 
 ion-chip > ion-icon {
diff --git a/packages/core/src/components/chip/test/standalone/index.html b/packages/core/src/components/chip/test/standalone/index.html
index 1eee56ff39..4a97912127 100644
--- a/packages/core/src/components/chip/test/standalone/index.html
+++ b/packages/core/src/components/chip/test/standalone/index.html
@@ -110,6 +110,14 @@
     </ion-chip>
   </ion-item>
 
+  <style>
+    body {
+      margin: 0;
+      padding: 16px;
+      text-align: center;
+    }
+  </style>
+
   <script>
     function del(chip) {
       console.log('called del', chip);
diff --git a/packages/core/src/components/label/label.ios.scss b/packages/core/src/components/label/label.ios.scss
index f1ed43ba3d..58b2dc4ab5 100644
--- a/packages/core/src/components/label/label.ios.scss
+++ b/packages/core/src/components/label/label.ios.scss
@@ -8,7 +8,6 @@
   @include margin($label-ios-margin-top, $label-ios-margin-end, $label-ios-margin-bottom, $label-ios-margin-start);
 
   font-family: $label-ios-font-family;
-  color: $label-ios-text-color;
 }
 
 
diff --git a/packages/core/src/components/label/label.md.scss b/packages/core/src/components/label/label.md.scss
index c584dd5191..e39c716747 100644
--- a/packages/core/src/components/label/label.md.scss
+++ b/packages/core/src/components/label/label.md.scss
@@ -8,7 +8,6 @@
   @include margin($label-md-margin-top, $label-md-margin-end, $label-md-margin-bottom, $label-md-margin-start);
 
   font-family: $label-md-font-family;
-  color: $label-md-text-color;
 }
 
 [text-wrap] .label-md {
diff --git a/packages/core/src/themes/ionic.theme.default.md.scss b/packages/core/src/themes/ionic.theme.default.md.scss
index 0765b0f2db..f600242fe2 100644
--- a/packages/core/src/themes/ionic.theme.default.md.scss
+++ b/packages/core/src/themes/ionic.theme.default.md.scss
@@ -2,19 +2,9 @@
 
 // Material Design Default Theme
 // ----------------------------------
-$colors-md:       () !default;
-
-$light-md: #e3e3e3;
-$ion-colors-md:   (
-  light: (
-    base:             $light-md,
-    contrast:         #000,
-    rgb:              color-to-rgb-list($light-md),
-    shade:            #d0d0d0,
-    tint:             #f0f0f0
-  )
-);
-$colors-md:                             ion-extend-colors($colors, $ion-colors-md, $colors-md);
+$colors-md:      () !default;
+$ion-colors-md:  ();
+$colors-md:                                  ion-extend-colors($colors, $ion-colors-md, $colors-md);
 
 // Material Design General
 // --------------------------------------------------