From 1a8f6d745db34f7cfadb6120f498749cd66da0cf Mon Sep 17 00:00:00 2001
From: Adam Bradley <adambradley25@gmail.com>
Date: Fri, 17 Jun 2016 11:43:30 -0500
Subject: [PATCH] test(header): update header markup

---
 .../action-sheet/test/basic/index.ts          |  14 +-
 .../action-sheet/test/basic/main.html         |  12 +-
 src/components/alert/test/basic/index.ts      |  14 +-
 src/components/alert/test/basic/main.html     |  11 +-
 src/components/alert/test/dismiss/index.ts    |  10 +-
 src/components/alert/test/dismiss/main.html   |  15 +-
 src/components/app/test/animations/main.html  |  11 +-
 src/components/app/test/cordova/index.ts      |  44 ++---
 src/components/app/test/cordova/page1.html    |  46 +++--
 src/components/app/test/cordova/page2.html    |  40 +++--
 src/components/app/test/cordova/page3.html    |  13 +-
 src/components/app/test/gestures/main.html    |  11 +-
 src/components/app/test/typography/main.html  |  10 +-
 src/components/badge/test/basic/main.html     |  14 +-
 src/components/button/test/block/main.html    |  10 +-
 src/components/button/test/clear/main.html    |  10 +-
 src/components/button/test/dynamic/main.html  |  24 ++-
 src/components/button/test/full/main.html     |  12 +-
 src/components/button/test/icons/main.html    |  10 +-
 src/components/button/test/raised/main.html   |  11 +-
 src/components/button/test/round/main.html    |  12 +-
 src/components/button/test/sizes/main.html    |  10 +-
 src/components/card/test/advanced/main.html   |   9 +-
 src/components/card/test/basic/main.html      |   8 +-
 src/components/card/test/images/main.html     |   7 +-
 src/components/card/test/list/main.html       |   9 +-
 src/components/card/test/map/main.html        | 155 ++++++++--------
 src/components/card/test/social/main.html     | 167 +++++++++---------
 src/components/checkbox/test/basic/main.html  |   7 +-
 src/components/chip/test/basic/main.html      |  11 +-
 src/components/chip/test/delete/main.html     |  11 +-
 src/components/chip/test/image/main.html      |  11 +-
 src/components/datetime/test/basic/main.html  |  11 +-
 src/components/datetime/test/labels/main.html |  11 +-
 src/components/grid/test/alignment/main.html  |   9 +-
 src/components/grid/test/basic/main.html      |   9 +-
 src/components/grid/test/full/main.html       |   9 +-
 src/components/icon/test/basic/main.html      |  11 +-
 .../infinite-scroll/test/basic/main.html      |   9 +-
 .../infinite-scroll/test/short-list/main.html |   9 +-
 .../input/test/clear-input/main.html          |  11 +-
 .../input/test/fixed-inline-labels/main.html  |  10 +-
 .../input/test/floating-labels/main.html      |   9 +-
 .../input/test/form-inputs/main.html          |   7 +-
 .../input/test/inline-labels/main.html        |   7 +-
 .../input/test/input-focus/main.html          |  20 ++-
 .../input/test/inset-inputs/main.html         |  11 +-
 .../input/test/placeholder-labels/main.html   |   9 +-
 .../input/test/stacked-labels/main.html       |  10 +-
 src/components/item/test/buttons/main.html    |  10 +-
 src/components/item/test/dividers/main.html   |  10 +-
 src/components/item/test/groups/index.ts      |  14 +-
 .../item/test/groups/session-list.html        |  17 +-
 src/components/item/test/icons/main.html      |  11 +-
 src/components/item/test/images/main.html     |  10 +-
 src/components/item/test/media/main.html      |  10 +-
 src/components/item/test/sliding/main.html    |  19 +-
 src/components/item/test/text/main.html       |   9 +-
 src/components/list/test/headers/main.html    |   9 +-
 src/components/list/test/inset/main.html      |   7 +-
 src/components/list/test/no-lines/main.html   |  11 +-
 .../list/test/repeat-headers/main.html        |  12 +-
 src/components/loading/test/basic/index.ts    |  34 ++--
 src/components/loading/test/basic/main.html   |  33 ++--
 src/components/loading/test/tabs/index.ts     |   8 +-
 src/components/loading/test/tabs/main.html    |  12 +-
 src/components/menu/test/basic/page1.html     |  45 ++---
 src/components/menu/test/basic/page2.html     |  20 ++-
 src/components/menu/test/basic/page3.html     |  27 ++-
 .../menu/test/disable-swipe/page1.html        |  26 +--
 .../menu/test/enable-disable/main.html        |   1 -
 .../menu/test/enable-disable/page1.html       |  20 ++-
 .../menu/test/enable-disable/page2.html       |  20 ++-
 src/components/menu/test/multiple/main.html   |   1 -
 src/components/menu/test/multiple/page1.html  |  19 +-
 src/components/menu/test/overlay/page1.html   |  27 ++-
 src/components/menu/test/push/page1.html      |  27 ++-
 src/components/menu/test/reveal/page1.html    |  27 ++-
 src/components/modal/test/basic/main.html     |   5 +
 src/components/nav/test/child-navs/index.ts   |  56 +++---
 src/components/nav/test/insert-views/index.ts |  28 +--
 src/components/nav/test/nested/index.ts       |  36 ++--
 src/components/nav/test/routing/view1.html    |  18 +-
 src/components/nav/test/routing/view2.html    |  22 ++-
 src/components/nav/test/routing/view3.html    |  12 +-
 src/components/picker/test/basic/main.html    |  15 +-
 src/components/popover/test/basic/main.html   |  72 ++++----
 src/components/radio/test/basic/main.html     |  10 +-
 src/components/range/test/basic/page1.html    |  26 +--
 src/components/refresher/test/basic/main.html |   9 +-
 src/components/scroll/test/basic/main.html    |  40 +++--
 src/components/searchbar/test/nav/detail.html |  14 +-
 src/components/searchbar/test/nav/main.html   |  13 +-
 src/components/searchbar/test/nav/search.html |  22 ++-
 .../searchbar/test/toolbar/main.html          |  12 +-
 src/components/segment/test/basic/main.html   | 141 ++++++++-------
 src/components/segment/test/nav/index.ts      |  18 +-
 src/components/segment/test/nav/main.html     |  42 +++--
 src/components/segment/test/swipe/main.html   |  43 +++--
 .../select/test/multiple-value/main.html      |  11 +-
 .../select/test/single-value/main.html        |  11 +-
 .../show-hide-when/test/basic/main.html       |  20 ++-
 src/components/slides/test/intro/index.ts     |   8 +-
 src/components/slides/test/intro/main.html    |   5 +
 src/components/slides/test/scroll/main.html   |  11 +-
 src/components/spinner/test/basic/main.html   |  10 +-
 .../tabs/test/advanced/modalChat.html         |   5 +
 src/components/tabs/test/advanced/signIn.html |   5 +
 .../tabs/test/advanced/tab1page1.html         |   5 +
 .../tabs/test/advanced/tab1page2.html         |   5 +
 .../tabs/test/advanced/tab1page3.html         |   7 +-
 .../tabs/test/advanced/tab2page1.html         |   7 +-
 .../tabs/test/advanced/tab2page2.html         |   7 +-
 .../tabs/test/advanced/tab2page3.html         |   7 +-
 .../tabs/test/advanced/tab3page1.html         |   7 +-
 src/components/toast/test/basic/main.html     |   5 +
 src/components/toggle/test/basic/main.html    |   8 +-
 .../virtual-scroll/test/basic/main.html       |   5 +-
 .../test/image-gallery/main.html              |   4 +
 .../test/sliding-item/main.html               |   5 +-
 tooling/generators/page/page.tmpl.html        |   3 +
 121 files changed, 1418 insertions(+), 824 deletions(-)

