diff --git a/ionic/components/app/test/hn/index.js b/ionic/components/app/test/hn/index.js
index c277fda0d6..1814f7ca5e 100644
--- a/ionic/components/app/test/hn/index.js
+++ b/ionic/components/app/test/hn/index.js
@@ -1,8 +1,8 @@
-import {bootstrap, ElementRef} from 'angular2/angular2'
+import {bootstrap} from 'angular2/angular2'
 import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
 import {View} from 'angular2/src/core/annotations_impl/view';
 
-import {Nav, HeaderTemplate, Toolbar, Content} from 'ionic/ionic';
+import {Nav} from 'ionic/ionic';
 
 import {HackerNews} from './hn';
 import {HNTopStories} from './pages/top';
@@ -10,12 +10,10 @@ import {HNTopStories} from './pages/top';
 @Component({ selector: 'ion-app' })
 @View({
   templateUrl: 'main.html',
-  directives: [Nav, Content, HeaderTemplate, Toolbar]
+  directives: [Nav]
 })
 export class IonicApp {
-  constructor(
-    elementRef: ElementRef
-  ) {
+  constructor() {
     console.log('IonicApp start: HackerNews', HackerNews)
 
     this.splashPage = HNTopStories
diff --git a/ionic/components/app/test/hn/main.html b/ionic/components/app/test/hn/main.html
index fd665625f7..5f69401d4f 100644
--- a/ionic/components/app/test/hn/main.html
+++ b/ionic/components/app/test/hn/main.html
@@ -2,10 +2,10 @@
 </ion-nav>
 
 <style>
-.toolbar-container {
+.navbar-container {
   background-color: #ff6600 !important;
 }
-.toolbar-ios ion-title {
+.nav-ios ion-title {
   color: #fff !important;
 }
 </style>
diff --git a/ionic/components/app/test/hn/pages/single.html b/ionic/components/app/test/hn/pages/single.html
index bdc8b28be6..2ccf94c4db 100644
--- a/ionic/components/app/test/hn/pages/single.html
+++ b/ionic/components/app/test/hn/pages/single.html
@@ -1,4 +1,5 @@
-<ion-toolbar *header><ion-title>{{post.title}}</ion-title></ion-toolbar>
+<ion-navbar *navbar><ion-title>{{post.title}}</ion-title></ion-navbar>
+
 <ion-content>
   <iframe style="width: 100%; height: 100%" src="{{post.url}}">
   </iframe>
diff --git a/ionic/components/app/test/hn/pages/single.js b/ionic/components/app/test/hn/pages/single.js
index c86e172d65..f52c90d6d7 100644
--- a/ionic/components/app/test/hn/pages/single.js
+++ b/ionic/components/app/test/hn/pages/single.js
@@ -1,18 +1,17 @@
-import {NgFor, bootstrap} from 'angular2/angular2';
-
+import {NgFor} from 'angular2/angular2';
 import {Ancestor} from 'angular2/src/core/annotations_impl/visibility';
-
 import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
 import {View} from 'angular2/src/core/annotations_impl/view';
 
-import {NavController, NavParams, HeaderTemplate, Toolbar, Content, Nav, NavPane, List, Item} from 'ionic/ionic';
+import {NavController, NavParams, NavbarTemplate, Navbar, Content, Nav, NavPane, List, Item} from 'ionic/ionic';
 
 import {HackerNews} from '../hn'
 
+
 @Component({ selector: 'top-stories' })
 @View({
   templateUrl: 'pages/single.html',
-  directives: [HeaderTemplate, Toolbar, Content, NgFor, List, Item]
+  directives: [NavbarTemplate, Navbar, Content, NgFor, List, Item]
 })
 export class HNSinglePost {
   constructor(
diff --git a/ionic/components/app/test/hn/pages/top.html b/ionic/components/app/test/hn/pages/top.html
index 853f548594..d025145ae2 100644
--- a/ionic/components/app/test/hn/pages/top.html
+++ b/ionic/components/app/test/hn/pages/top.html
@@ -1,4 +1,4 @@
-<ion-toolbar *header><ion-title>Top</ion-title></ion-toolbar>
+<ion-navbar *navbar><ion-title>Top</ion-title></ion-navbar>
 
 <ion-content class="padding">
 
diff --git a/ionic/components/app/test/hn/pages/top.js b/ionic/components/app/test/hn/pages/top.js
index 54971bf05e..69ddd1d52d 100644
--- a/ionic/components/app/test/hn/pages/top.js
+++ b/ionic/components/app/test/hn/pages/top.js
@@ -1,15 +1,14 @@
-import {NgFor, ElementRef, bootstrap} from 'angular2/angular2';
-
+import {NgFor} from 'angular2/angular2';
 import {Ancestor} from 'angular2/src/core/annotations_impl/visibility';
-
 import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
 import {View} from 'angular2/src/core/annotations_impl/view';
 
-import {NavController, HeaderTemplate, Toolbar, Content, List, Item} from 'ionic/ionic';
+import {NavController, NavbarTemplate, Navbar, Content, List, Item} from 'ionic/ionic';
 
 import {HackerNews} from '../hn';
 import {HNSinglePost} from './single';
 
+
 console.log('Angular directives', NgFor, Content, List, Item);
 
 @Component({
@@ -29,7 +28,7 @@ export class Story {
 })
 @View({
   templateUrl: 'pages/top.html',
-  directives: [HeaderTemplate, Toolbar, Content, NgFor, List, Story, Item]
+  directives: [NavbarTemplate, Navbar, Content, NgFor, List, Story, Item]
 })
 export class HNTopStories {
   constructor(