feat(item): add the ability to show a forward arrow on md and wp modes

The following Sass variables control this:

```
$item-ios-detail-push-show
$item-md-detail-push-show
$item-wp-detail-push-show
```

ios is set to true by default, the others are set to false.

references #5993

src/components/item/item.ios.scss

@@ -10,6 +10,8 @@ $item-ios-paragraph-text-color:       #666 !default;
 $item-ios-avatar-size:                3.6rem !default;
 $item-ios-thumbnail-size:             5.6rem !default;
 $item-ios-note-color:                 darken($list-ios-border-color, 10%) !default;
+
+$item-ios-detail-push-show:           true !default;
 $item-ios-detail-push-color:          $list-ios-border-color !default;
 
 $item-ios-divider-background:         #f7f7f7 !default;
@@ -163,9 +165,11 @@ ion-note {
   color: $item-ios-note-color;
 }
 
-button.item:not([detail-none]) .item-inner,
+
-a.item:not([detail-none]) .item-inner,
+// iOS Item Detail Push
-.item[detail-push] .item-inner {
+// --------------------------------------------------
+
+@mixin ios-detail-push() {
   @include ios-detail-push-icon($item-ios-detail-push-color);
 
   padding-right: 32px;
@@ -175,6 +179,15 @@ a.item:not([detail-none]) .item-inner,
   background-size: 14px 14px;
 }
 
+// Only show the forward arrow icon if true
+@if $item-ios-detail-push-show == true {
+  .item[detail-push] .item-inner,
+  button.item:not([detail-none]) .item-inner,
+  a.item:not([detail-none]) .item-inner {
+    @include ios-detail-push();
+  }
+}
+
 
 // iOS Item Group
 // --------------------------------------------------

src/components/item/item.md.scss

@@ -13,6 +13,9 @@ $item-md-avatar-size:                4rem !default;
 $item-md-thumbnail-size:             8rem !default;
 $item-md-note-color:                 darken($list-md-border-color, 10%) !default;
 
+$item-md-detail-push-show:           false !default;
+$item-md-detail-push-color:          $list-md-border-color !default;
+
 $item-md-divider-background:         #fff !default;
 $item-md-divider-color:              #222 !default;
 $item-md-divider-padding:            5px 15px !default;
@@ -84,6 +87,29 @@ $item-md-sliding-content-background: $list-md-background-color !default;
 }
 
 
+// Material Design Item Detail Push
+// --------------------------------------------------
+
+@mixin md-detail-push() {
+  @include md-detail-push-icon($item-md-detail-push-color);
+
+  padding-right: 32px;
+
+  background-repeat: no-repeat;
+  background-position: right ($item-md-padding-right - 2) center;
+  background-size: 14px 14px;
+}
+
+// Only show the forward arrow icon if true
+@if $item-md-detail-push-show == true {
+  .item[detail-push] .item-inner,
+  button.item:not([detail-none]) .item-inner,
+  a.item:not([detail-none]) .item-inner {
+    @include md-detail-push();
+  }
+}
+
+
 // Material Design Item Media
 // --------------------------------------------------
 

src/components/item/item.wp.scss

@@ -15,6 +15,9 @@ $item-wp-avatar-size:                4rem !default;
 $item-wp-thumbnail-size:             8rem !default;
 $item-wp-note-color:                 $input-wp-border-color !default;
 
+$item-wp-detail-push-show:           false !default;
+$item-wp-detail-push-color:          $input-wp-border-color !default;
+
 $item-wp-divider-background:         #fff !default;
 $item-wp-divider-color:              #222 !default;
 $item-wp-divider-padding:            5px 15px !default;
@@ -85,6 +88,29 @@ $item-wp-sliding-content-background: $list-wp-background-color !default;
 }
 
 
+// Windows Item Detail Push
+// --------------------------------------------------
+
+@mixin wp-detail-push() {
+  @include wp-detail-push-icon($item-wp-detail-push-color);
+
+  padding-right: 32px;
+
+  background-repeat: no-repeat;
+  background-position: right ($item-wp-padding-right - 2) center;
+  background-size: 14px 14px;
+}
+
+// Only show the forward arrow icon if true
+@if $item-wp-detail-push-show == true {
+  .item[detail-push] .item-inner,
+  button.item:not([detail-none]) .item-inner,
+  a.item:not([detail-none]) .item-inner {
+    @include wp-detail-push();
+  }
+}
+
+
 // Windows Item Media
 // --------------------------------------------------
 

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

