diff --git a/ionic/components/item/modes/ios.scss b/ionic/components/item/modes/ios.scss
index f208e9ee40..7e62e390fa 100644
--- a/ionic/components/item/modes/ios.scss
+++ b/ionic/components/item/modes/ios.scss
@@ -3,6 +3,7 @@
// --------------------------------------------------
$item-ios-border-color: $list-border-color !default;
+$item-ios-activated-bg-color: #d9d9d9 !default;
$item-ios-font-size: 1.6rem !default;
$item-ios-padding-top: 13px !default;
@@ -37,6 +38,7 @@ $item-ios-forward-icon-color: $item-ios-border-color !default;
left: $item-ios-padding-left;
border-top: 1px solid $item-ios-border-color;
content: '';
+ pointer-events: none;
}
&:after {
@@ -46,12 +48,17 @@ $item-ios-forward-icon-color: $item-ios-border-color !default;
left: $item-ios-padding-left;
border-top: 1px solid $item-ios-border-color;
content: '';
+ pointer-events: none;
}
&:first-child:before,
&:last-child:after {
left: 0;
}
+
+ &.activated {
+ background-color: $item-ios-activated-bg-color;
+ }
}
ion-header + .item:before {
diff --git a/ionic/components/item/modes/material.scss b/ionic/components/item/modes/material.scss
index a9b067fb16..ce74b48ad7 100644
--- a/ionic/components/item/modes/material.scss
+++ b/ionic/components/item/modes/material.scss
@@ -3,6 +3,7 @@
// --------------------------------------------------
$item-md-border-color: grayscale(lighten($list-border-color, 8%)) !default;
+$item-md-activated-bg-color: #f1f1f1 !default;
$item-md-font-size: 1.6rem !default;
$item-md-padding-top: 13px !default;
@@ -38,6 +39,7 @@ $item-md-forward-icon-color: $item-md-border-color !default;
left: $item-md-padding-left;
border-top: 1px solid $item-md-border-color;
content: '';
+ pointer-events: none;
}
&:after {
@@ -47,12 +49,17 @@ $item-md-forward-icon-color: $item-md-border-color !default;
left: $item-md-padding-left;
border-top: 1px solid $item-md-border-color;
content: '';
+ pointer-events: none;
}
&:first-child:before,
&:last-child:after {
left: 0;
}
+
+ &.activated {
+ background-color: $item-md-activated-bg-color;
+ }
}
ion-header + .item:before {
diff --git a/ionic/components/list/list.scss b/ionic/components/list/list.scss
index 949143824b..b183072925 100644
--- a/ionic/components/list/list.scss
+++ b/ionic/components/list/list.scss
@@ -18,9 +18,10 @@
}
.list[inset] {
- border: 1px solid $list-border-color;
-}
+ border-radius: 2px;
+ overflow: hidden;
-.hairlines .list[inset] {
- border-width: 0.55px;
+ ion-header {
+ background-color: $list-background-color;
+ }
}
diff --git a/ionic/components/list/test/inset/main.html b/ionic/components/list/test/inset/main.html
index 6d65518506..7720d80fdb 100644
--- a/ionic/components/list/test/inset/main.html
+++ b/ionic/components/list/test/inset/main.html
@@ -2,37 +2,70 @@
Inset List
-
-
- Inset List Header
-
-
- Keep close to Nature's heart... and break clear away, once in awhile, and
- climb a mountain or spend a week in the woods. Wash your spirit clean.
-
-
+
+
+
+
+
+ Inset List Header
+
+
+
+
+ List Link Item 1
+
+
+
+
+
+ List Link Item 2
+
+
+
+
+
+
+
+
-
+
-
-
- All Out Inset List
-
-
+
+ Inset List, No Header
+
+
-
- This is a multiline content within a list that should
- take up multiple lines and stuff.
-
+
+ List Item 1
+
-
+
+ List Item 2
+
+
+
+ This is a multiline content within a list that should
+ take up multiple lines and stuff.
+
+
+
-
+
-
- Inset List, no header
-
+
+ Inset List, no header, no items
+
-
+
+
+