diff --git a/src/components/item/item.ios.scss b/src/components/item/item.ios.scss
index 536a79d1e6..7af4790ac8 100644
--- a/src/components/item/item.ios.scss
+++ b/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,
-.item[detail-push] .item-inner {
+
+// iOS Item Detail Push
+// --------------------------------------------------
+
+@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
// --------------------------------------------------
diff --git a/src/components/item/item.md.scss b/src/components/item/item.md.scss
index fbca15d0cb..eed37782cb 100644
--- a/src/components/item/item.md.scss
+++ b/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
// --------------------------------------------------
diff --git a/src/components/item/item.wp.scss b/src/components/item/item.wp.scss
index d6f7f240d1..77d06a0a60 100644
--- a/src/components/item/item.wp.scss
+++ b/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
// --------------------------------------------------
diff --git a/src/components/item/test/buttons/main.html b/src/components/item/test/buttons/main.html
index d0ede1aeb4..257205a49d 100644
--- a/src/components/item/test/buttons/main.html
+++ b/src/components/item/test/buttons/main.html
@@ -88,7 +88,7 @@
-