@@ -88,7 +88,7 @@
     <button outline item-right (click)="testClick($event)">View</button>
   </ion-item>
 
-  <button ion-item *ngFor="let data of [0,1,2,3,4]; #i = index" [class.activated]="i == 1" (click)="testClick($event)">
+  <button ion-item *ngFor="let data of [0,1,2,3,4]; let i = index" [class.activated]="i == 1" (click)="testClick($event)">
     <ion-avatar item-left>
         <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
     </ion-avatar>

src/themes/dark.ios.scss

@@ -71,13 +71,7 @@ $item-ios-padding-icon-top:           10px !default;
 $item-ios-padding-icon-bottom:        9px !default;
 
 
-// iOS Toggle
+// iOS Item Push Icon
-// --------------------------------------------------
-
-$toggle-ios-handle-background-color:  color($colors-ios, light) !default;
-
-
-// iOS Icon
 // --------------------------------------------------
 
 $icon-detail-push-background-svg:    "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 20'><path d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z' fill='fg-color'/></svg>" !default;
@@ -88,6 +82,12 @@ $icon-detail-push-background-svg:    "<svg xmlns='http://www.w3.org/2000/svg' vi
 }
 
 
+// iOS Toggle
+// --------------------------------------------------
+
+$toggle-ios-handle-background-color:  color($colors-ios, light) !default;
+
+
 // iOS Body
 // --------------------------------------------------
 

src/themes/dark.md.scss

@@ -59,6 +59,18 @@ $item-md-padding-icon-bottom:         10px !default;
 $item-md-divider-background:          #151515 !default;
 $item-md-divider-color:               color($colors-md, light) !default;
 
+
+// Material Design Item Push Icon
+// --------------------------------------------------
+
+$icon-detail-push-background-svg:    "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 20'><path d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z' fill='fg-color'/></svg>" !default;
+
+@mixin md-detail-push-icon($fg-color) {
+  $svg: str-replace($icon-detail-push-background-svg, "fg-color", $fg-color);
+  @include svg-background-image($svg);
+}
+
+
 // Material Design Toggle
 // ---------------------------------------------------
 $toggle-md-handle-background-color-off: color($colors-md, light) !default;

src/themes/dark.wp.scss

@@ -60,6 +60,17 @@ $item-wp-divider-background:          #151515 !default;
 $item-wp-divider-color:               color($colors-wp, light) !default;
 
 
+// Windows Item Push Icon
+// --------------------------------------------------
+
+$icon-detail-push-background-svg:    "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 20'><path d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z' fill='fg-color'/></svg>" !default;
+
+@mixin wp-detail-push-icon($fg-color) {
+  $svg: str-replace($icon-detail-push-background-svg, "fg-color", $fg-color);
+  @include svg-background-image($svg);
+}
+
+
 // Windows Toggle
 // ---------------------------------------------------
 $toggle-wp-handle-background-color-off: color($colors-wp, light) !default;

src/themes/default.ios.scss

@@ -48,7 +48,7 @@ $item-ios-padding-icon-top:           10px !default;
 $item-ios-padding-icon-bottom:        9px !default;
 
 
-// iOS Icon
+// iOS Item Push Icon
 // --------------------------------------------------
 
 $icon-detail-push-background-svg:    "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 20'><path d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z' fill='fg-color'/></svg>" !default;

src/themes/default.md.scss

@@ -48,6 +48,16 @@ $item-md-padding-icon-top:            11px !default;
 $item-md-padding-icon-bottom:         10px !default;
 
 
+// Material Design Item Push Icon
+// --------------------------------------------------
+
+$icon-detail-push-background-svg:    "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 20'><path d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z' fill='fg-color'/></svg>" !default;
+
+@mixin md-detail-push-icon($fg-color) {
+  $svg: str-replace($icon-detail-push-background-svg, "fg-color", $fg-color);
+  @include svg-background-image($svg);
+}
+
 
 // Material Design Body
 // --------------------------------------------------

src/themes/default.wp.scss

@@ -48,6 +48,17 @@ $item-wp-padding-icon-top:            11px !default;
 $item-wp-padding-icon-bottom:         10px !default;
 
 
+// Windows Item Push Icon
+// --------------------------------------------------
+
+$icon-detail-push-background-svg:    "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 20'><path d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z' fill='fg-color'/></svg>" !default;
+
+@mixin wp-detail-push-icon($fg-color) {
+  $svg: str-replace($icon-detail-push-background-svg, "fg-color", $fg-color);
+  @include svg-background-image($svg);
+}
+
+
 // Windows Input
 // --------------------------------------------------