diff --git a/src/components/action-sheet/test/basic/index.ts b/src/components/action-sheet/test/basic/index.ts
index 34da55c8b4..c2caa533a6 100644
--- a/src/components/action-sheet/test/basic/index.ts
+++ b/src/components/action-sheet/test/basic/index.ts
@@ -154,12 +154,14 @@ class E2EPage {
 
 @Component({
   template: `
-    <ion-toolbar>
-      <ion-buttons start>
-        <button (click)="dismiss()">Close</button>
-      </ion-buttons>
-      <ion-title>Modal</ion-title>
-    </ion-toolbar>
+    <ion-header>
+      <ion-toolbar>
+        <ion-buttons start>
+          <button (click)="dismiss()">Close</button>
+        </ion-buttons>
+        <ion-title>Modal</ion-title>
+      </ion-toolbar>
+    </ion-header>
     <ion-content padding>
       Hi, I'm Bob, and I'm a modal.
     </ion-content>
diff --git a/src/components/action-sheet/test/basic/main.html b/src/components/action-sheet/test/basic/main.html
index 93915ed9a2..59de1bfa63 100644
--- a/src/components/action-sheet/test/basic/main.html
+++ b/src/components/action-sheet/test/basic/main.html
@@ -1,9 +1,14 @@
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Action Sheet</ion-title>
+  </ion-navbar>
+
+</ion-header>
 
-<ion-navbar *navbar>
-  <ion-title>Action Sheet</ion-title>
-</ion-navbar>
 
 <ion-content padding>
+
   <button block class="e2eOpenActionSheet" (click)="presentActionSheet1()">Present Action Sheet 1</button>
   <button block (click)="presentActionSheet2()">Present Action Sheet 2</button>
   <button block (click)="presentActionSheet3()">Present Action Sheet 3</button>
@@ -11,4 +16,5 @@
   <pre>
     Result: {{result}}
   </pre>
+
 </ion-content>
diff --git a/src/components/alert/test/basic/index.ts b/src/components/alert/test/basic/index.ts
index 23e2050c44..766e3c1881 100644
--- a/src/components/alert/test/basic/index.ts
+++ b/src/components/alert/test/basic/index.ts
@@ -295,12 +295,14 @@ class E2EPage {
 
 @Component({
   template: `
-    <ion-toolbar>
-      <ion-buttons>
-        <button (click)="dismiss()">Close</button>
-      </ion-buttons>
-      <ion-title>Modal</ion-title>
-    </ion-toolbar>
+    <ion-header>
+      <ion-toolbar>
+        <ion-buttons>
+          <button (click)="dismiss()">Close</button>
+        </ion-buttons>
+        <ion-title>Modal</ion-title>
+      </ion-toolbar>
+    </ion-header>
     <ion-content padding>
       Hi, I'm Bob, and I'm a modal.
     </ion-content>
diff --git a/src/components/alert/test/basic/main.html b/src/components/alert/test/basic/main.html
index 3aa69d47c2..eb58eafab7 100644
--- a/src/components/alert/test/basic/main.html
+++ b/src/components/alert/test/basic/main.html
@@ -1,6 +1,11 @@
-<ion-navbar *navbar>
-  <ion-title>Alerts</ion-title>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Alerts</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content padding>
 
diff --git a/src/components/alert/test/dismiss/index.ts b/src/components/alert/test/dismiss/index.ts
index be0148cae1..a01daa24eb 100644
--- a/src/components/alert/test/dismiss/index.ts
+++ b/src/components/alert/test/dismiss/index.ts
@@ -24,7 +24,7 @@ export class E2EPage {
       ]
     });
 
-    alert.onDismiss((asdf) => {
+    alert.onDismiss(() => {
       console.log('dismiss');
       this.nav.push(AnotherPage);
     });
@@ -35,9 +35,11 @@ export class E2EPage {
 
 @Component({
   template: `
-    <ion-navbar *navbar>
-      <ion-title>Another Page</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar>
+        <ion-title>Another Page</ion-title>
+      </ion-navbar>
+    </ion-header>
     <ion-content padding>
       <form [ngFormModel]="form" (ngSubmit)="submit(form.value)">
     		<ion-list>
diff --git a/src/components/alert/test/dismiss/main.html b/src/components/alert/test/dismiss/main.html
index 9cfa06a9e5..d917a544bb 100644
--- a/src/components/alert/test/dismiss/main.html
+++ b/src/components/alert/test/dismiss/main.html
@@ -1,8 +1,13 @@
-<ion-navbar *navbar>
-  <ion-title>
-    Alert Dismiss
-  </ion-title>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>
+      Alert Dismiss
+    </ion-title>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content>
 
diff --git a/src/components/app/test/animations/main.html b/src/components/app/test/animations/main.html
index 92b87cb349..24876901d1 100644
--- a/src/components/app/test/animations/main.html
+++ b/src/components/app/test/animations/main.html
@@ -1,6 +1,11 @@
-<ion-navbar *navbar>
-  <ion-title>Animations</ion-title>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Animations</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content>
 
diff --git a/src/components/app/test/cordova/index.ts b/src/components/app/test/cordova/index.ts
index 682c8bf329..b1559e9073 100644
--- a/src/components/app/test/cordova/index.ts
+++ b/src/components/app/test/cordova/index.ts
@@ -23,17 +23,19 @@ export class OtherData {
 
 @Component({
   template: `
-  <ion-toolbar>
-    <ion-title>This is a modal</ion-title>
-    <button menuToggle class="e2eCordovaOpenLeftMenu">
-      <ion-icon name="menu"></ion-icon>
-    </button>
-    <ion-buttons end>
-      <button>
-        <ion-icon name="funnel"></ion-icon>
+  <ion-header>
+    <ion-toolbar>
+      <ion-title>This is a modal</ion-title>
+      <button menuToggle class="e2eCordovaOpenLeftMenu">
+        <ion-icon name="menu"></ion-icon>
       </button>
-    </ion-buttons>
-  </ion-toolbar>
+      <ion-buttons end>
+        <button>
+          <ion-icon name="funnel"></ion-icon>
+        </button>
+      </ion-buttons>
+    </ion-toolbar>
+  </ion-header>
   <ion-content padding>
     <p>The modal toolbar should have status bar padding.</p>
     <button block (click)="dismissModal()">Close modal</button>
@@ -97,17 +99,19 @@ class Page3 {
 
 @Component({
   template: `
-  <ion-navbar *navbar>
-    <ion-title>This is a tab page</ion-title>
-    <button menuToggle>
-      <ion-icon name="menu"></ion-icon>
-    </button>
-    <ion-buttons end>
-      <button>
-        <ion-icon name="funnel"></ion-icon>
+  <ion-header>
+    <ion-navbar>
+      <ion-title>This is a tab page</ion-title>
+      <button menuToggle>
+        <ion-icon name="menu"></ion-icon>
       </button>
-    </ion-buttons>
-  </ion-navbar>
+      <ion-buttons end>
+        <button>
+          <ion-icon name="funnel"></ion-icon>
+        </button>
+      </ion-buttons>
+    </ion-navbar>
+  </ion-header>
   <ion-content padding>
     <p>The toolbar should have status bar padding.</p>
   </ion-content>
diff --git a/src/components/app/test/cordova/page1.html b/src/components/app/test/cordova/page1.html
index b6f1d1280d..762332f954 100644
--- a/src/components/app/test/cordova/page1.html
+++ b/src/components/app/test/cordova/page1.html
@@ -1,27 +1,35 @@
-<ion-navbar *navbar primary>
-  <ion-segment [(ngModel)]="sort" light>
-    <ion-segment-button value="all">All</ion-segment-button>
-    <ion-segment-button value="favorites">Favorites</ion-segment-button>
-  </ion-segment>
-  <button menuToggle>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-  <ion-buttons end>
-    <button>
-      <ion-icon name="search"></ion-icon>
+<ion-header>
+
+  <ion-navbar primary>
+    <ion-segment [(ngModel)]="sort" light>
+      <ion-segment-button value="all">All</ion-segment-button>
+      <ion-segment-button value="favorites">Favorites</ion-segment-button>
+    </ion-segment>
+    <button menuToggle>
+      <ion-icon name="menu"></ion-icon>
     </button>
-  </ion-buttons>
-  <button menuToggle="right" right>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-</ion-navbar>
-<ion-toolbar>
-  <ion-title>I'm a toolbar</ion-title>
-</ion-toolbar>
+    <ion-buttons end>
+      <button>
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+    <button menuToggle="right" right>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-navbar>
+
+  <ion-toolbar>
+    <ion-title>I'm a toolbar</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content padding>
+
   <div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
 
   <button block [navPush]="page2" class="e2eCordovaPage2">Go to Page 2</button>
   <button block secondary (click)="goToTabs()">Go to Tabs</button>
+
 </ion-content>
diff --git a/src/components/app/test/cordova/page2.html b/src/components/app/test/cordova/page2.html
index d2a59ad0b8..1aa9f46a50 100644
--- a/src/components/app/test/cordova/page2.html
+++ b/src/components/app/test/cordova/page2.html
@@ -1,25 +1,33 @@
-<ion-navbar *navbar>
-  <ion-title>Page 2</ion-title>
-  <button menuToggle>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-  <ion-buttons end>
-    <button>
-      <ion-icon name="funnel"></ion-icon>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Page 2</ion-title>
+    <button menuToggle>
+      <ion-icon name="menu"></ion-icon>
     </button>
-  </ion-buttons>
-  <button menuToggle="right" right>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-</ion-navbar>
-<ion-toolbar>
-  <ion-title>I'm a toolbar</ion-title>
-</ion-toolbar>
+    <ion-buttons end>
+      <button>
+        <ion-icon name="funnel"></ion-icon>
+      </button>
+    </ion-buttons>
+    <button menuToggle="right" right>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-navbar>
+
+  <ion-toolbar>
+    <ion-title>I'm a toolbar</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content padding>
+
   <div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
 
   <button block [navPush]="page1">Go to Page 1</button>
   <button block [navPush]="page3" class="e2eCordovaPage3">Go to Page 3</button>
   <button block secondary (click)="openModal()" class="e2eCordovaOpenModal">Open Modal</button>
+
 </ion-content>
diff --git a/src/components/app/test/cordova/page3.html b/src/components/app/test/cordova/page3.html
index 9ab3eda08f..ffbec7b95c 100644
--- a/src/components/app/test/cordova/page3.html
+++ b/src/components/app/test/cordova/page3.html
@@ -1,10 +1,17 @@
 <ion-content padding>
+
   <h2>Page 3</h2>
   <div padding-bottom>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi scelerisque dolor lacus, ut vehicula arcu dapibus id. Morbi iaculis fermentum blandit. Curabitur tempus, ante et vehicula tempor, urna velit rutrum massa, quis suscipit purus lacus eget est. Sed nisi nulla, tempus id dictum a, cursus ut felis. Aliquam orci magna, rutrum nec tempor ac, fermentum quis eros. Sed ullamcorper felis sit amet tristique sagittis. Nullam sed tempus mi. Morbi sit amet lacinia leo. Nunc facilisis orci id consectetur dignissim. Integer dictum consectetur enim. Vivamus auctor, turpis ut eleifend pharetra, purus magna mattis arcu, vel pharetra tellus orci eget ex. Integer blandit posuere vehicula. Ut ipsum lorem, efficitur vitae eleifend tincidunt, fermentum nec lacus. Ut nec fermentum dui.</div>
 
   <button block (click)="goBack()" class="e2eCordovaGoBack">Go Back</button>
+
 </ion-content>
 
-<ion-toolbar position="bottom">
-  <ion-title>I'm a bottom toolbar</ion-title>
-</ion-toolbar>
+
+<ion-footer>
+
+  <ion-toolbar>
+    <ion-title>I'm a bottom toolbar</ion-title>
+  </ion-toolbar>
+
+</ion-footer>
diff --git a/src/components/app/test/gestures/main.html b/src/components/app/test/gestures/main.html
index c904b1465d..3f934bfbe3 100644
--- a/src/components/app/test/gestures/main.html
+++ b/src/components/app/test/gestures/main.html
@@ -1,6 +1,11 @@
-<ion-navbar *navbar>
-  <ion-title>Gestures</ion-title>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Gestures</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content padding>
 
diff --git a/src/components/app/test/typography/main.html b/src/components/app/test/typography/main.html
index b3f7810821..015e05ce62 100644
--- a/src/components/app/test/typography/main.html
+++ b/src/components/app/test/typography/main.html
@@ -1,7 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Typography</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Typography</ion-title>
-</ion-toolbar>
 
 <ion-content padding>
 
diff --git a/src/components/badge/test/basic/main.html b/src/components/badge/test/basic/main.html
index 3a2f0cf16a..3a39f838e8 100644
--- a/src/components/badge/test/basic/main.html
+++ b/src/components/badge/test/basic/main.html
@@ -1,8 +1,14 @@
-<ion-toolbar>
-  <ion-title>Badges</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Badges</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
+
   <ion-list>
     <ion-list-header>
       Badges Right
@@ -32,6 +38,7 @@
       <ion-badge item-right dark>99</ion-badge>
     </ion-item>
   </ion-list>
+
   <ion-list>
     <ion-list-header>
       Badges Left
@@ -61,4 +68,5 @@
       <ion-badge item-left dark>99</ion-badge>
     </ion-item>
   </ion-list>
+
 </ion-content>
diff --git a/src/components/button/test/block/main.html b/src/components/button/test/block/main.html
index cb324289f1..828df55def 100644
--- a/src/components/button/test/block/main.html
+++ b/src/components/button/test/block/main.html
@@ -1,7 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Block Buttons</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Block Buttons</ion-title>
-</ion-toolbar>
 
 <ion-content padding style="text-align:center">
 
diff --git a/src/components/button/test/clear/main.html b/src/components/button/test/clear/main.html
index 257fdc8a6b..c52c3f3389 100644
--- a/src/components/button/test/clear/main.html
+++ b/src/components/button/test/clear/main.html
@@ -1,7 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Clear Buttons</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Clear Buttons</ion-title>
-</ion-toolbar>
 
 <ion-content padding style="text-align:center">
 
diff --git a/src/components/button/test/dynamic/main.html b/src/components/button/test/dynamic/main.html
index 65e6fc8b9f..6faac74937 100644
--- a/src/components/button/test/dynamic/main.html
+++ b/src/components/button/test/dynamic/main.html
@@ -1,15 +1,20 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-buttons start>
+      <button [color]="isDestructive ? 'danger' : 'primary'" [outline]="isOutline">Outline</button>
+    </ion-buttons>
+    <ion-title>Default Buttons</ion-title>
+    <ion-buttons end>
+      <button [color]="isSecondary ? 'secondary' : 'primary'" [solid]="isSolid">Solid</button>
+    </ion-buttons>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-buttons start>
-    <button [color]="isDestructive ? 'danger' : 'primary'" [outline]="isOutline">Outline</button>
-  </ion-buttons>
-  <ion-title>Default Buttons</ion-title>
-  <ion-buttons end>
-    <button [color]="isSecondary ? 'secondary' : 'primary'" [solid]="isSolid">Solid</button>
-  </ion-buttons>
-</ion-toolbar>
 
 <ion-content padding>
+
   <button block [solid]="isSolid">Solid</button>
   <button block [color]="isDestructive ? 'danger' : 'primary'" [outline]="isOutline">Danger (Outline)</button>
   <button block [color]="isSecondary ? 'secondary' : 'primary'"  [clear]="isClear">Secondary (Clear)</button>
@@ -22,4 +27,5 @@
   <hr/>
   <button block outline danger (click)="unify()" class="e2eButtonDynamicUnify">Unify all buttons</button>
   <button block clear danger (click)="reset()">Reset all buttons</button>
+
 </ion-content>
diff --git a/src/components/button/test/full/main.html b/src/components/button/test/full/main.html
index 195c7296fb..d135a8aa54 100644
--- a/src/components/button/test/full/main.html
+++ b/src/components/button/test/full/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Full Buttons</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Full Buttons</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
 
@@ -34,4 +39,5 @@
     <a button full clear dark href="#">a[button][full][clear][dark]</a>
     <button full clear dark>button[full][clear][dark]</button>
   </p>
+
 </ion-content>
\ No newline at end of file
diff --git a/src/components/button/test/icons/main.html b/src/components/button/test/icons/main.html
index c6ab489375..081c17c2ed 100644
--- a/src/components/button/test/icons/main.html
+++ b/src/components/button/test/icons/main.html
@@ -1,7 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Buttons Icons</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Buttons Icons</ion-title>
-</ion-toolbar>
 
 <ion-content padding>
 
diff --git a/src/components/button/test/raised/main.html b/src/components/button/test/raised/main.html
index 51a9b1d7f3..cd85adc1fd 100644
--- a/src/components/button/test/raised/main.html
+++ b/src/components/button/test/raised/main.html
@@ -1,7 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Raised Buttons</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Raised Buttons</ion-title>
-</ion-toolbar>
 
 <ion-content padding style="text-align:center">
 
@@ -38,4 +42,5 @@
   <p>
     <button raised clear disabled>Clear Disabled</button>
   </p>
+
 </ion-content>
diff --git a/src/components/button/test/round/main.html b/src/components/button/test/round/main.html
index f90d2f7b70..e18627e16a 100644
--- a/src/components/button/test/round/main.html
+++ b/src/components/button/test/round/main.html
@@ -1,9 +1,14 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Round Buttons</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Round Buttons</ion-title>
-</ion-toolbar>
 
 <ion-content padding>
+
   <button round>button</button>
   <button round light>button light</button>
   <button round secondary>button secondary</button>
@@ -18,6 +23,7 @@
 
 </ion-content>
 
+
 <style>
   button {
     display: block !important;
diff --git a/src/components/button/test/sizes/main.html b/src/components/button/test/sizes/main.html
index 0db997df5a..c816c4719c 100644
--- a/src/components/button/test/sizes/main.html
+++ b/src/components/button/test/sizes/main.html
@@ -1,7 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Button Sizes</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Button Sizes</ion-title>
-</ion-toolbar>
 
 <ion-content padding>
 
diff --git a/src/components/card/test/advanced/main.html b/src/components/card/test/advanced/main.html
index 1d4b87ae25..d84e9487f7 100644
--- a/src/components/card/test/advanced/main.html
+++ b/src/components/card/test/advanced/main.html
@@ -1,5 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Advanced Cards</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar><ion-title>Advanced Cards</ion-title></ion-toolbar>
 
 <ion-content class="outer-content">
 
@@ -119,6 +125,7 @@
 
 </ion-content>
 
+
 <style>
   img {
     height: 100px;
diff --git a/src/components/card/test/basic/main.html b/src/components/card/test/basic/main.html
index 19dddc30b4..92d3bb3f57 100644
--- a/src/components/card/test/basic/main.html
+++ b/src/components/card/test/basic/main.html
@@ -1,5 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Basic Cards</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar><ion-title>Basic Cards</ion-title></ion-toolbar>
 
 <ion-content style="background: #e5e5e5">
 
diff --git a/src/components/card/test/images/main.html b/src/components/card/test/images/main.html
index acc934d6dd..ed42e79d65 100644
--- a/src/components/card/test/images/main.html
+++ b/src/components/card/test/images/main.html
@@ -1,5 +1,10 @@
+<ion-header>
 
-<ion-toolbar><ion-title>Card Images</ion-title></ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Card Images</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content class="outer-content">
diff --git a/src/components/card/test/list/main.html b/src/components/card/test/list/main.html
index 659866dd4a..0933dd9773 100644
--- a/src/components/card/test/list/main.html
+++ b/src/components/card/test/list/main.html
@@ -1,5 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>List Cards</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar><ion-title>List Cards</ion-title></ion-toolbar>
 
 <ion-content class="outer-content">
 
@@ -100,5 +106,4 @@
 
   </ion-card>
 
-
 </ion-content>
diff --git a/src/components/card/test/map/main.html b/src/components/card/test/map/main.html
index 51b6fcb4a5..a94a79ae7a 100644
--- a/src/components/card/test/map/main.html
+++ b/src/components/card/test/map/main.html
@@ -1,102 +1,107 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Map Card</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Map Card</ion-title>
-</ion-toolbar>
 
 <ion-content class="map-cards">
 
-<ion-card>
+  <ion-card>
 
-  <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
-  <button fab fab-right fab-top>
-    <ion-icon name="pin"></ion-icon>
-  </button>
-
-  <ion-item>
-    <ion-icon item-left large name="football"></ion-icon>
-    <h2>Museum of Football</h2>
-    <p>11 N. Way St, Madison, WI 53703</p>
-  </ion-item>
-
-  <ion-item>
-    <ion-icon item-left large name="wine"></ion-icon>
-    <h2>Institute of Fine Cocktails</h2>
-    <p>14 S. Hop Avenue, Madison, WI 53703</p>
-  </ion-item>
-
-  <ion-item>
-    <span item-left>18 min</span>
-    <span item-left>(2.6 mi)</span>
-    <button primary clear item-right>
-      <ion-icon name="navigate"></ion-icon>
-      Start
+    <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
+    <button fab fab-right fab-top>
+      <ion-icon name="pin"></ion-icon>
     </button>
-  </ion-item>
 
-</ion-card>
+    <ion-item>
+      <ion-icon item-left large name="football"></ion-icon>
+      <h2>Museum of Football</h2>
+      <p>11 N. Way St, Madison, WI 53703</p>
+    </ion-item>
 
-<ion-card>
+    <ion-item>
+      <ion-icon item-left large name="wine"></ion-icon>
+      <h2>Institute of Fine Cocktails</h2>
+      <p>14 S. Hop Avenue, Madison, WI 53703</p>
+    </ion-item>
 
-  <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
-  <button danger fab fab-right fab-top>
-    <ion-icon name="pin"></ion-icon>
-  </button>
+    <ion-item>
+      <span item-left>18 min</span>
+      <span item-left>(2.6 mi)</span>
+      <button primary clear item-right>
+        <ion-icon name="navigate"></ion-icon>
+        Start
+      </button>
+    </ion-item>
 
-  <ion-item>
-    <ion-icon item-left large name="cloud"></ion-icon>
-    <h2>Yoshi's Island</h2>
-    <p>Iggy Koopa</p>
-  </ion-item>
+  </ion-card>
 
-  <ion-item>
-    <ion-icon item-left large name="leaf"></ion-icon>
-    <h2>Forest of Illusion</h2>
-    <p>Roy Koopa</p>
-  </ion-item>
+  <ion-card>
 
-  <ion-item>
-    <span item-left>3 hr</span>
-    <span item-left>(4.8 mi)</span>
-    <button danger clear item-right>
-      <ion-icon name="navigate"></ion-icon>
-      Start
+    <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
+    <button danger fab fab-right fab-top>
+      <ion-icon name="pin"></ion-icon>
     </button>
-  </ion-item>
 
-</ion-card>
+    <ion-item>
+      <ion-icon item-left large name="cloud"></ion-icon>
+      <h2>Yoshi's Island</h2>
+      <p>Iggy Koopa</p>
+    </ion-item>
 
-<ion-card>
+    <ion-item>
+      <ion-icon item-left large name="leaf"></ion-icon>
+      <h2>Forest of Illusion</h2>
+      <p>Roy Koopa</p>
+    </ion-item>
 
-  <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
-  <button secondary fab fab-right fab-top>
-    <ion-icon name="pin"></ion-icon>
-  </button>
+    <ion-item>
+      <span item-left>3 hr</span>
+      <span item-left>(4.8 mi)</span>
+      <button danger clear item-right>
+        <ion-icon name="navigate"></ion-icon>
+        Start
+      </button>
+    </ion-item>
 
-  <ion-item>
-    <ion-icon item-left large name="information-circle"></ion-icon>
-    <h2>Museum of Information</h2>
-    <p>44 Rue de Info, 75010 Paris, France</p>
-  </ion-item>
+  </ion-card>
 
-  <ion-item>
-    <ion-icon item-left large name="leaf"></ion-icon>
-    <h2>General Pharmacy</h2>
-    <p>1 Avenue Faux, 75010 Paris, France</p>
-  </ion-item>
+  <ion-card>
 
-  <ion-item>
-    <span item-left secondary>26 min</span>
-    <span item-left>(8.1 mi)</span>
-    <button secondary clear item-right>
-      <ion-icon name="navigate"></ion-icon>
-      Start
+    <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
+    <button secondary fab fab-right fab-top>
+      <ion-icon name="pin"></ion-icon>
     </button>
-  </ion-item>
 
-</ion-card>
+    <ion-item>
+      <ion-icon item-left large name="information-circle"></ion-icon>
+      <h2>Museum of Information</h2>
+      <p>44 Rue de Info, 75010 Paris, France</p>
+    </ion-item>
+
+    <ion-item>
+      <ion-icon item-left large name="leaf"></ion-icon>
+      <h2>General Pharmacy</h2>
+      <p>1 Avenue Faux, 75010 Paris, France</p>
+    </ion-item>
+
+    <ion-item>
+      <span item-left secondary>26 min</span>
+      <span item-left>(8.1 mi)</span>
+      <button secondary clear item-right>
+        <ion-icon name="navigate"></ion-icon>
+        Start
+      </button>
+    </ion-item>
+
+  </ion-card>
 
 </ion-content>
 
+
 <style>
   .map-cards img {
     height: 200px;
diff --git a/src/components/card/test/social/main.html b/src/components/card/test/social/main.html
index 7175493542..c507a68110 100644
--- a/src/components/card/test/social/main.html
+++ b/src/components/card/test/social/main.html
@@ -1,109 +1,114 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Social Card</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Social Card</ion-title>
-</ion-toolbar>
 
 <ion-content class="social-cards">
 
-<ion-card>
+  <ion-card>
 
-  <ion-item>
-    <ion-avatar item-left>
-      <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
-    </ion-avatar>
-    <h2>Marty McFly</h2>
-    <p>November 5, 1955</p>
-  </ion-item>
+    <ion-item>
+      <ion-avatar item-left>
+        <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
+      </ion-avatar>
+      <h2>Marty McFly</h2>
+      <p>November 5, 1955</p>
+    </ion-item>
 
-  <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
+    <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
 
-  <ion-card-content>
-  <p>Wait a minute. Wait a minute, Doc. Uhhh... Are you telling me that you built a time machine... out of a DeLorean?! Whoa. This is heavy.</p>
-  </ion-card-content>
+    <ion-card-content>
+    <p>Wait a minute. Wait a minute, Doc. Uhhh... Are you telling me that you built a time machine... out of a DeLorean?! Whoa. This is heavy.</p>
+    </ion-card-content>
 
-  <ion-item>
-    <button primary clear item-left>
-      <ion-icon name="thumbs-up"></ion-icon>
-      <div>12 Likes</div>
-    </button>
-    <button primary clear item-left>
-      <ion-icon name="text"></ion-icon>
-      <div>4 Comments</div>
-    </button>
-    <ion-note item-right>
-      11h ago
-    </ion-note>
-  </ion-item>
+    <ion-item>
+      <button primary clear item-left>
+        <ion-icon name="thumbs-up"></ion-icon>
+        <div>12 Likes</div>
+      </button>
+      <button primary clear item-left>
+        <ion-icon name="text"></ion-icon>
+        <div>4 Comments</div>
+      </button>
+      <ion-note item-right>
+        11h ago
+      </ion-note>
+    </ion-item>
 
-</ion-card>
+  </ion-card>
 
 
-<ion-card>
+  <ion-card>
 
-  <ion-item>
-    <ion-avatar item-left>
-      <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
-    </ion-avatar>
-    <h2>Sarah Connor</h2>
-    <p>May 12, 1984</p>
-  </ion-item>
+    <ion-item>
+      <ion-avatar item-left>
+        <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
+      </ion-avatar>
+      <h2>Sarah Connor</h2>
+      <p>May 12, 1984</p>
+    </ion-item>
 
-  <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
+    <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
 
-  <ion-card-content>
-  <p>I face the unknown future, with a sense of hope. Because if a machine, a Terminator, can learn the value of human life, maybe we can too.</p>
-  </ion-card-content>
+    <ion-card-content>
+    <p>I face the unknown future, with a sense of hope. Because if a machine, a Terminator, can learn the value of human life, maybe we can too.</p>
+    </ion-card-content>
 
-  <ion-item>
-    <button primary clear item-left>
-      <ion-icon name="thumbs-up"></ion-icon>
-      <div>30 Likes</div>
-    </button>
-    <button primary clear item-left>
-      <ion-icon name="text"></ion-icon>
-      <div>64 Comments</div>
-    </button>
-    <ion-note item-right>
-      30yr ago
-    </ion-note>
-  </ion-item>
+    <ion-item>
+      <button primary clear item-left>
+        <ion-icon name="thumbs-up"></ion-icon>
+        <div>30 Likes</div>
+      </button>
+      <button primary clear item-left>
+        <ion-icon name="text"></ion-icon>
+        <div>64 Comments</div>
+      </button>
+      <ion-note item-right>
+        30yr ago
+      </ion-note>
+    </ion-item>
 
-</ion-card>
+  </ion-card>
 
-<ion-card>
+  <ion-card>
 
-  <ion-item>
-    <ion-avatar item-left>
-      <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
-    </ion-avatar>
-    <h2>Dr. Ian Malcolm</h2>
-    <p>June 28, 1990</p>
-  </ion-item>
+    <ion-item>
+      <ion-avatar item-left>
+        <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
+      </ion-avatar>
+      <h2>Dr. Ian Malcolm</h2>
+      <p>June 28, 1990</p>
+    </ion-item>
 
-  <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
+    <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAAAAAAALAAAAAABAAEAAAICTAEAOw==">
 
-  <ion-card-content>
-  <p>Your scientists were so preoccupied with whether or not they could, that they didn't stop to think if they should.</p>
-  </ion-card-content>
+    <ion-card-content>
+    <p>Your scientists were so preoccupied with whether or not they could, that they didn't stop to think if they should.</p>
+    </ion-card-content>
 
-  <ion-item>
-    <button primary clear item-left>
-      <ion-icon name="thumbs-up"></ion-icon>
-      <div>46 Likes</div>
-    </button>
-    <button primary clear item-left>
-      <ion-icon name="text"></ion-icon>
-      <div>66 Comments</div>
-    </button>
-    <ion-note item-right>
-      2d ago
-    </ion-note>
-  </ion-item>
+    <ion-item>
+      <button primary clear item-left>
+        <ion-icon name="thumbs-up"></ion-icon>
+        <div>46 Likes</div>
+      </button>
+      <button primary clear item-left>
+        <ion-icon name="text"></ion-icon>
+        <div>66 Comments</div>
+      </button>
+      <ion-note item-right>
+        2d ago
+      </ion-note>
+    </ion-item>
 
-</ion-card>
+  </ion-card>
 
 </ion-content>
 
+
 <style>
   .social-cards img {
     height: 200px;
diff --git a/src/components/checkbox/test/basic/main.html b/src/components/checkbox/test/basic/main.html
index 9a01100916..57b8f0d4c5 100644
--- a/src/components/checkbox/test/basic/main.html
+++ b/src/components/checkbox/test/basic/main.html
@@ -1,5 +1,10 @@
+<ion-header>
 
-<ion-toolbar><ion-title>Checkboxes</ion-title></ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Checkboxes</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content>
diff --git a/src/components/chip/test/basic/main.html b/src/components/chip/test/basic/main.html
index 42550dcd24..38be6b8758 100644
--- a/src/components/chip/test/basic/main.html
+++ b/src/components/chip/test/basic/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Chips With Text</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Chips With Text</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content padding style="text-align:center">
 
diff --git a/src/components/chip/test/delete/main.html b/src/components/chip/test/delete/main.html
index 9ee03db093..c583d22ec8 100644
--- a/src/components/chip/test/delete/main.html
+++ b/src/components/chip/test/delete/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Chips With Delete</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Chips With Delete</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content padding style="text-align:center">
 
diff --git a/src/components/chip/test/image/main.html b/src/components/chip/test/image/main.html
index bf5bf9d56a..0f05271813 100644
--- a/src/components/chip/test/image/main.html
+++ b/src/components/chip/test/image/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Chips With Image</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Chips With Image</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content padding style="text-align:center">
 
diff --git a/src/components/datetime/test/basic/main.html b/src/components/datetime/test/basic/main.html
index 85efaa4337..5d37766333 100644
--- a/src/components/datetime/test/basic/main.html
+++ b/src/components/datetime/test/basic/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Datetime</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Datetime</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
 
diff --git a/src/components/datetime/test/labels/main.html b/src/components/datetime/test/labels/main.html
index 7969093fd6..a19346dc72 100644
--- a/src/components/datetime/test/labels/main.html
+++ b/src/components/datetime/test/labels/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Datetime</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Datetime</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
 
diff --git a/src/components/grid/test/alignment/main.html b/src/components/grid/test/alignment/main.html
index 65ed491976..8f09667a9e 100644
--- a/src/components/grid/test/alignment/main.html
+++ b/src/components/grid/test/alignment/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Grid Alignment</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Grid Alignment</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="alignment-demo">
   <ion-row>
diff --git a/src/components/grid/test/basic/main.html b/src/components/grid/test/basic/main.html
index f7b9f8f113..a08cf3adfd 100644
--- a/src/components/grid/test/basic/main.html
+++ b/src/components/grid/test/basic/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Grid</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Grid</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="grid-demo">
   <ion-grid>
diff --git a/src/components/grid/test/full/main.html b/src/components/grid/test/full/main.html
index 6a62ae4fc7..c164b5a5c6 100644
--- a/src/components/grid/test/full/main.html
+++ b/src/components/grid/test/full/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Grid</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Grid</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="grid-full">
 
diff --git a/src/components/icon/test/basic/main.html b/src/components/icon/test/basic/main.html
index 500ec72f9e..f224032da3 100644
--- a/src/components/icon/test/basic/main.html
+++ b/src/components/icon/test/basic/main.html
@@ -1,7 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Icons</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Icons</ion-title>
-</ion-toolbar>
 
 <ion-content>
 
@@ -87,6 +91,7 @@
 
 </ion-content>
 
+
 <style>
   /*to ensure ng css encapsulation doesn't mess with icon attributes*/
   code {
diff --git a/src/components/infinite-scroll/test/basic/main.html b/src/components/infinite-scroll/test/basic/main.html
index 374b6d26eb..accb08eb4b 100644
--- a/src/components/infinite-scroll/test/basic/main.html
+++ b/src/components/infinite-scroll/test/basic/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Infinite Scroll</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Infinite Scroll</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
 
diff --git a/src/components/infinite-scroll/test/short-list/main.html b/src/components/infinite-scroll/test/short-list/main.html
index 9a33fe0ccd..9b5be159d8 100644
--- a/src/components/infinite-scroll/test/short-list/main.html
+++ b/src/components/infinite-scroll/test/short-list/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Infinite Scroll</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Infinite Scroll</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
 
diff --git a/src/components/input/test/clear-input/main.html b/src/components/input/test/clear-input/main.html
index 5569b943ea..643578f437 100644
--- a/src/components/input/test/clear-input/main.html
+++ b/src/components/input/test/clear-input/main.html
@@ -1,12 +1,14 @@
+<ion-header>
 
-<ion-toolbar>
-  <ion-title>Clear Input</ion-title>
-</ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Clear Input</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content>
 
-
   <ion-list>
 
     <ion-item>
@@ -14,7 +16,6 @@
       <ion-input class="e2eClearInput" [(ngModel)]="myValue" clearInput></ion-input>
     </ion-item>
 
-
   </ion-list>
 
 </ion-content>
diff --git a/src/components/input/test/fixed-inline-labels/main.html b/src/components/input/test/fixed-inline-labels/main.html
index 42f0b05976..be395af4ca 100644
--- a/src/components/input/test/fixed-inline-labels/main.html
+++ b/src/components/input/test/fixed-inline-labels/main.html
@@ -1,7 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Fixed Inline Label Text Input</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Fixed Inline Label Text Input</ion-title>
-</ion-toolbar>
 
 <ion-content>
 
diff --git a/src/components/input/test/floating-labels/main.html b/src/components/input/test/floating-labels/main.html
index f0f143c3ca..e7231f7ec1 100644
--- a/src/components/input/test/floating-labels/main.html
+++ b/src/components/input/test/floating-labels/main.html
@@ -1,8 +1,14 @@
+<ion-header>
 
-<ion-toolbar><ion-title>Floating Label Text Input</ion-title></ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Floating Label Text Input</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content>
+
   <ion-list>
 
     <ion-item>
@@ -76,6 +82,7 @@
 
 </ion-content>
 
+
 <style>
   img {
     height: 100px;
diff --git a/src/components/input/test/form-inputs/main.html b/src/components/input/test/form-inputs/main.html
index fd2ed0da7a..833e4441c7 100644
--- a/src/components/input/test/form-inputs/main.html
+++ b/src/components/input/test/form-inputs/main.html
@@ -1,5 +1,10 @@
+<ion-header>
 
-<ion-toolbar><ion-title>Form Inputs</ion-title></ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Form Inputs</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content>
diff --git a/src/components/input/test/inline-labels/main.html b/src/components/input/test/inline-labels/main.html
index dc63ee9a65..18031ebeb1 100644
--- a/src/components/input/test/inline-labels/main.html
+++ b/src/components/input/test/inline-labels/main.html
@@ -1,5 +1,10 @@
+<ion-header>
 
-<ion-toolbar><ion-title>Inline Label Text Input</ion-title></ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Inline Label Text Input</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content>
diff --git a/src/components/input/test/input-focus/main.html b/src/components/input/test/input-focus/main.html
index eec04a4966..5c250b857a 100644
--- a/src/components/input/test/input-focus/main.html
+++ b/src/components/input/test/input-focus/main.html
@@ -1,12 +1,15 @@
+<ion-header>
 
-<ion-toolbar primary>
-  <ion-title>Inset Focus</ion-title>
-  <ion-buttons end>
-    <button (click)="reload()">
-      Reload
-    </button>
-  </ion-buttons>
-</ion-toolbar>
+  <ion-toolbar primary>
+    <ion-title>Inset Focus</ion-title>
+    <ion-buttons end>
+      <button (click)="reload()">
+        Reload
+      </button>
+    </ion-buttons>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content>
@@ -179,5 +182,4 @@
 
   </ion-list>
 
-
 </ion-content>
diff --git a/src/components/input/test/inset-inputs/main.html b/src/components/input/test/inset-inputs/main.html
index 5519aa65b8..cce8b236bb 100644
--- a/src/components/input/test/inset-inputs/main.html
+++ b/src/components/input/test/inset-inputs/main.html
@@ -1,12 +1,14 @@
+<ion-header>
 
-<ion-toolbar>
-  <ion-title>Inset Inputs</ion-title>
-</ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Inset Inputs</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content class="outer-content">
 
-
   <ion-list inset>
 
     <ion-item>
@@ -67,5 +69,4 @@
 
   </ion-card>
 
-
 </ion-content>
diff --git a/src/components/input/test/placeholder-labels/main.html b/src/components/input/test/placeholder-labels/main.html
index 6e88fad731..7b502191b8 100644
--- a/src/components/input/test/placeholder-labels/main.html
+++ b/src/components/input/test/placeholder-labels/main.html
@@ -1,7 +1,10 @@
+<ion-header>
 
-<ion-toolbar>
-  <ion-title>Placeholder Label Text Input</ion-title>
-</ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Placeholder Label Text Input</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content class="outer-content">
diff --git a/src/components/input/test/stacked-labels/main.html b/src/components/input/test/stacked-labels/main.html
index c960e74cbd..8535387bef 100644
--- a/src/components/input/test/stacked-labels/main.html
+++ b/src/components/input/test/stacked-labels/main.html
@@ -1,7 +1,11 @@
 
-<ion-toolbar>
-  <ion-title>Stacked Label Text Input</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Stacked Label Text Input</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content>
diff --git a/src/components/item/test/buttons/main.html b/src/components/item/test/buttons/main.html
index 257205a49d..05fa6e4adb 100644
--- a/src/components/item/test/buttons/main.html
+++ b/src/components/item/test/buttons/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Items as Links/Buttons</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Items as Links/Buttons</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
 
@@ -98,6 +105,7 @@
 
 </ion-content>
 
+
 <style>
   img {
     height: 100px;
diff --git a/src/components/item/test/dividers/main.html b/src/components/item/test/dividers/main.html
index b1a6e1f93b..da64808632 100644
--- a/src/components/item/test/dividers/main.html
+++ b/src/components/item/test/dividers/main.html
@@ -1,6 +1,14 @@
-<ion-toolbar><ion-title>Item Divider</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Item Divider</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
+
   <ion-item-group>
     <ion-item>
       Plain Ol' div with some text
diff --git a/src/components/item/test/groups/index.ts b/src/components/item/test/groups/index.ts
index 8bdccb9a53..602d692cd5 100644
--- a/src/components/item/test/groups/index.ts
+++ b/src/components/item/test/groups/index.ts
@@ -4,9 +4,11 @@ import {ionicBootstrap, NavController, NavParams} from '../../../../../src';
 
 @Component({
   template: `
-    <ion-navbar *navbar>
-      <ion-title>{{session.name}}</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar>
+        <ion-title>{{session.name}}</ion-title>
+      </ion-navbar>
+    </ion-header>
     <ion-content padding>
       <p>{{session.description}}</p>
       <p><button (click)="nav.pop()">Go Back</button></p>
@@ -14,7 +16,7 @@ import {ionicBootstrap, NavController, NavParams} from '../../../../../src';
   `
 })
 class SessionDetail {
-  session;
+  session: any;
 
   constructor(params: NavParams, public nav: NavController) {
     this.session = params.data;
@@ -30,11 +32,11 @@ class SessionList {
 
   constructor(public nav: NavController) {}
 
-  addFavorite(timeSlot, session, slidingItem) {
+  addFavorite(timeSlot: any, session: any, slidingItem: any) {
     console.error("addFavorite", timeSlot, session, slidingItem);
   }
 
-  openSession(session) {
+  openSession(session: any) {
     this.nav.push(SessionDetail, session);
   }
 
diff --git a/src/components/item/test/groups/session-list.html b/src/components/item/test/groups/session-list.html
index 19c51ff038..776f1ef0b3 100644
--- a/src/components/item/test/groups/session-list.html
+++ b/src/components/item/test/groups/session-list.html
@@ -1,9 +1,14 @@
-<ion-navbar *navbar>
-  <ion-title>Item Groups</ion-title>
-  <ion-buttons end>
-    <button (click)="reload()">Reload</button>
-  </ion-buttons>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Item Groups</ion-title>
+    <ion-buttons end>
+      <button (click)="reload()">Reload</button>
+    </ion-buttons>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
 
diff --git a/src/components/item/test/icons/main.html b/src/components/item/test/icons/main.html
index 7eec48af15..3d1d5a5459 100644
--- a/src/components/item/test/icons/main.html
+++ b/src/components/item/test/icons/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Item Icons</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Item Icons</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
 
diff --git a/src/components/item/test/images/main.html b/src/components/item/test/images/main.html
index c520540a90..661d9a5deb 100644
--- a/src/components/item/test/images/main.html
+++ b/src/components/item/test/images/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Item Images</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Item Images</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
 
@@ -60,6 +67,7 @@
 
 </ion-content>
 
+
 <style>
   img {
     height: 100px;
diff --git a/src/components/item/test/media/main.html b/src/components/item/test/media/main.html
index 1ed195fa61..6709ebf3bb 100644
--- a/src/components/item/test/media/main.html
+++ b/src/components/item/test/media/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Item Media</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Item Media</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
 
@@ -61,6 +68,7 @@
 
 </ion-content>
 
+
 <style>
   img {
     height: 100px;
diff --git a/src/components/item/test/sliding/main.html b/src/components/item/test/sliding/main.html
index 667cd3f02f..41e3551c02 100644
--- a/src/components/item/test/sliding/main.html
+++ b/src/components/item/test/sliding/main.html
@@ -1,17 +1,23 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Sliding Items</ion-title>
+    <ion-buttons end>
+      <button (click)="reload()">Reload</button>
+    </ion-buttons>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Sliding Items</ion-title>
-  <ion-buttons end>
-    <button (click)="reload()">Reload</button>
-  </ion-buttons>
-</ion-toolbar>
 
 <ion-content>
+
   <div padding>
     <button block (click)="toggleSliding()">Toggle sliding</button>
     <button block (click)="changeDynamic()">Change Dynamic Options</button>
     <button block (click)="closeOpened()">Close Opened Items</button>
   </div>
+
   <ion-list #myList>
 
     <ion-item-sliding #item100>
@@ -229,6 +235,7 @@
 
 </ion-content>
 
+
 <style>
   img {
     height: 100px;
diff --git a/src/components/item/test/text/main.html b/src/components/item/test/text/main.html
index 02f070d110..ea90529af0 100644
--- a/src/components/item/test/text/main.html
+++ b/src/components/item/test/text/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Item Text</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Item Text</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
 
diff --git a/src/components/list/test/headers/main.html b/src/components/list/test/headers/main.html
index c6da5a8d4b..67465dac26 100644
--- a/src/components/list/test/headers/main.html
+++ b/src/components/list/test/headers/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>List Headers</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>List Headers</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
 
diff --git a/src/components/list/test/inset/main.html b/src/components/list/test/inset/main.html
index 0cae93c95e..5b4c06ada3 100644
--- a/src/components/list/test/inset/main.html
+++ b/src/components/list/test/inset/main.html
@@ -1,5 +1,10 @@
+<ion-header>
 
-<ion-toolbar><ion-title>Inset List</ion-title></ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Inset List</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content class="outer-content">
diff --git a/src/components/list/test/no-lines/main.html b/src/components/list/test/no-lines/main.html
index 1ad9e802fa..3950ef4f4c 100644
--- a/src/components/list/test/no-lines/main.html
+++ b/src/components/list/test/no-lines/main.html
@@ -1,6 +1,14 @@
-<ion-toolbar><ion-title>List No Lines</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>List No Lines</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
+
   <ion-list no-lines>
     <ion-list-header>
       List With No Lines
@@ -148,6 +156,7 @@
       </ion-note>
     </ion-item>
   </ion-list>
+
 </ion-content>
 
 <style>
diff --git a/src/components/list/test/repeat-headers/main.html b/src/components/list/test/repeat-headers/main.html
index 98658682b6..cf7b135d4c 100644
--- a/src/components/list/test/repeat-headers/main.html
+++ b/src/components/list/test/repeat-headers/main.html
@@ -1,7 +1,14 @@
-<ion-toolbar><ion-title>List Headers Borders</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>List Headers Borders</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
-  
+
   <ion-list class="outer-content" *ngFor="let person of people">
     <ion-list-header>
       {{person.name}}
@@ -13,4 +20,5 @@
       </div>
     </ion-item>
   </ion-list>
+
 </ion-content>
diff --git a/src/components/loading/test/basic/index.ts b/src/components/loading/test/basic/index.ts
index 6d572d4982..b960c87fc0 100644
--- a/src/components/loading/test/basic/index.ts
+++ b/src/components/loading/test/basic/index.ts
@@ -188,18 +188,22 @@ class E2EPage {
 
 @Component({
   template: `
-    <ion-navbar *navbar>
-      <ion-title>Page 2</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar>
+        <ion-title>Page 2</ion-title>
+      </ion-navbar>
+    </ion-header>
     <ion-content padding>Some content</ion-content>
-    <ion-toolbar position="bottom">
-      <ion-buttons end>
-        <button (click)="goToPage3()">
-          Navigate
-          <ion-icon name="arrow-forward"></ion-icon>
-        </button>
-      </ion-buttons>
-    </ion-toolbar>
+    <ion-footer>
+      <ion-toolbar>
+        <ion-buttons end>
+          <button (click)="goToPage3()">
+            Navigate
+            <ion-icon name="arrow-forward"></ion-icon>
+          </button>
+        </ion-buttons>
+      </ion-toolbar>
+    </ion-footer>
   `
 })
 class Page2 {
@@ -218,9 +222,11 @@ class Page2 {
 
 @Component({
   template: `
-    <ion-navbar *navbar>
-      <ion-title>Page 3</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar>
+        <ion-title>Page 3</ion-title>
+      </ion-navbar>
+    </ion-header>
     <ion-content padding>Some content</ion-content>
   `
 })
diff --git a/src/components/loading/test/basic/main.html b/src/components/loading/test/basic/main.html
index a25d3819b9..4ef49cec5f 100644
--- a/src/components/loading/test/basic/main.html
+++ b/src/components/loading/test/basic/main.html
@@ -1,9 +1,14 @@
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Loading</ion-title>
+  </ion-navbar>
+
+</ion-header>
 
-<ion-navbar *navbar>
-  <ion-title>Loading</ion-title>
-</ion-navbar>
 
 <ion-content padding>
+
   <button block (click)="presentLoadingIos()">iOS Spinner</button>
   <button block (click)="presentLoadingDots()">Dots Spinner</button>
   <button block (click)="presentLoadingBubbles()">Bubbles Spinner</button>
@@ -14,13 +19,19 @@
   <button block (click)="presentLoadingText()" dark>Content Only w/ Nav</button>
   <button block (click)="presentLoadingMultiple()" danger>Multiple Loading</button>
   <button block (click)="presentLoadingMultipleNav()" danger>Multiple Nav Loading</button>
+
 </ion-content>
 
-<ion-toolbar position="bottom">
-  <ion-buttons end>
-    <button (click)="goToPage2()">
-      Navigate
-      <ion-icon name="arrow-forward"></ion-icon>
-    </button>
-  </ion-buttons>
-</ion-toolbar>
+
+<ion-footer>
+
+  <ion-toolbar>
+    <ion-buttons end>
+      <button (click)="goToPage2()">
+        Navigate
+        <ion-icon name="arrow-forward"></ion-icon>
+      </button>
+    </ion-buttons>
+  </ion-toolbar>
+
+</ion-footer>
\ No newline at end of file
diff --git a/src/components/loading/test/tabs/index.ts b/src/components/loading/test/tabs/index.ts
index 37fe6bf977..208ebf8543 100644
--- a/src/components/loading/test/tabs/index.ts
+++ b/src/components/loading/test/tabs/index.ts
@@ -38,9 +38,11 @@ class E2EPage {
 
 @Component({
   template: `
-    <ion-navbar *navbar>
-      <ion-title>Page 2</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar>
+        <ion-title>Page 2</ion-title>
+      </ion-navbar>
+    </ion-header>
     <ion-content padding>Some content</ion-content>
   `
 })
diff --git a/src/components/loading/test/tabs/main.html b/src/components/loading/test/tabs/main.html
index 6af84ba287..608ddf7b50 100644
--- a/src/components/loading/test/tabs/main.html
+++ b/src/components/loading/test/tabs/main.html
@@ -1,9 +1,15 @@
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Loading</ion-title>
+  </ion-navbar>
+
+</ion-header>
 
-<ion-navbar *navbar>
-  <ion-title>Loading</ion-title>
-</ion-navbar>
 
 <ion-content padding>
+
   <button block (click)="presentLoading()" class="e2eLoadingTabsContent">Loading Content</button>
   <button block (click)="presentLoadingNav()">Loading w/ Nav</button>
+
 </ion-content>
diff --git a/src/components/menu/test/basic/page1.html b/src/components/menu/test/basic/page1.html
index c16a487e4d..036d3d4b6a 100644
--- a/src/components/menu/test/basic/page1.html
+++ b/src/components/menu/test/basic/page1.html
@@ -1,31 +1,34 @@
+<ion-header>
 
-<ion-navbar *navbar>
+  <ion-navbar>
 
-  <button menuToggle="left">
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-  <ion-title>
-    Menu
-  </ion-title>
-
-  <ion-buttons end>
-    <button>
-      <ion-icon name="football"></ion-icon>
+    <button menuToggle="left">
+      <ion-icon name="menu"></ion-icon>
     </button>
-  </ion-buttons>
 
-  <ion-buttons start>
-    <button>
-      <ion-icon name="baseball"></ion-icon>
+    <ion-title>
+      Menu
+    </ion-title>
+
+    <ion-buttons end>
+      <button>
+        <ion-icon name="football"></ion-icon>
+      </button>
+    </ion-buttons>
+
+    <ion-buttons start>
+      <button>
+        <ion-icon name="baseball"></ion-icon>
+      </button>
+    </ion-buttons>
+
+    <button menuToggle="right" right secondary>
+      <ion-icon name="menu"></ion-icon>
     </button>
-  </ion-buttons>
 
-  <button menuToggle="right" right secondary>
-    <ion-icon name="menu"></ion-icon>
-  </button>
+  </ion-navbar>
 
-</ion-navbar>
+</ion-header>
 
 
 <ion-content padding>
diff --git a/src/components/menu/test/basic/page2.html b/src/components/menu/test/basic/page2.html
index 6229f3150f..8c24b208ad 100644
--- a/src/components/menu/test/basic/page2.html
+++ b/src/components/menu/test/basic/page2.html
@@ -1,15 +1,19 @@
+<ion-header>
 
-<ion-navbar *navbar>
+  <ion-navbar>
 
-  <button menuToggle>
-    <ion-icon name="menu"></ion-icon>
-  </button>
+    <button menuToggle>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+
+    <ion-title>
+      Menu
+    </ion-title>
+
+  </ion-navbar>
+</ion-header>
 
-  <ion-title>
-    Menu
-  </ion-title>
 
-</ion-navbar>
 
 <ion-content padding>
 
diff --git a/src/components/menu/test/basic/page3.html b/src/components/menu/test/basic/page3.html
index e05fc4807b..ecb7fe5aa2 100644
--- a/src/components/menu/test/basic/page3.html
+++ b/src/components/menu/test/basic/page3.html
@@ -1,19 +1,18 @@
+<ion-header>
 
-<ion-navbar *navbar>
+  <ion-navbar>
+    <button menuToggle="left">
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>
+      Menu
+    </ion-title>
+    <button menuToggle="right" right>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-navbar>
 
-  <button menuToggle="left">
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-  <ion-title>
-    Menu
-  </ion-title>
-
-  <button menuToggle="right" right>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-</ion-navbar>
+</ion-header>
 
 
 <ion-content padding>
diff --git a/src/components/menu/test/disable-swipe/page1.html b/src/components/menu/test/disable-swipe/page1.html
index f6eb53faea..19ed542a18 100644
--- a/src/components/menu/test/disable-swipe/page1.html
+++ b/src/components/menu/test/disable-swipe/page1.html
@@ -1,18 +1,18 @@
-<ion-navbar *navbar>
+<ion-header>
 
-  <button menuToggle="left">
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-  <ion-title>
-    Main
-  </ion-title>
-
-  <button menuToggle="right" right secondary>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-</ion-navbar>
+  <ion-navbar>
+    <button menuToggle="left">
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>
+      Main
+    </ion-title>
+    <button menuToggle="right" right secondary>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-navbar>
 
+</ion-header>
 
 <ion-content padding>
 
diff --git a/src/components/menu/test/enable-disable/main.html b/src/components/menu/test/enable-disable/main.html
index 7f75954b2f..e2dc36b16e 100644
--- a/src/components/menu/test/enable-disable/main.html
+++ b/src/components/menu/test/enable-disable/main.html
@@ -1,4 +1,3 @@
-
 <ion-menu [content]="content" id="menu1">
 
   <ion-toolbar secondary>
diff --git a/src/components/menu/test/enable-disable/page1.html b/src/components/menu/test/enable-disable/page1.html
index 2192d0834d..2e629d9ec4 100644
--- a/src/components/menu/test/enable-disable/page1.html
+++ b/src/components/menu/test/enable-disable/page1.html
@@ -1,15 +1,19 @@
+<ion-header>
 
-<ion-navbar *navbar>
-  <button menuToggle="left">
-    <ion-icon name="menu"></ion-icon>
-  </button>
-  <ion-title>
-    Multiple Menus
-  </ion-title>
-</ion-navbar>
+  <ion-navbar>
+    <button menuToggle="left">
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>
+      Multiple Menus
+    </ion-title>
+  </ion-navbar>
+
+</ion-header>
 
 
 <ion-content padding>
+
   <h3> Page 1 </h3>
 
   <p>
diff --git a/src/components/menu/test/enable-disable/page2.html b/src/components/menu/test/enable-disable/page2.html
index a5841a3b32..096e330b07 100644
--- a/src/components/menu/test/enable-disable/page2.html
+++ b/src/components/menu/test/enable-disable/page2.html
@@ -1,15 +1,19 @@
+<ion-header>
 
-<ion-navbar *navbar>
-  <button menuToggle="left">
-    <ion-icon name="menu"></ion-icon>
-  </button>
-  <ion-title>
-    Multiple Menus
-  </ion-title>
-</ion-navbar>
+  <ion-navbar>
+    <button menuToggle="left">
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>
+      Multiple Menus
+    </ion-title>
+  </ion-navbar>
+
+</ion-header>
 
 
 <ion-content padding>
+
   <h3> Page 2 </h3>
 
   <p>
diff --git a/src/components/menu/test/multiple/main.html b/src/components/menu/test/multiple/main.html
index 3bc84f9324..9e96374286 100644
--- a/src/components/menu/test/multiple/main.html
+++ b/src/components/menu/test/multiple/main.html
@@ -1,4 +1,3 @@
-
 <ion-menu [content]="content" id="menu1">
 
   <ion-toolbar secondary>
diff --git a/src/components/menu/test/multiple/page1.html b/src/components/menu/test/multiple/page1.html
index 5ff31d7284..6b5c3edb82 100644
--- a/src/components/menu/test/multiple/page1.html
+++ b/src/components/menu/test/multiple/page1.html
@@ -1,12 +1,15 @@
+<ion-header>
 
-<ion-navbar *navbar>
-  <button menuToggle>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-  <ion-title>
-    Multiple Menus
-  </ion-title>
-</ion-navbar>
+  <ion-navbar>
+    <button menuToggle>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>
+      Multiple Menus
+    </ion-title>
+  </ion-navbar>
+
+</ion-header>
 
 
 <ion-content padding>
diff --git a/src/components/menu/test/overlay/page1.html b/src/components/menu/test/overlay/page1.html
index afc699f245..8956609498 100644
--- a/src/components/menu/test/overlay/page1.html
+++ b/src/components/menu/test/overlay/page1.html
@@ -1,19 +1,18 @@
+<ion-header>
 
-<ion-navbar *navbar>
+  <ion-navbar>
+    <button menuToggle="myMenuId">
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>
+      Overlay Menu
+    </ion-title>
+    <button menuToggle="myMenuId2" end>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-navbar>
 
-  <button menuToggle="myMenuId">
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-  <ion-title>
-    Overlay Menu
-  </ion-title>
-
-  <button menuToggle="myMenuId2" end>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-</ion-navbar>
+</ion-header>
 
 
 <ion-content #content padding>
diff --git a/src/components/menu/test/push/page1.html b/src/components/menu/test/push/page1.html
index 39a52bc31b..308e0b3e0e 100644
--- a/src/components/menu/test/push/page1.html
+++ b/src/components/menu/test/push/page1.html
@@ -1,19 +1,18 @@
+<ion-header>
 
-<ion-navbar *navbar>
+  <ion-navbar>
+    <button menuToggle="left">
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>
+      Push Menu
+    </ion-title>
+    <button menuToggle="right" end>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-navbar>
 
-  <button menuToggle="left">
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-  <ion-title>
-    Push Menu
-  </ion-title>
-
-  <button menuToggle="right" end>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-</ion-navbar>
+</ion-header>
 
 
 <ion-content #content padding>
diff --git a/src/components/menu/test/reveal/page1.html b/src/components/menu/test/reveal/page1.html
index 0d40c3bbe1..73d5f8bcb3 100644
--- a/src/components/menu/test/reveal/page1.html
+++ b/src/components/menu/test/reveal/page1.html
@@ -1,19 +1,18 @@
+<ion-header>
 
-<ion-navbar *navbar>
+  <ion-navbar>
+    <button menuToggle>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>
+      Reveal Menu
+    </ion-title>
+    <button menuToggle="right" end>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-navbar>
 
-  <button menuToggle>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-  <ion-title>
-    Reveal Menu
-  </ion-title>
-
-  <button menuToggle="right" end>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-</ion-navbar>
+</ion-header>
 
 
 <ion-content #content padding>
diff --git a/src/components/modal/test/basic/main.html b/src/components/modal/test/basic/main.html
index 4bc0b61eb0..dc1b62252e 100644
--- a/src/components/modal/test/basic/main.html
+++ b/src/components/modal/test/basic/main.html
@@ -1,10 +1,14 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Modals</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <p>
     <button (click)="presentModal()">Present modal, pass params</button>
   </p>
@@ -26,4 +30,5 @@
   <p>
     {{platforms | json}}
   </p>
+
 </ion-content>
diff --git a/src/components/nav/test/child-navs/index.ts b/src/components/nav/test/child-navs/index.ts
index e6c7376a13..ae12253bbb 100644
--- a/src/components/nav/test/child-navs/index.ts
+++ b/src/components/nav/test/child-navs/index.ts
@@ -12,13 +12,15 @@ ionicBootstrap(E2EApp);
 
 @Component({
   template: `
-  <ion-navbar *navbar>
-    <ion-title>
-      Landing Page Comp
-    </ion-title>
-  </ion-navbar>
+  <ion-header>
+    <ion-navbar>
+      <ion-title>
+        Landing Page Comp
+      </ion-title>
+    </ion-navbar>
+  </ion-header>
 
-  <ion-content class="home">
+  <ion-content>
     <button primary (click)="goToPage()" class="nested-children-test">
       Nested Children Test
     </button>
@@ -37,13 +39,15 @@ class LandingPage{
 
 @Component({
   template: `
-  <ion-navbar *navbar>
-    <ion-title>
-      First Page Comp
-    </ion-title>
-  </ion-navbar>
+  <ion-header>
+    <ion-navbar>
+      <ion-title>
+        First Page Comp
+      </ion-title>
+    </ion-navbar>
+  </ion-header>
 
-  <ion-content class="home">
+  <ion-content>
     <h3>Sub Header First Page</h3>
     <ion-nav [root]="root"></ion-nav>
   </ion-content>
@@ -55,13 +59,15 @@ class FirstPage{
 
 @Component({
   template: `
-  <ion-navbar *navbar>
-    <ion-title>
-      Second Page Comp
-    </ion-title>
-  </ion-navbar>
+  <ion-header>
+    <ion-navbar>
+      <ion-title>
+        Second Page Comp
+      </ion-title>
+    </ion-navbar>
+  </ion-header>
 
-  <ion-content class="home">
+  <ion-content>
     <h3>Sub Header Second Page</h3>
     <ion-nav [root]="root"></ion-nav>
   </ion-content>
@@ -73,13 +79,15 @@ class SecondPage{
 
 @Component({
   template: `
-  <ion-navbar *navbar>
-    <ion-title>
-      Third Page Comp
-    </ion-title>
-  </ion-navbar>
+  <ion-header>
+    <ion-navbar>
+      <ion-title>
+        Third Page Comp
+      </ion-title>
+    </ion-navbar>
+  </ion-header>
 
-  <ion-content class="home">
+  <ion-content>
     <h3>Sub Header Third Page</h3>
     <ion-nav [root]="root"></ion-nav>
   </ion-content>
diff --git a/src/components/nav/test/insert-views/index.ts b/src/components/nav/test/insert-views/index.ts
index 17c80cce7b..e2a85e4c04 100644
--- a/src/components/nav/test/insert-views/index.ts
+++ b/src/components/nav/test/insert-views/index.ts
@@ -4,12 +4,14 @@ import {ionicBootstrap, NavController} from '../../../../../src';
 
 @Component({
   template: `
-    <ion-navbar *navbar>
-      <ion-title>Root</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar>
+        <ion-title>Root</ion-title>
+      </ion-navbar>
+    </ion-header>
 
     <ion-content padding>
-    <button block (click)="pushPage()">Push Page</button>
+      <button block (click)="pushPage()">Push Page</button>
     </ion-content>`,
 })
 class FirstPage {
@@ -23,13 +25,15 @@ class FirstPage {
 
 @Component({
   template: `
-    <ion-navbar *navbar>
-      <ion-title>Root</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar>
+        <ion-title>Root</ion-title>
+      </ion-navbar>
+    </ion-header>
 
     <ion-content padding>
       <h1>Second page</h1>
-    <button block (click)="insertPage()">Insert Page</button>
+      <button block (click)="insertPage()">Insert Page</button>
     </ion-content>
   `
 })
@@ -44,9 +48,11 @@ class SecondPage {
 
 @Component({
   template: `
-    <ion-navbar *navbar>
-      <ion-title>Inserted Paged</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar>
+        <ion-title>Inserted Paged</ion-title>
+      </ion-navbar>
+    </ion-header>
     <ion-content padding>
       Inserted Page
     </ion-content>
diff --git a/src/components/nav/test/nested/index.ts b/src/components/nav/test/nested/index.ts
index 663d120ac4..e25a027eba 100644
--- a/src/components/nav/test/nested/index.ts
+++ b/src/components/nav/test/nested/index.ts
@@ -5,9 +5,11 @@ import {Config, Nav, App} from '../../../../../src';
 
 @Component({
   template: `
-    <ion-navbar *navbar>
-      <ion-title>Login</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar>
+        <ion-title>Login</ion-title>
+      </ion-navbar>
+    </ion-header>
     <ion-content style="text-align:center;" padding>
       <p><button (click)="goToAccount()">Login</button></p>
       <p><button (click)="goBack()">App goBack()</button></p>
@@ -87,12 +89,14 @@ export class Account {
 
 @Component({
   template: `
-    <ion-navbar *navbar primary>
-      <button menuToggle>
-        <ion-icon name="menu"></ion-icon>
-      </button>
-      <ion-title>Account Dashboard</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar primary>
+        <button menuToggle>
+          <ion-icon name="menu"></ion-icon>
+        </button>
+        <ion-title>Account Dashboard</ion-title>
+      </ion-navbar>
+    </ion-header>
     <ion-content padding>
       <p><button (click)="goToProfile()">Profile</button></p>
       <p><button (click)="logOut()">Logout</button></p>
@@ -122,12 +126,14 @@ export class Dashboard {
 
 @Component({
   template: `
-    <ion-navbar *navbar danger>
-      <button menuToggle>
-        <ion-icon name="menu"></ion-icon>
-      </button>
-      <ion-title>Account Profile</ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar danger>
+        <button menuToggle>
+          <ion-icon name="menu"></ion-icon>
+        </button>
+        <ion-title>Account Profile</ion-title>
+      </ion-navbar>
+    </ion-header>
     <ion-content padding>
       <p><button (click)="goToDashboard()">Dashboard</button></p>
       <p><button (click)="logOut()">Logout</button></p>
diff --git a/src/components/nav/test/routing/view1.html b/src/components/nav/test/routing/view1.html
index c1e93d4493..16ceb4588b 100644
--- a/src/components/nav/test/routing/view1.html
+++ b/src/components/nav/test/routing/view1.html
@@ -1,12 +1,17 @@
+<ion-header>
+
+  <ion-navbar>
+    <button menuToggle>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>First View</ion-title>
+  </ion-navbar>
+
+</ion-header>
 
-<ion-navbar *navbar>
-  <button menuToggle>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-  <ion-title>First View</ion-title>
-</ion-navbar>
 
 <ion-content padding>
+
   <h4>
     Window Hash: {{windowHash}}
   </h4>
@@ -22,4 +27,5 @@
   <p>
     <a href="#/3/151">Third View via href, 151 as id param</a>
   </p>
+
 </ion-content>
diff --git a/src/components/nav/test/routing/view2.html b/src/components/nav/test/routing/view2.html
index 32406a1ee5..ccf068da75 100644
--- a/src/components/nav/test/routing/view2.html
+++ b/src/components/nav/test/routing/view2.html
@@ -1,14 +1,19 @@
+<ion-header>
+
+  <ion-navbar primary>
+    <ion-title>Second View</ion-title>
+    <ion-buttons end>
+      <button>
+        <ion-icon name="help"></ion-icon>
+      </button>
+    </ion-buttons>
+  </ion-navbar>
+
+</ion-header>
 
-<ion-navbar *navbar primary>
-  <ion-title>Second View</ion-title>
-  <ion-buttons end>
-    <button>
-      <ion-icon name="help"></ion-icon>
-    </button>
-  </ion-buttons>
-</ion-navbar>
 
 <ion-content padding>
+
   <h4>
     Window Hash: {{windowHash}}
   </h4>
@@ -24,4 +29,5 @@
   <p>
     <a href="#/">First View via href</a>
   </p>
+
 </ion-content>
diff --git a/src/components/nav/test/routing/view3.html b/src/components/nav/test/routing/view3.html
index 99a0017846..935a5e8de2 100644
--- a/src/components/nav/test/routing/view3.html
+++ b/src/components/nav/test/routing/view3.html
@@ -1,9 +1,14 @@
+<ion-header>
+
+  <ion-navbar primary>
+    <ion-title>Third View</ion-title>
+  </ion-navbar>
+
+</ion-header>
 
-<ion-navbar *navbar primary>
-  <ion-title>Third View</ion-title>
-</ion-navbar>
 
 <ion-content padding>
+
   <h4>
     Window Hash: {{windowHash}}
   </h4>
@@ -22,4 +27,5 @@
   <p>
     <a href="#/">First View via href</a>
   </p>
+
 </ion-content>
diff --git a/src/components/picker/test/basic/main.html b/src/components/picker/test/basic/main.html
index fa80234cb4..f0b3648670 100644
--- a/src/components/picker/test/basic/main.html
+++ b/src/components/picker/test/basic/main.html
@@ -1,6 +1,11 @@
-<ion-navbar *navbar>
-  <ion-title>Picker</ion-title>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Picker</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content padding>
 
@@ -27,7 +32,3 @@
   </p>
 
 </ion-content>
-
-<style>
-
-</style>
\ No newline at end of file
diff --git a/src/components/popover/test/basic/main.html b/src/components/popover/test/basic/main.html
index 55361f5858..d031afd448 100644
--- a/src/components/popover/test/basic/main.html
+++ b/src/components/popover/test/basic/main.html
@@ -1,24 +1,30 @@
-<ion-navbar *navbar primary>
-  <ion-buttons left>
-    <button (click)="presentRadioPopover($event)">
-      <ion-icon name="person"></ion-icon>
-    </button>
-    <button (click)="presentLongListPopover($event)">
-      <ion-icon name="search"></ion-icon>
-    </button>
-  </ion-buttons>
-  <ion-title>Popover</ion-title>
-  <ion-buttons end>
-    <button (click)="presentListPopover($event)">
-      <ion-icon name="options"></ion-icon>
-    </button>
-    <button (click)="presentRadioPopover($event)">
-      <ion-icon name="more"></ion-icon>
-    </button>
-  </ion-buttons>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar primary>
+    <ion-buttons left>
+      <button (click)="presentRadioPopover($event)">
+        <ion-icon name="person"></ion-icon>
+      </button>
+      <button (click)="presentLongListPopover($event)">
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-title>Popover</ion-title>
+    <ion-buttons end>
+      <button (click)="presentListPopover($event)">
+        <ion-icon name="options"></ion-icon>
+      </button>
+      <button (click)="presentRadioPopover($event)">
+        <ion-icon name="more"></ion-icon>
+      </button>
+    </ion-buttons>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content #popoverContent>
+
   <ion-list>
     <button ion-item (click)="presentListPopover($event)" class="e2eOpenListPopover">
       Present List Popover
@@ -55,16 +61,22 @@
 
     <div>Aenean rhoncus urna at interdum blandit. Donec ac massa nec libero vehicula tincidunt. Sed sit amet hendrerit risus. Aliquam vitae vestibulum ipsum, non feugiat orci. Vivamus eu rutrum elit. Nulla dapibus tortor non dignissim pretium. Nulla in luctus turpis. Etiam non mattis tortor, at aliquet ex. Nunc ut ante varius, auctor dui vel, volutpat elit. Nunc laoreet augue sit amet ultrices porta. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vestibulum pellentesque lobortis est, ut tincidunt ligula mollis sit amet. In porta risus arcu, quis pellentesque dolor mattis non. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;</div>
   </div>
+
 </ion-content>
 
-<ion-toolbar position="bottom">
-  <ion-title>Popover</ion-title>
-  <ion-buttons start>
-    <button (click)="presentListPopover($event)">
-      <ion-icon name="more"></ion-icon>
-    </button>
-    <button (click)="presentLongListPopover($event)">
-      <ion-icon name="search"></ion-icon>
-    </button>
-  </ion-buttons>
-</ion-toolbar>
+
+<ion-footer>
+
+  <ion-toolbar>
+    <ion-title>Popover</ion-title>
+    <ion-buttons start>
+      <button (click)="presentListPopover($event)">
+        <ion-icon name="more"></ion-icon>
+      </button>
+      <button (click)="presentLongListPopover($event)">
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+  </ion-toolbar>
+
+</ion-footer>
diff --git a/src/components/radio/test/basic/main.html b/src/components/radio/test/basic/main.html
index 4c4c9681a7..007d1bc22a 100644
--- a/src/components/radio/test/basic/main.html
+++ b/src/components/radio/test/basic/main.html
@@ -1,7 +1,11 @@
 
-<ion-toolbar>
-  <ion-title>Radio Group</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Radio Group</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content>
diff --git a/src/components/range/test/basic/page1.html b/src/components/range/test/basic/page1.html
index ace0d3ada0..dcc8dec1a0 100644
--- a/src/components/range/test/basic/page1.html
+++ b/src/components/range/test/basic/page1.html
@@ -1,18 +1,18 @@
-<ion-navbar *navbar>
+<ion-header>
 
-  <button menuToggle="left">
-    <ion-icon name="menu"></ion-icon>
-  </button>
+  <ion-navbar>
+    <button menuToggle="left">
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>
+      Range
+    </ion-title>
+    <button menuToggle="right" right>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+  </ion-navbar>
 
-  <ion-title>
-    Range
-  </ion-title>
-
-  <button menuToggle="right" right>
-    <ion-icon name="menu"></ion-icon>
-  </button>
-
-</ion-navbar>
+</ion-header>
 
 
 <ion-content>
diff --git a/src/components/refresher/test/basic/main.html b/src/components/refresher/test/basic/main.html
index 1e8ded6a6d..6b44c4231a 100644
--- a/src/components/refresher/test/basic/main.html
+++ b/src/components/refresher/test/basic/main.html
@@ -1,4 +1,11 @@
-<ion-toolbar><ion-title>Pull To Refresh</ion-title></ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Pull To Refresh</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
 
diff --git a/src/components/scroll/test/basic/main.html b/src/components/scroll/test/basic/main.html
index 3637a85aae..1fcccb8b5a 100644
--- a/src/components/scroll/test/basic/main.html
+++ b/src/components/scroll/test/basic/main.html
@@ -1,26 +1,32 @@
-<!-- <ion-view nav-title="Pull to refresh"> -->
-  <ion-toolbar><ion-title>Scroll</ion-title></ion-toolbar>
+<ion-header>
 
-  <ion-content>
+  <ion-toolbar>
+    <ion-title>Scroll</ion-title>
+  </ion-toolbar>
 
-    <h2>Horizontal</h2>
-    <ion-scroll scroll-x="true" style="height: 200px">
-      <div style="height: 200px; width: 2500px; background: url('eight_horns.png') repeat"></div>
-    </ion-scroll>
+</ion-header>
 
-    <h2>Vertical</h2>
-    <ion-scroll scroll-y="true" style="width: 200px; height: 500px">
-      <div style="height: 2500px; width: 200px; background: url('eight_horns.png') repeat"></div>
-    </ion-scroll>
 
-    <h2>Both</h2>
-    <ion-scroll scroll-x="true" scroll-y="true" style="width: 100%; height: 500px">
-      <div style="height: 2500px; width: 2500px; background: url('eight_horns.png') repeat"></div>
-    </ion-scroll>
+<ion-content>
+
+  <h2>Horizontal</h2>
+  <ion-scroll scroll-x="true" style="height: 200px">
+    <div style="height: 200px; width: 2500px; background: url('eight_horns.png') repeat"></div>
+  </ion-scroll>
+
+  <h2>Vertical</h2>
+  <ion-scroll scroll-y="true" style="width: 200px; height: 500px">
+    <div style="height: 2500px; width: 200px; background: url('eight_horns.png') repeat"></div>
+  </ion-scroll>
+
+  <h2>Both</h2>
+  <ion-scroll scroll-x="true" scroll-y="true" style="width: 100%; height: 500px">
+    <div style="height: 2500px; width: 2500px; background: url('eight_horns.png') repeat"></div>
+  </ion-scroll>
+
+</ion-content>
 
-  </ion-content>
 
-<!-- </ion-view> -->
 <style>
   f { display: block; height: 400px; width: 100%; background-color: #387ef5; margin-bottom: 15px; }
   #counter {
diff --git a/src/components/searchbar/test/nav/detail.html b/src/components/searchbar/test/nav/detail.html
index ce4b4bed6f..4e1c92184c 100644
--- a/src/components/searchbar/test/nav/detail.html
+++ b/src/components/searchbar/test/nav/detail.html
@@ -1,7 +1,15 @@
-<ion-navbar *navbar>
-  <ion-title>Detail</ion-title>
-</ion-navbar>
+
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Detail</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content padding>
+
   <h1>City: {{city}}</h1>
+
 </ion-content>
diff --git a/src/components/searchbar/test/nav/main.html b/src/components/searchbar/test/nav/main.html
index a44f3c3861..d2eae7098a 100644
--- a/src/components/searchbar/test/nav/main.html
+++ b/src/components/searchbar/test/nav/main.html
@@ -1,7 +1,14 @@
-<ion-navbar *navbar>
-  <ion-title>First Page</ion-title>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>First Page</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content padding>
+
   <button block (click)="goToSecond()">Go to Searchbar Page</button>
+
 </ion-content>
diff --git a/src/components/searchbar/test/nav/search.html b/src/components/searchbar/test/nav/search.html
index 28290065d3..36fc981e3f 100644
--- a/src/components/searchbar/test/nav/search.html
+++ b/src/components/searchbar/test/nav/search.html
@@ -1,17 +1,25 @@
-<ion-navbar *navbar>
-  <ion-title>Searchbar</ion-title>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Searchbar</ion-title>
+  </ion-navbar>
+
+  <ion-toolbar>
+    <ion-searchbar primary (ionInput)="getItems($event)" placeholder="Filter Schedules">
+    </ion-searchbar>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-searchbar primary (ionInput)="getItems($event)" placeholder="Filter Schedules">
-  </ion-searchbar>
-</ion-toolbar>
 
 <ion-content>
+
   <ion-searchbar (ionInput)="getItems($event)"></ion-searchbar>
+
   <ion-list>
     <button ion-item *ngFor="let item of items" (click)="showDetail(item)" class="e2eSearchbarNavItem">
       {{ item }}
     </button>
   </ion-list>
+
 </ion-content>
diff --git a/src/components/searchbar/test/toolbar/main.html b/src/components/searchbar/test/toolbar/main.html
index 1ffcd78472..a564597ef9 100644
--- a/src/components/searchbar/test/toolbar/main.html
+++ b/src/components/searchbar/test/toolbar/main.html
@@ -1,8 +1,14 @@
-<ion-navbar *navbar>
-  <ion-title>Test</ion-title>
-</ion-navbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Test</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
 
 <ion-content>
+
   <h5 padding-left padding-top> Search - Default Toolbar </h5>
   <ion-toolbar>
     <ion-searchbar [(ngModel)]="defaultToolbarSearch"></ion-searchbar>
diff --git a/src/components/segment/test/basic/main.html b/src/components/segment/test/basic/main.html
index 2b8a616600..131bde130c 100644
--- a/src/components/segment/test/basic/main.html
+++ b/src/components/segment/test/basic/main.html
@@ -1,31 +1,37 @@
-<ion-toolbar>
-  <ion-segment id="segment" [(ngModel)]="relationship" (ionChange)="onSegmentChanged($event)">
-    <ion-segment-button value="friends" (ionSelect)="onSegmentSelected($event)" class="e2eSegmentFriends">
-      Friends
-    </ion-segment-button>
-    <ion-segment-button value="enemies" (ionSelect)="onSegmentSelected($event)">
-      Enemies
-    </ion-segment-button>
-  </ion-segment>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-segment id="segment" [(ngModel)]="relationship" (ionChange)="onSegmentChanged($event)">
+      <ion-segment-button value="friends" (ionSelect)="onSegmentSelected($event)" class="e2eSegmentFriends">
+        Friends
+      </ion-segment-button>
+      <ion-segment-button value="enemies" (ionSelect)="onSegmentSelected($event)">
+        Enemies
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+  <ion-toolbar>
+    <ion-buttons end>
+      <button>
+        <ion-icon name="search"></ion-icon>
+      </button>
+    </ion-buttons>
+    <ion-segment [(ngModel)]="icons" secondary>
+      <ion-segment-button value="camera">
+        <ion-icon name="camera"></ion-icon>
+      </ion-segment-button>
+      <ion-segment-button value="bookmark">
+        <ion-icon name="bookmark"></ion-icon>
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-buttons end>
-    <button>
-      <ion-icon name="search"></ion-icon>
-    </button>
-  </ion-buttons>
-  <ion-segment [(ngModel)]="icons" secondary>
-    <ion-segment-button value="camera">
-      <ion-icon name="camera"></ion-icon>
-    </ion-segment-button>
-    <ion-segment-button value="bookmark">
-      <ion-icon name="bookmark"></ion-icon>
-    </ion-segment-button>
-  </ion-segment>
-</ion-toolbar>
 
 <ion-content padding>
+
   <div>Are we friends or enemies? <b>{{ relationship }}</b></div>
 
   <h4>Map mode: NgControl</h4>
@@ -91,46 +97,53 @@
   </ion-segment>
 
   <button block dark (click)="toggleDisabled()">Toggle Disabled</button>
+
 </ion-content>
 
-<ion-toolbar position="bottom" primary>
-  <ion-segment [(ngModel)]="appType" light>
-    <ion-segment-button value="paid">
-      Primary
-    </ion-segment-button>
-    <ion-segment-button value="free">
-      Toolbar
-    </ion-segment-button>
-    <ion-segment-button value="top" class="e2eSegmentTopGrossing">
-      Light Segment
-    </ion-segment-button>
-  </ion-segment>
-</ion-toolbar>
 
-<ion-toolbar position="bottom">
-  <ion-segment [(ngModel)]="appType" danger>
-    <ion-segment-button value="paid">
-      Default
-    </ion-segment-button>
-    <ion-segment-button value="free">
-      Toolbar
-    </ion-segment-button>
-    <ion-segment-button value="top">
-      Danger Segment
-    </ion-segment-button>
-  </ion-segment>
-</ion-toolbar>
+<ion-footer>
 
-<ion-toolbar position="bottom">
-  <ion-segment [(ngModel)]="appType" dark [disabled]="isDisabled">
-    <ion-segment-button value="paid">
-      Default
-    </ion-segment-button>
-    <ion-segment-button value="free">
-      Toolbar
-    </ion-segment-button>
-    <ion-segment-button value="top">
-      Dark Segment
-    </ion-segment-button>
-  </ion-segment>
-</ion-toolbar>
+  <ion-toolbar primary>
+    <ion-segment [(ngModel)]="appType" light>
+      <ion-segment-button value="paid">
+        Primary
+      </ion-segment-button>
+      <ion-segment-button value="free">
+        Toolbar
+      </ion-segment-button>
+      <ion-segment-button value="top" class="e2eSegmentTopGrossing">
+        Light Segment
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+  <ion-toolbar>
+    <ion-segment [(ngModel)]="appType" danger>
+      <ion-segment-button value="paid">
+        Default
+      </ion-segment-button>
+      <ion-segment-button value="free">
+        Toolbar
+      </ion-segment-button>
+      <ion-segment-button value="top">
+        Danger Segment
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+  <ion-toolbar>
+    <ion-segment [(ngModel)]="appType" dark [disabled]="isDisabled">
+      <ion-segment-button value="paid">
+        Default
+      </ion-segment-button>
+      <ion-segment-button value="free">
+        Toolbar
+      </ion-segment-button>
+      <ion-segment-button value="top">
+        Dark Segment
+      </ion-segment-button>
+    </ion-segment>
+
+  </ion-toolbar>
+
+</ion-footer>
diff --git a/src/components/segment/test/nav/index.ts b/src/components/segment/test/nav/index.ts
index 7190f2df1c..49625bae85 100644
--- a/src/components/segment/test/nav/index.ts
+++ b/src/components/segment/test/nav/index.ts
@@ -20,14 +20,16 @@ class SegmentPage {
 
 @Component({
   template: `
-    <ion-navbar *navbar hideBackButton>
-      <button menuToggle>
-        <ion-icon name="menu"></ion-icon>
-      </button>
-      <ion-title>
-        Second Page
-      </ion-title>
-    </ion-navbar>
+    <ion-header>
+      <ion-navbar hideBackButton>
+        <button menuToggle>
+          <ion-icon name="menu"></ion-icon>
+        </button>
+        <ion-title>
+          Second Page
+        </ion-title>
+      </ion-navbar>
+    </ion-header>
 
     <ion-content>
       <h1>Page 2</h1>
diff --git a/src/components/segment/test/nav/main.html b/src/components/segment/test/nav/main.html
index 364e064ff6..3baf281eae 100644
--- a/src/components/segment/test/nav/main.html
+++ b/src/components/segment/test/nav/main.html
@@ -1,21 +1,27 @@
-<ion-navbar *navbar>
-  <ion-title>
-    Segment under Navbar
-  </ion-title>
-</ion-navbar>
-<ion-toolbar>
-  <ion-segment [(ngModel)]="signInType">
-    <ion-segment-button value="new">
-      New
-    </ion-segment-button>
-    <ion-segment-button value="existing" class="e2eSegmentExistingSegment">
-      Existing
-    </ion-segment-button>
-    <ion-segment-button value="test">
-      Test
-    </ion-segment-button>
-  </ion-segment>
-</ion-toolbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>
+      Segment under Navbar
+    </ion-title>
+  </ion-navbar>
+
+  <ion-toolbar>
+    <ion-segment [(ngModel)]="signInType">
+      <ion-segment-button value="new">
+        New
+      </ion-segment-button>
+      <ion-segment-button value="existing" class="e2eSegmentExistingSegment">
+        Existing
+      </ion-segment-button>
+      <ion-segment-button value="test">
+        Test
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content padding>
 
diff --git a/src/components/segment/test/swipe/main.html b/src/components/segment/test/swipe/main.html
index a58e135f6d..1b2986ee02 100644
--- a/src/components/segment/test/swipe/main.html
+++ b/src/components/segment/test/swipe/main.html
@@ -1,21 +1,27 @@
-<ion-navbar *navbar>
-  <ion-title>
-    Segment Swipeable under Navbar
-  </ion-title>
-</ion-navbar>
-<ion-toolbar>
-  <ion-segment [(ngModel)]="selectedSegment" (ionChange)="onSegmentChanged($event)">
-    <ion-segment-button value="first">
-      First
-    </ion-segment-button>
-    <ion-segment-button value="second">
-      Second
-    </ion-segment-button>
-    <ion-segment-button value="third">
-      Third
-    </ion-segment-button>
-  </ion-segment>
-</ion-toolbar>
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>
+      Segment Swipeable under Navbar
+    </ion-title>
+  </ion-navbar>
+
+  <ion-toolbar>
+    <ion-segment [(ngModel)]="selectedSegment" (ionChange)="onSegmentChanged($event)">
+      <ion-segment-button value="first">
+        First
+      </ion-segment-button>
+      <ion-segment-button value="second">
+        Second
+      </ion-segment-button>
+      <ion-segment-button value="third">
+        Third
+      </ion-segment-button>
+    </ion-segment>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content padding>
 
@@ -27,6 +33,7 @@
 
 </ion-content>
 
+
 <style>
   ion-scroll {
     width: 100%;
diff --git a/src/components/select/test/multiple-value/main.html b/src/components/select/test/multiple-value/main.html
index aa121c6a6e..9baec35ebd 100644
--- a/src/components/select/test/multiple-value/main.html
+++ b/src/components/select/test/multiple-value/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Select Item: Multiple Value</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Select Item: Multiple Value</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
 
diff --git a/src/components/select/test/single-value/main.html b/src/components/select/test/single-value/main.html
index 3bc10dc69f..f6a6f4b79c 100644
--- a/src/components/select/test/single-value/main.html
+++ b/src/components/select/test/single-value/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Select Item: Single Value</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Select Item: Single Value</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content class="outer-content">
 
diff --git a/src/components/show-hide-when/test/basic/main.html b/src/components/show-hide-when/test/basic/main.html
index 41fa32c34d..3b53a9dea6 100644
--- a/src/components/show-hide-when/test/basic/main.html
+++ b/src/components/show-hide-when/test/basic/main.html
@@ -1,15 +1,19 @@
+<ion-header>
 
-<ion-toolbar>
-  <ion-title>Show/Hide When</ion-title>
-  <ion-buttons end>
-    <button showWhen="ios">iOS</button>
-    <button showWhen="windows">Windows</button>
-    <button showWhen="android">Android</button>
-  </ion-buttons>
-</ion-toolbar>
+  <ion-toolbar>
+    <ion-title>Show/Hide When</ion-title>
+    <ion-buttons end>
+      <button showWhen="ios">iOS</button>
+      <button showWhen="windows">Windows</button>
+      <button showWhen="android">Android</button>
+    </ion-buttons>
+  </ion-toolbar>
+
+</ion-header>
 
 
 <ion-content padding>
+
   <button showWhen="ios">iOS</button>
   <button showWhen="windows">Windows</button>
   <button showWhen="android">Android</button>
diff --git a/src/components/slides/test/intro/index.ts b/src/components/slides/test/intro/index.ts
index 0c9df59672..7913afa37a 100644
--- a/src/components/slides/test/intro/index.ts
+++ b/src/components/slides/test/intro/index.ts
@@ -44,9 +44,11 @@ class IntroPage {
 
 @Component({
   template: `
-  <ion-navbar *navbar>
-    <ion-title>Slides</ion-title>
-  </ion-navbar>
+  <ion-header>
+    <ion-navbar>
+      <ion-title>Slides</ion-title>
+    </ion-navbar>
+  </ion-header>
 
   <ion-content padding>
     <h1>Another Page</h1>
diff --git a/src/components/slides/test/intro/main.html b/src/components/slides/test/intro/main.html
index 364f82929d..e31c786386 100644
--- a/src/components/slides/test/intro/main.html
+++ b/src/components/slides/test/intro/main.html
@@ -1,4 +1,5 @@
 <ion-header>
+
   <ion-navbar>
     <ion-buttons end>
       <button (click)="skip()">
@@ -7,9 +8,12 @@
     </ion-buttons>
     <ion-title>Slides</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content>
+
   <ion-slides pager [options]="mySlideOptions" (ionDidChange)="onSlideChanged($event)" (ionWillChange)="onSlideChangeStart($event)" (ionDrag)="onSlideMove($event)">
     <ion-slide>
       <h3>Thank you for choosing the Awesome App!</h3>
@@ -37,6 +41,7 @@
       <h3>Any questions?</h3>
     </ion-slide>
   </ion-slides>
+
 </ion-content>
 
 <style>
diff --git a/src/components/slides/test/scroll/main.html b/src/components/slides/test/scroll/main.html
index faa731c2ed..5dbc948c70 100644
--- a/src/components/slides/test/scroll/main.html
+++ b/src/components/slides/test/scroll/main.html
@@ -1,6 +1,11 @@
-<ion-toolbar>
-  <ion-title>Fixed Height Slides</ion-title>
-</ion-toolbar>
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Fixed Height Slides</ion-title>
+  </ion-toolbar>
+
+</ion-header>
+
 
 <ion-content>
 
diff --git a/src/components/spinner/test/basic/main.html b/src/components/spinner/test/basic/main.html
index af93f162fe..b837b8696c 100644
--- a/src/components/spinner/test/basic/main.html
+++ b/src/components/spinner/test/basic/main.html
@@ -1,7 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Spinners</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar>
-  <ion-title>Spinners</ion-title>
-</ion-toolbar>
 
 <ion-content padding>
 
diff --git a/src/components/tabs/test/advanced/modalChat.html b/src/components/tabs/test/advanced/modalChat.html
index 8fe83bda4b..8b34f2d2fb 100644
--- a/src/components/tabs/test/advanced/modalChat.html
+++ b/src/components/tabs/test/advanced/modalChat.html
@@ -1,9 +1,14 @@
 <ion-header>
+
   <ion-toolbar>
     <ion-title>Chat Modal</ion-title>
   </ion-toolbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <p><button (click)="viewCtrl.dismiss()">Close Modal</button></p>
+
 </ion-content>
diff --git a/src/components/tabs/test/advanced/signIn.html b/src/components/tabs/test/advanced/signIn.html
index e76c619891..1c012f7c74 100644
--- a/src/components/tabs/test/advanced/signIn.html
+++ b/src/components/tabs/test/advanced/signIn.html
@@ -1,10 +1,14 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Sign In</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <ion-card>
     <ion-item>
       <ion-label>Username:</ion-label>
@@ -18,4 +22,5 @@
       <button block id="signIn" (click)="push()">Sign In</button>
     </ion-item>
   </ion-card>
+
 </ion-content>
diff --git a/src/components/tabs/test/advanced/tab1page1.html b/src/components/tabs/test/advanced/tab1page1.html
index 171afb998c..b9c2d615d9 100644
--- a/src/components/tabs/test/advanced/tab1page1.html
+++ b/src/components/tabs/test/advanced/tab1page1.html
@@ -1,10 +1,14 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Tabs 1, Page 1</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <p><button id="goToTab1Page2" (click)="push()">Go to Tab 1, Page 2</button></p>
   <p><button (click)="logout()">Logout</button></p>
   <p><button (click)="favoritesTab()">Favorites Tab</button></p>
@@ -12,4 +16,5 @@
   <p>UserId: {{userId}}</p>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
+
 </ion-content>
diff --git a/src/components/tabs/test/advanced/tab1page2.html b/src/components/tabs/test/advanced/tab1page2.html
index 4468b4e3e5..0f30e2c121 100644
--- a/src/components/tabs/test/advanced/tab1page2.html
+++ b/src/components/tabs/test/advanced/tab1page2.html
@@ -1,12 +1,17 @@
 <ion-header>
+
   <ion-navbar primary>
     <ion-title>Tabs 1, Page 2</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <p><button (click)="push()">Go to Tab 1, Page 3</button></p>
   <p><button id="backToTab1Page1" (click)="nav.pop()">Back to Tab 1, Page 1</button></p>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
+
 </ion-content>
diff --git a/src/components/tabs/test/advanced/tab1page3.html b/src/components/tabs/test/advanced/tab1page3.html
index cfe94ef21a..46f11a8790 100644
--- a/src/components/tabs/test/advanced/tab1page3.html
+++ b/src/components/tabs/test/advanced/tab1page3.html
@@ -1,11 +1,16 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Tabs 1, Page 3</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <p><button (click)="nav.pop()">Back to Tab 1, Page 2</button></p>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-</ion-content>
\ No newline at end of file
+
+</ion-content>
diff --git a/src/components/tabs/test/advanced/tab2page1.html b/src/components/tabs/test/advanced/tab2page1.html
index 9b3a3f386e..c296222704 100644
--- a/src/components/tabs/test/advanced/tab2page1.html
+++ b/src/components/tabs/test/advanced/tab2page1.html
@@ -1,11 +1,16 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Tabs 2, Page 1</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <p><button (click)="push()">Go to Tab 2, Page 2</button></p>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-</ion-content>
\ No newline at end of file
+
+</ion-content>
diff --git a/src/components/tabs/test/advanced/tab2page2.html b/src/components/tabs/test/advanced/tab2page2.html
index c0d6218d62..edc303cebb 100644
--- a/src/components/tabs/test/advanced/tab2page2.html
+++ b/src/components/tabs/test/advanced/tab2page2.html
@@ -1,12 +1,17 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Tabs 2, Page 2</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <p><button (click)="push()">Go to Tab 2, Page 3</button></p>
   <p><button (click)="nav.pop()">Back to Tab 2, Page 1</button></p>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-</ion-content>
\ No newline at end of file
+
+</ion-content>
diff --git a/src/components/tabs/test/advanced/tab2page3.html b/src/components/tabs/test/advanced/tab2page3.html
index a79fc9fb7e..efb7481ecf 100644
--- a/src/components/tabs/test/advanced/tab2page3.html
+++ b/src/components/tabs/test/advanced/tab2page3.html
@@ -1,11 +1,16 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Tabs 2, Page 3</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <p><button (click)="nav.pop()">Back to Tab 2, Page 2</button></p>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
   <f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f><f></f>
-</ion-content>
\ No newline at end of file
+
+</ion-content>
diff --git a/src/components/tabs/test/advanced/tab3page1.html b/src/components/tabs/test/advanced/tab3page1.html
index 2151121853..9db1eae297 100644
--- a/src/components/tabs/test/advanced/tab3page1.html
+++ b/src/components/tabs/test/advanced/tab3page1.html
@@ -1,9 +1,14 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Tabs 3, Page 1</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <h2>Tabs 3, Page 1</h2>
-</ion-content>
\ No newline at end of file
+
+</ion-content>
diff --git a/src/components/toast/test/basic/main.html b/src/components/toast/test/basic/main.html
index 132785b40f..3c0e6002ab 100644
--- a/src/components/toast/test/basic/main.html
+++ b/src/components/toast/test/basic/main.html
@@ -1,10 +1,14 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Toasts</ion-title>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content padding>
+
   <button block (click)="showToast()">Show Toast and Navigate</button>
   <button block (click)="showLongToast()">Show Long Toast</button>
   <br />
@@ -24,4 +28,5 @@
   <p>
     Aenean viverra commodo enim eget interdum. Donec condimentum tincidunt sollicitudin. Curabitur malesuada est elementum lectus sodales, vitae eleifend massa dignissim. Pellentesque nec diam dapibus purus vulputate pharetra at id nunc. Vivamus dapibus sed turpis in facilisis. Nulla sollicitudin lacus sem, vel fringilla neque accumsan non. Suspendisse non congue turpis, id mattis ex. Nam sit amet diam quis neque convallis aliquet quis et lorem. Donec sit amet libero sit amet nisl mollis vehicula nec id eros. Curabitur rutrum condimentum porta. Donec pellentesque consectetur lacus. Etiam maximus ante vitae varius eleifend. Integer ac justo sem. Morbi iaculis vel urna in tempus. Aenean at rhoncus nulla.
   </p>
+
 </ion-content>
diff --git a/src/components/toggle/test/basic/main.html b/src/components/toggle/test/basic/main.html
index 2ab708e6d0..06107108fb 100644
--- a/src/components/toggle/test/basic/main.html
+++ b/src/components/toggle/test/basic/main.html
@@ -1,5 +1,11 @@
+<ion-header>
+
+  <ion-toolbar>
+    <ion-title>Toggles</ion-title>
+  </ion-toolbar>
+
+</ion-header>
 
-<ion-toolbar><ion-title>Toggles</ion-title></ion-toolbar>
 
 <ion-content>
 
diff --git a/src/components/virtual-scroll/test/basic/main.html b/src/components/virtual-scroll/test/basic/main.html
index 8a434f9057..eb8470a7f8 100644
--- a/src/components/virtual-scroll/test/basic/main.html
+++ b/src/components/virtual-scroll/test/basic/main.html
@@ -1,4 +1,5 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Virtual Scroll{{webview}}</ion-title>
     <ion-buttons end>
@@ -7,10 +8,11 @@
       </button>
     </ion-buttons>
   </ion-navbar>
+
 </ion-header>
 
-<ion-content>
 
+<ion-content>
 
   <ion-list [virtualScroll]="items"
             [headerFn]="headerFn">
@@ -25,5 +27,4 @@
 
   </ion-list>
 
-
 </ion-content>
diff --git a/src/components/virtual-scroll/test/image-gallery/main.html b/src/components/virtual-scroll/test/image-gallery/main.html
index 96f0f1ce29..7bad8f3b52 100644
--- a/src/components/virtual-scroll/test/image-gallery/main.html
+++ b/src/components/virtual-scroll/test/image-gallery/main.html
@@ -31,7 +31,9 @@
   }
 </style>
 
+
 <ion-header>
+
   <ion-navbar>
     <ion-title>Virtual Scroll: Image Gallery</ion-title>
     <ion-buttons end>
@@ -40,8 +42,10 @@
       </button>
     </ion-buttons>
   </ion-navbar>
+
 </ion-header>
 
+
 <ion-content>
 
   <ion-list [virtualScroll]="items"
diff --git a/src/components/virtual-scroll/test/sliding-item/main.html b/src/components/virtual-scroll/test/sliding-item/main.html
index f8b7f26641..c87bb2ce8c 100644
--- a/src/components/virtual-scroll/test/sliding-item/main.html
+++ b/src/components/virtual-scroll/test/sliding-item/main.html
@@ -1,4 +1,5 @@
 <ion-header>
+
   <ion-navbar>
     <ion-title>Virtual Scroll{{webview}}</ion-title>
     <ion-buttons end>
@@ -7,10 +8,11 @@
       </button>
     </ion-buttons>
   </ion-navbar>
+
 </ion-header>
 
-<ion-content>
 
+<ion-content>
 
   <ion-list [virtualScroll]="items"
             [headerFn]="headerFn">
@@ -31,5 +33,4 @@
 
   </ion-list>
 
-
 </ion-content>
diff --git a/tooling/generators/page/page.tmpl.html b/tooling/generators/page/page.tmpl.html
index 6d2097f41a..58a9985901 100644
--- a/tooling/generators/page/page.tmpl.html
+++ b/tooling/generators/page/page.tmpl.html
@@ -5,11 +5,14 @@
   Ionic pages and navigation.
 -->
 <ion-header>
+
   <ion-navbar>
     <ion-title><%= name %></ion-title>
   </ion-navbar>
+
 <ion-header>
 
+
 <ion-content padding>
 
 </ion-content>