diff --git a/dist/css/ionic-ios7.css b/dist/css/ionic-ios7.css
index 3d58dad1af..d41be4aa8a 100644
--- a/dist/css/ionic-ios7.css
+++ b/dist/css/ionic-ios7.css
@@ -1135,6 +1135,30 @@ a.list-item {
.list-icon-left.list-icon-right .list-item-content i:last-child {
left: auto; }
+.list-thumbnail h2 {
+ overflow: hidden;
+ margin: 0 0 8px 0;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ font-size: 16px; }
+
+.list-thumbnail p {
+ overflow: hidden;
+ margin-bottom: 0;
+ text-overflow: ellipsis;
+ white-space: nowrap; }
+
+.list-thumbnail .list-item-content {
+ padding-left: 95px;
+ min-height: 80px; }
+ .list-thumbnail .list-item-content img {
+ position: absolute;
+ top: 0;
+ left: 0;
+ max-width: 80px;
+ max-height: 80px;
+ width: 100%; }
+
.list-item-sliding {
-webkit-transition: -webkit-transform 0.1s ease-in-out; }
diff --git a/dist/css/ionic-scoped.css b/dist/css/ionic-scoped.css
index a54d4ef2bb..06a750914a 100644
--- a/dist/css/ionic-scoped.css
+++ b/dist/css/ionic-scoped.css
@@ -1827,6 +1827,27 @@
font-size: 28px; }
.ionic .list-icon-left.list-icon-right .list-item-content i:last-child {
left: auto; }
+ .ionic .list-thumbnail h2 {
+ overflow: hidden;
+ margin: 0 0 8px 0;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ font-size: 16px; }
+ .ionic .list-thumbnail p {
+ overflow: hidden;
+ margin-bottom: 0;
+ text-overflow: ellipsis;
+ white-space: nowrap; }
+ .ionic .list-thumbnail .list-item-content {
+ padding-left: 95px;
+ min-height: 80px; }
+ .ionic .list-thumbnail .list-item-content img {
+ position: absolute;
+ top: 0;
+ left: 0;
+ max-width: 80px;
+ max-height: 80px;
+ width: 100%; }
.ionic .list-item-sliding {
-webkit-transition: -webkit-transform 0.1s ease-in-out; }
.ionic .list-item-reordering {
diff --git a/dist/css/ionic.css b/dist/css/ionic.css
index 7338ecc21b..966afd020c 100644
--- a/dist/css/ionic.css
+++ b/dist/css/ionic.css
@@ -2244,6 +2244,30 @@ a.list-item {
.list-icon-left.list-icon-right .list-item-content i:last-child {
left: auto; }
+.list-thumbnail h2 {
+ overflow: hidden;
+ margin: 0 0 8px 0;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ font-size: 16px; }
+
+.list-thumbnail p {
+ overflow: hidden;
+ margin-bottom: 0;
+ text-overflow: ellipsis;
+ white-space: nowrap; }
+
+.list-thumbnail .list-item-content {
+ padding-left: 95px;
+ min-height: 80px; }
+ .list-thumbnail .list-item-content img {
+ position: absolute;
+ top: 0;
+ left: 0;
+ max-width: 80px;
+ max-height: 80px;
+ width: 100%; }
+
.list-item-sliding {
-webkit-transition: -webkit-transform 0.1s ease-in-out; }
diff --git a/scss/ionic/_listview.scss b/scss/ionic/_listview.scss
index 62addb6af7..93fd26cfb4 100644
--- a/scss/ionic/_listview.scss
+++ b/scss/ionic/_listview.scss
@@ -136,7 +136,7 @@ a.list-item {
position: absolute;
top: ($list-item-padding / 2) + 3;
left: $list-item-padding / 2;
- font-size: $icon-font-size;
+ font-size: $list-icon-font-size;
}
}
@@ -147,7 +147,7 @@ a.list-item {
position: absolute;
top: ($list-item-padding / 2) + 3;
right: $list-item-padding / 2;
- font-size: $icon-font-size;
+ font-size: $list-icon-font-size;
}
}
@@ -155,6 +155,34 @@ a.list-item {
left: auto;
}
+.list-thumbnail h2 {
+ overflow: hidden;
+ margin: 0 0 8px 0;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ font-size: 16px;
+}
+
+.list-thumbnail p {
+ overflow: hidden;
+ margin-bottom: 0;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.list-thumbnail .list-item-content {
+ padding-left: $list-thumbnail-width + $list-item-padding;
+ min-height: $list-thumbnail-width;
+
+ img {
+ position: absolute;
+ top: 0;
+ left: 0;
+ max-width: $list-thumbnail-width;
+ max-height: $list-thumbnail-width;
+ width: 100%;
+ }
+}
.list-item-sliding {
-webkit-transition: -webkit-transform 0.1s ease-in-out;
diff --git a/scss/ionic/_variables.scss b/scss/ionic/_variables.scss
index 922bff429f..96e79f674a 100644
--- a/scss/ionic/_variables.scss
+++ b/scss/ionic/_variables.scss
@@ -337,41 +337,44 @@ $tabs-dark-border-color: $button-dark-border;
// Lists
// -------------------------------
-$list-divider-bg: #f5f5f5;
-$list-divider-color: #222;
-$list-item-border-width: 1px !default;
-$list-item-border-color: #ddd;
-$list-item-padding: 15px !default;
+$list-divider-bg: #f5f5f5;
+$list-divider-color: #222;
+$list-item-border-width: 1px !default;
+$list-item-border-color: #ddd;
+$list-item-padding: 15px !default;
-$list-default-background: $brand-default;
-$list-default-border: #ddd;
+$list-default-background: $brand-default;
+$list-default-border: #ddd;
-$list-secondary-background: $brand-secondary;
-$list-secondary-border: #ddd;
+$list-secondary-background: $brand-secondary;
+$list-secondary-border: #ddd;
-$list-success-background: $brand-success;
-$list-success-border: $brand-success;
+$list-success-background: $brand-success;
+$list-success-border: $brand-success;
-$list-primary-background: $brand-primary;
-$list-primary-border: $brand-primary;
+$list-primary-background: $brand-primary;
+$list-primary-border: $brand-primary;
-$list-info-background: $brand-info;
-$list-info-border: $brand-info;
+$list-info-background: $brand-info;
+$list-info-border: $brand-info;
-$list-warning-background: $brand-warning;
-$list-warning-border: $brand-warning;
+$list-warning-background: $brand-warning;
+$list-warning-border: $brand-warning;
-$list-danger-background: $brand-danger;
-$list-danger-border: $brand-danger;
+$list-danger-background: $brand-danger;
+$list-danger-border: $brand-danger;
-$list-dark-background: $brand-dark;
-$list-dark-border: $brand-dark;
+$list-dark-background: $brand-dark;
+$list-dark-border: $brand-dark;
+
+$list-icon-font-size: 28px !default;
+
+$list-thumbnail-width: 80px !default;
// Icons
// -------------------------------
-$icon-font-size: 28px !default;
$icon-fill-border-radius: 6px !default;
diff --git a/test/lists.html b/test/lists.html
index 095585afcd..5349cb53de 100644
--- a/test/lists.html
+++ b/test/lists.html
@@ -166,6 +166,57 @@
+
+
+
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+