From a4f6086bcccfe6641cd538a5ac68cc40430fbcc0 Mon Sep 17 00:00:00 2001
From: Brandy Carney <brandy@ionic.io>
Date: Wed, 7 Feb 2018 17:57:09 -0500
Subject: [PATCH] fix(action-sheet): remove button dependency and fix styles

---
 .../action-sheet/action-sheet.md.scss           |  2 +-
 .../components/action-sheet/action-sheet.scss   | 17 +++++++++++++++++
 .../components/action-sheet/action-sheet.tsx    |  4 ++--
 3 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/packages/core/src/components/action-sheet/action-sheet.md.scss b/packages/core/src/components/action-sheet/action-sheet.md.scss
index 4aad294252..155c546312 100644
--- a/packages/core/src/components/action-sheet/action-sheet.md.scss
+++ b/packages/core/src/components/action-sheet/action-sheet.md.scss
@@ -71,7 +71,7 @@
   font-size: $action-sheet-md-icon-font-size;
 }
 
-.action-sheet-md .action-sheet-group .button-inner {
+.action-sheet-md .action-sheet-button-inner {
   justify-content: flex-start;
 }
 
diff --git a/packages/core/src/components/action-sheet/action-sheet.scss b/packages/core/src/components/action-sheet/action-sheet.scss
index 54baba2203..b72eaf8526 100644
--- a/packages/core/src/components/action-sheet/action-sheet.scss
+++ b/packages/core/src/components/action-sheet/action-sheet.scss
@@ -12,6 +12,9 @@ ion-action-sheet {
 
   width: $action-sheet-width;
   height: $action-sheet-width;
+
+  font-smoothing: antialiased;
+  -webkit-font-smoothing: antialiased;
 }
 
 .action-sheet-wrapper {
@@ -34,12 +37,26 @@ ion-action-sheet {
 
   border: 0;
 
+  font-family: inherit;
+
   &:active,
   &:focus {
     outline: none;
   }
 }
 
+.action-sheet-button-inner {
+  display: flex;
+
+  flex-flow: row nowrap;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+
+  width: 100%;
+  height: 100%;
+}
+
 .action-sheet-container {
   display: flex;
 
diff --git a/packages/core/src/components/action-sheet/action-sheet.tsx b/packages/core/src/components/action-sheet/action-sheet.tsx
index cd0471416f..7ebd228ac1 100644
--- a/packages/core/src/components/action-sheet/action-sheet.tsx
+++ b/packages/core/src/components/action-sheet/action-sheet.tsx
@@ -262,7 +262,7 @@ export class ActionSheet {
               : null}
             {buttons.map(b =>
               <button class={buttonClass(b)} onClick={() => this.buttonClick(b)}>
-                <span class='button-inner'>
+                <span class='action-sheet-button-inner'>
                   {b.icon
                     ? <ion-icon name={b.icon} class='action-sheet-icon' />
                     : null}
@@ -277,7 +277,7 @@ export class ActionSheet {
                   class={buttonClass(cancelButton)}
                   onClick={() => this.buttonClick(cancelButton)}
                 >
-                  <span class='button-inner'>
+                  <span class='action-sheet-button-inner'>
                     {cancelButton.icon
                       ? <ion-icon
                           name={cancelButton.icon}