From 4e57fcf98a65e83a36d08cdc9478a7bfd7074b6d Mon Sep 17 00:00:00 2001
From: "Manu Mtz.-Almeida" <manu.valladolid@gmail.com>
Date: Mon, 8 Feb 2016 00:41:19 +0100
Subject: [PATCH 1/3] feat(ion-item-sliding): style icons on top of text in an
 option button

closes #5352
---
 ionic/components/button/button.scss          |  2 +-
 ionic/components/item/item-sliding.scss      | 16 +++++++++++++-
 ionic/components/item/test/sliding/main.html | 23 +++++++++++++++-----
 3 files changed, 34 insertions(+), 7 deletions(-)

diff --git a/ionic/components/button/button.scss b/ionic/components/button/button.scss
index 3b26fc0234..8184beac68 100644
--- a/ionic/components/button/button.scss
+++ b/ionic/components/button/button.scss
@@ -29,7 +29,7 @@ $button-round-border-radius:      64px !default;
   @include appearance(none);
 }
 
-span.button-inner {
+.button-inner {
     width: 100%;
     height: 100%;
     display: flex;
diff --git a/ionic/components/item/item-sliding.scss b/ionic/components/item/item-sliding.scss
index 11a56bf6a9..0787b8336f 100644
--- a/ionic/components/item/item-sliding.scss
+++ b/ionic/components/item/item-sliding.scss
@@ -32,8 +32,22 @@ ion-item-options .button {
   height: 100%;
 }
 
-ion-item-sliding.active-slide {
+ion-item-sliding:not([horizontal]) {
+  .button.button-icon-left {
+    font-size: 14px;
 
+    .button-inner {
+      flex-direction: column;
+    }
+    ion-icon {
+      padding-left: 0 !important;
+      padding-right: 0 !important;
+      padding-bottom: 0.3em;
+    }
+  }
+}
+
+ion-item-sliding.active-slide {
 
   .item,
   .item.activated {
diff --git a/ionic/components/item/test/sliding/main.html b/ionic/components/item/test/sliding/main.html
index 9240f6b270..bfa79cc813 100644
--- a/ionic/components/item/test/sliding/main.html
+++ b/ionic/components/item/test/sliding/main.html
@@ -31,7 +31,9 @@
       </ion-item>
       <ion-item-options>
         <button primary (click)="archive(item)">Archive</button>
-        <button danger (click)="del(item)"><ion-icon name="trash"></ion-icon></button>
+        <button danger (click)="del(item)">
+          <ion-icon name="trash"></ion-icon>
+        </button>
       </ion-item-options>
     </ion-item-sliding>
 
@@ -48,13 +50,15 @@
       </ion-item-options>
     </ion-item-sliding>
 
-    <ion-item-sliding #item>
+    <ion-item-sliding #item horizontal>
       <ion-item>
         <ion-icon name="mail" item-left></ion-icon>
         One Line w/ Icon, div only text
       </ion-item>
       <ion-item-options>
-        <button primary (click)="archive(item)">Archive</button>
+        <button primary (click)="archive(item)">
+          <ion-icon name="archive"></ion-icon>Archive
+        </button>
       </ion-item-options>
     </ion-item-sliding>
 
@@ -66,7 +70,16 @@
         One Line w/ Avatar, div only text
       </ion-item>
       <ion-item-options>
-        <button primary (click)="archive(item)">Archive</button>
+        <button primary>
+          <ion-icon name="more"></ion-icon>More
+        </button>
+        <button secondary (click)="archive(item)">
+          <ion-icon name="archive"></ion-icon>Archive
+        </button>
+        <button danger (click)="del(item)">
+          <ion-icon name="trash"></ion-icon>Delete
+        </button>
+
       </ion-item-options>
     </ion-item-sliding>
 
@@ -104,4 +117,4 @@
   img {
     height: 100px;
   }
-</style>
+</style>
\ No newline at end of file

From 14abe9eb41fe48dc9ad7fd6ae81de574ee36fe71 Mon Sep 17 00:00:00 2001
From: "Manu Mtz.-Almeida" <manu.valladolid@gmail.com>
Date: Mon, 8 Feb 2016 04:16:15 +0100
Subject: [PATCH 2/3] icon-left attribute belongs to ion-item-options

---
 ionic/components/item/item-sliding.scss      | 20 +++++++++-----------
 ionic/components/item/test/sliding/main.html |  4 ++--
 2 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/ionic/components/item/item-sliding.scss b/ionic/components/item/item-sliding.scss
index 0787b8336f..251bcf0e49 100644
--- a/ionic/components/item/item-sliding.scss
+++ b/ionic/components/item/item-sliding.scss
@@ -32,18 +32,16 @@ ion-item-options .button {
   height: 100%;
 }
 
-ion-item-sliding:not([horizontal]) {
-  .button.button-icon-left {
-    font-size: 14px;
+ion-item-options:not([icon-left]) > .button-icon-left  {
+  font-size: 14px;
 
-    .button-inner {
-      flex-direction: column;
-    }
-    ion-icon {
-      padding-left: 0 !important;
-      padding-right: 0 !important;
-      padding-bottom: 0.3em;
-    }
+  .button-inner {
+    flex-direction: column;
+  }
+  ion-icon {
+    padding-left: 0 !important;
+    padding-right: 0 !important;
+    padding-bottom: 0.3em;
   }
 }
 
diff --git a/ionic/components/item/test/sliding/main.html b/ionic/components/item/test/sliding/main.html
index bfa79cc813..d98eb5b2ad 100644
--- a/ionic/components/item/test/sliding/main.html
+++ b/ionic/components/item/test/sliding/main.html
@@ -50,12 +50,12 @@
       </ion-item-options>
     </ion-item-sliding>
 
-    <ion-item-sliding #item horizontal>
+    <ion-item-sliding #item>
       <ion-item>
         <ion-icon name="mail" item-left></ion-icon>
         One Line w/ Icon, div only text
       </ion-item>
-      <ion-item-options>
+      <ion-item-options icon-left>
         <button primary (click)="archive(item)">
           <ion-icon name="archive"></ion-icon>Archive
         </button>

From c8bb18f3e9b3c4e571aecc8c483d84ca94cc34b6 Mon Sep 17 00:00:00 2001
From: "Manu Mtz.-Almeida" <manu.valladolid@gmail.com>
Date: Mon, 8 Feb 2016 04:20:18 +0100
Subject: [PATCH 3/3] drops > selector

---
 ionic/components/item/item-sliding.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ionic/components/item/item-sliding.scss b/ionic/components/item/item-sliding.scss
index 251bcf0e49..db8698663b 100644
--- a/ionic/components/item/item-sliding.scss
+++ b/ionic/components/item/item-sliding.scss
@@ -32,7 +32,7 @@ ion-item-options .button {
   height: 100%;
 }
 
-ion-item-options:not([icon-left]) > .button-icon-left  {
+ion-item-options:not([icon-left]) .button-icon-left {
   font-size: 14px;
 
   .button-inner {