inset lists, card updates

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

@@ -30,18 +30,18 @@ import {App, ActionMenu, IonicApp, IonicView, Register} from 'ionic/ionic';
     </ion-list>
 
     <div class="padding">
-      <div class="card">
-        <div class="card-header">
+      <ion-card>
+        <ion-header>
           New Post
-        </div>
+        </ion-header>
         <div class="card-content">
           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.
         </div>
         <img src="http://ionic-io-assets.s3.amazonaws.com/images/p4.png">
-        <div class="card-footer">
+        <ion-footer>
           Posted 5 days ago
-        </div>
-      </div>
+        </ion-footer>
+      </ion-card>
     </div>
 
     ` +

ionic/components/app/test/sink/pages/card.ts

@@ -17,31 +17,25 @@ import {SinkPage} from '../sink-page';
       Cards are great for displaying contextual information in a small space,
       like a Tweet, todays weather report, or a photo.
     </p>
-    <div class="card">
 
-      <div class="item card-header">
-        <div class="item-content">
-          <div class="item-label">
-            Card Header
-          </div>
-        </div>
-      </div>
+    <ion-card>
+
+      <ion-header>
+        Card Header
+      </ion-header>
 
       <div class="item">
-          <div class="item-media">
-            <img src="http://i.imgur.com/7BEPcGo.jpg">
-          </div>
-      </div>
-
-      <div class="item card-footer">
-        <div class="item-content">
-          <div class="item-label">
-            Card Footer
-          </div>
+        <div class="item-media">
+          <img src="http://i.imgur.com/7BEPcGo.jpg">
         </div>
       </div>
 
-    </div>
+      <ion-footer>
+        Card Footer
+      </ion-footer>
+
+    </ion-card>
+
   </ion-content>
   `
 })

ionic/components/app/test/sink/pages/list.ts

@@ -19,9 +19,9 @@ import {SinkPage} from '../sink-page';
 
     <ion-list inset>
 
-      <ion-list-header>
+      <ion-header>
         List Header
-      </ion-list-header>
+      </ion-header>
 
       <ion-item>
         <input control="email" type="email" placeholder="Your email">
@@ -35,9 +35,9 @@ import {SinkPage} from '../sink-page';
       </div>
       <ion-item>Item</ion-item>
 
-      <ion-list-footer>
+      <ion-footer>
         List Footer
-      </ion-list-footer>
+      </ion-footer>
 
     </ion-list>
   </ion-content>

ionic/components/app/test/snapcat/detail.html

@@ -1,13 +1,19 @@
 <ion-navbar *navbar id="p2toolbar"><ion-title>Post</ion-title></ion-navbar>
 
 <ion-content>
-  <div class="card">
+
+  <ion-card>
+
     <div class="card-content">
       {{post.text}}
     </div>
+
     <img src="{{post.image}}">
-    <div class="card-footer">
+
+    <ion-footer>
       Posted {{post.day}} ago
-    </div>
-  </div>
+    </ion-footer>
+
+  </ion-card>
+
 </ion-content>