remove <icon forward></icon>

ionic/components/item/modes/ios.scss

@@ -122,11 +122,6 @@ $item-ios-forward-icon-color:     $item-ios-border-color !default;
     color: $item-ios-note-color;
   }
 
-  icon[forward] {
-    font-size: 2rem;
-    color: $item-ios-forward-icon-color;
-  }
-
   ion-avatar {
     min-width: $item-ios-avatar-size;
 
@@ -148,6 +143,19 @@ $item-ios-forward-icon-color:     $item-ios-border-color !default;
 
 }
 
+.list,
+.card {
+  button[ion-item]:not([no-forward-icon]),
+  a[ion-item]:not([no-forward-icon]),
+  [forward-icon] {
+    @include ios-icon-forward($item-ios-forward-icon-color);
+    background-repeat: no-repeat;
+    background-position: right ($item-ios-padding-right - 4) center;
+    background-size: 16px 16px;
+    padding-right: 32px;
+  }
+}
+
 
 &.hairlines .list .item {
   margin-top: -0.5px;
@@ -161,4 +169,3 @@ $item-ios-forward-icon-color:     $item-ios-border-color !default;
     border-top-width: 0.55px;
   }
 }
-

ionic/components/item/modes/md.scss

@@ -136,11 +136,6 @@ $item-md-forward-icon-color:     $item-md-border-color !default;
     margin-left: $item-md-padding-left + ($item-md-padding-left / 2);
   }
 
-  icon[forward] {
-    font-size: 2rem;
-    color: $item-md-forward-icon-color;
-  }
-
   ion-avatar {
     min-width: $item-md-avatar-size;
 

ionic/components/item/test/buttons/main.html

@@ -4,22 +4,18 @@
 
   <a ion-item href="#">
     a[ion-item]
-    <icon forward item-right></icon>
   </a>
 
   <a ion-item class="activated" href="#">
     a[ion-item].activated
-    <icon forward item-right></icon>
   </a>
 
   <button ion-item>
     button[ion-item]
-    <icon forward item-right></icon>
   </button>
 
   <button ion-item class="activated">
     button[ion-item].activated
-    <icon forward item-right></icon>
   </button>
 
   <ion-item>

ionic/components/item/test/icons/main.html

@@ -2,19 +2,16 @@
 
 <ion-list>
 
-  <ion-item>
-    ion-item forward icon
-    <icon forward item-right></icon>
+  <ion-item forward-icon>
+    ion-item [forward-icon] attr
   </ion-item>
 
   <a ion-item href="#">
     a[ion-item] w/ forward icon
-    <icon forward item-right></icon>
   </a>
 
   <button ion-item>
     button[ion-item] w/ forward icon
-    <icon forward item-right></icon>
   </button>
 
   <a ion-item href="#">
@@ -37,9 +34,9 @@
     button[ion-item] w/ left side icon
   </button>
 
-  <button ion-item>
+  <button ion-item no-forward-icon>
     <icon flag item-left></icon>
-    button[ion-item] w/ both side icons
+    button[ion-item][no-foward-icon]
     <icon checkmark item-right></icon>
   </button>