From 9f937eb24d2df76ab89f41bc2017e97770f7d6eb Mon Sep 17 00:00:00 2001
From: Adam Bradley <adambradley25@gmail.com>
Date: Thu, 2 Apr 2015 22:15:25 -0500
Subject: [PATCH] button icons

---
 src/components/button/button.scss          | 13 +++++
 src/components/button/extensions/ios.scss  |  8 +--
 src/components/button/test/icons/e2e.js    |  1 +
 src/components/button/test/icons/main.html | 58 ++++++++++++++++++++++
 src/components/button/test/icons/main.js   | 13 +++++
 5 files changed, 89 insertions(+), 4 deletions(-)
 create mode 100644 src/components/button/test/icons/e2e.js
 create mode 100644 src/components/button/test/icons/main.html
 create mode 100644 src/components/button/test/icons/main.js

diff --git a/src/components/button/button.scss b/src/components/button/button.scss
index 0ae64d8380..4aa6d978c2 100644
--- a/src/components/button/button.scss
+++ b/src/components/button/button.scss
@@ -91,6 +91,19 @@ input.button.button-block  {
   margin-top: 0;
 }
 
+.icon-left:before {
+  font-size: 1.5em;
+  margin-top: -0.1em;
+  margin-right: 0.25em;
+}
+
+.icon-right:before {
+  @include flex-order(2);
+  font-size: 1.5em;
+  margin-top: -0.1em;
+  margin-left: 0.25em;
+}
+
 
 
 // Button Misc
diff --git a/src/components/button/extensions/ios.scss b/src/components/button/extensions/ios.scss
index 3788c92435..9acad95dfa 100644
--- a/src/components/button/extensions/ios.scss
+++ b/src/components/button/extensions/ios.scss
@@ -4,18 +4,18 @@
 
 $button-ios-font-size:                1.4rem !default;
 $button-ios-padding:                  0 10px !default;
-$button-ios-height:                   29px !default;
+$button-ios-height:                   42px !default;
 $button-ios-border-width:             1px !default;
 $button-ios-border-radius:            5px !default;
 
 $button-ios-large-font-size:          2rem !default;
 $button-ios-large-height:             54px !default;
-$button-ios-large-padding:            16px !default;
+$button-ios-large-padding:            14px !default;
 $button-ios-large-icon-size:          32px !default;
 
 $button-ios-small-font-size:          1.2rem !default;
 $button-ios-small-height:             28px !default;
-$button-ios-small-padding:            4px !default;
+$button-ios-small-padding:            6px !default;
 $button-ios-small-icon-size:          16px !default;
 
 
@@ -67,7 +67,7 @@ $button-ios-small-icon-size:          16px !default;
 
 .button-ios {
   padding: $button-ios-padding;
-  height: $button-ios-height;
+  min-height: $button-ios-height;
   font-size: $button-ios-font-size;
   border-radius: $button-ios-border-radius;
 
diff --git a/src/components/button/test/icons/e2e.js b/src/components/button/test/icons/e2e.js
new file mode 100644
index 0000000000..8b13789179
--- /dev/null
+++ b/src/components/button/test/icons/e2e.js
@@ -0,0 +1 @@
+
diff --git a/src/components/button/test/icons/main.html b/src/components/button/test/icons/main.html
new file mode 100644
index 0000000000..1895928fbe
--- /dev/null
+++ b/src/components/button/test/icons/main.html
@@ -0,0 +1,58 @@
+
+<div class="padding">
+
+  <p>
+    <button class="button button-positive ion-home icon-left">
+      Left Icon
+    </button>
+    <a class="button button-positive ion-home icon-left">
+      Left Icon
+    </a>
+  </p>
+
+  <p>
+    <button class="button button-positive ion-star icon-right">
+      Right Icon
+    </button>
+    <a class="button button-positive ion-star icon-right">
+      Right Icon
+    </a>
+  </p>
+
+  <p>
+    <button class="button button-positive button-large ion-home icon-left">
+      Left, Large
+    </button>
+    <a class="button button-positive button-large ion-home icon-left">
+      Left, Large
+    </a>
+  </p>
+
+  <p>
+    <button class="button button-positive button-large ion-star icon-right">
+      Right, Large
+    </button>
+    <a class="button button-positive button-large ion-star icon-right">
+      Right, Large
+    </a>
+  </p>
+
+  <p>
+    <button class="button button-positive button-small ion-home icon-left">
+      Left Icon, Small
+    </button>
+    <a class="button button-positive button-small ion-home icon-left">
+      Left Icon, Small
+    </a>
+  </p>
+
+  <p>
+    <button class="button button-positive button-small ion-star icon-right">
+      Right Icon, Small
+    </button>
+    <a class="button button-positive button-small ion-star icon-right">
+      Right Icon, Small
+    </a>
+  </p>
+
+</div>
diff --git a/src/components/button/test/icons/main.js b/src/components/button/test/icons/main.js
new file mode 100644
index 0000000000..e86fdc4de7
--- /dev/null
+++ b/src/components/button/test/icons/main.js
@@ -0,0 +1,13 @@
+import {bootstrap} from 'angular2/core'
+import {Component, Template} from 'angular2/angular2'
+import {Button} from 'ionic2/components/button/button'
+
+
+@Component({ selector: '[ion-app]' })
+@Template({
+  url: 'main.html',
+  directives: [Button]
+})
+class IonicApp {}
+
+bootstrap(IonicApp)