Tweaking item stuff

ionic/components/app/test/material/index.ts

@@ -16,7 +16,8 @@ import {App, IonicView, Register} from 'ionic/ionic';
   '<ion-content>' +
     `<ion-list>
       <ion-item>
-        All Genres
+        <h3>All Genres</h3>
+        <h4>Jan 17 2015</h4>
       </ion-item>
       <ion-item>
         Alternative

ionic/components/item/extensions/material.scss

@@ -6,12 +6,17 @@ $item-material-label-color:         #222;
   .item {
     padding-left: 16px;
   }
+
   .item-content {
     min-height: $item-material-min-height;
-    padding-right: 16px;
+    padding: 16px 16px 16px 0px;
     border-bottom: 1px solid #DBDBDB;
   }
 
+  .item-media {
+    display: block;
+  }
+
   .item-label {
     color: $item-material-label-color;
     font-size: $item-material-font-size;

ionic/components/item/item.scss

@@ -97,6 +97,9 @@ ion-primary-swipe-buttons {
   flex: 1;
   flex-shrink: 1;
 
+  // To enable multi-line text more easily
+  flex-direction: column;
+
   max-width: 100%;
 
   white-space: nowrap;
@@ -163,3 +166,28 @@ ion-primary-swipe-buttons {
 .item-full {
 
 }
+
+
+// Some testing things
+
+.item-media-placeholder {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  background: #aaa;
+  margin-right: 16px;
+}
+
+.item-label h3 {
+  margin-top: 0;
+  margin-bottom: 0;
+  font-size: 16px;
+  color: #222;
+  font-weight: normal;
+}
+.item-label h4 {
+  margin-top: 8px;
+  font-size: 14px;
+  line-height: 14px;
+  color: #858585;
+}

ionic/components/item/item.ts

@@ -19,6 +19,7 @@ import {dom} from 'ionic/util';
     -->
     <div class="item-content">
       <div class="item-media">
+        <div class="item-media-placeholder"></div>
       </div>
       <div class="item-accessory">
         <!--<content select="ion-item-accessory"></content>-->

ionic/components/nav-bar/extensions/material.scss

@@ -14,6 +14,10 @@ $navbar-material-button-text-color:       #007aff !default;
   height: $navbar-material-height;
   background: $navbar-material-background;
 
+  .toolbar-inner-title {
+    padding: 0px 16px;
+  }
+
   ion-title {
     font-size: $navbar-material-title-font-size;
     font-weight: bold;