docs(demos): add ios statusbar, fix md statusbar positioning

demos/component-docs/app.css

@@ -199,6 +199,20 @@ body.md {
   border-top: 24px solid black;
 }
 
+body.ios{
+  border-top: 10px solid #F8F8F8;
+}
+
+body.ios backdrop {
+  top: -10px;
+  height: 105%;
+}
+
+body.md backdrop {
+  top: -24px;
+  height: 107%;
+}
+ 
 body.md img#md-only {
   display: block !important;
   position: absolute;
@@ -207,5 +221,13 @@ body.md img#md-only {
   height: auto;
 }
 
+body.ios img#ios-only {
+  display: block !important;
+  position: absolute;
+  top: -6px;
+  width: 100%;
+  height: auto;
+  z-index: 9999;
+}
 
 

demos/component-docs/index.ts

@@ -5,7 +5,10 @@ import * as helpers from './helpers';
 
 
 @App({
-  template: '<img src="img/android-statusbar-blue.png" style="display:none" id="md-only"><ion-nav id="nav" [root]="rootPage" #content></ion-nav><ion-overlay></ion-overlay>',
+  template: '<img src="img/android-statusbar-blue.png" style="display:none" id="md-only">' +
+            '<img src="img/ios-statusbar.png" style="display:none" id="ios-only">' +
+            '<ion-nav id="nav" [root]="rootPage" #content></ion-nav>' +
+            '<ion-overlay></ion-overlay>',
 })
 class DemoApp {