docs(demos): update segment

Closes #607

demos/component-docs/inputs/segment/pages.ts

@@ -1,4 +1,4 @@
-import {Page} from 'ionic/ionic';
+import {Page, Platform} from 'ionic/ionic';
 import {forwardRef} from 'angular2/angular2';
 import {AndroidAttribute} from '../../helpers';
 
@@ -7,8 +7,10 @@ import {AndroidAttribute} from '../../helpers';
   directives: [forwardRef(() => AndroidAttribute)]
 })
 export class SegmentPage{
-  constructor() {
+  constructor(platform: Platform) {
+    this.platform = platform;
     this.pet = "puppies";
+    this.isAndroid = platform.is('android');
   }
 
 }

demos/component-docs/inputs/segment/template.html

@@ -6,19 +6,26 @@
 
 </ion-navbar>
 
+<ion-toolbar [attr.primary]="isAndroid ? '' : null">
+  <ion-segment [(ng-model)]="pet">
+    <ion-segment-button value="puppies">
+      Puppies
+    </ion-segment-button>
+    <ion-segment-button value="kittens">
+      Kittens
+    </ion-segment-button>
+    <ion-segment-button value="ducklings">
+      Ducklings
+    </ion-segment-button>
+  </ion-segment> 
+</ion-toolbar>
+
 
 <ion-content>
 
-  <div padding>
+<!--   <div padding>
-    <ion-segment [(ng-model)]="pet">
+
-      <ion-segment-button value="kittens">
+  </div>  -->
-        Kittens
-      </ion-segment-button>
-      <ion-segment-button value="puppies">
-        Puppies
-      </ion-segment-button>
-    </ion-segment> 
-  </div> 
 
   <div [ng-switch]="pet">
     <ion-list *ng-switch-when="'puppies'">
@@ -74,6 +81,33 @@
         <h2>Nala</h2>
       </ion-item>
     </ion-list>
+
+    <ion-list *ng-switch-when="'ducklings'">
+      <ion-item>
+        <ion-thumbnail item-left>
+          <img src="img/thumbnail-duckling-1.jpg">
+        </ion-thumbnail>
+        <h2>Daffy</h2>
+      </ion-item>
+      <ion-item>
+        <ion-thumbnail item-left>
+          <img src="img/thumbnail-duckling-2.jpg">
+        </ion-thumbnail>
+        <h2>Huey</h2>
+      </ion-item>
+      <ion-item>
+        <ion-thumbnail item-left>
+          <img src="img/thumbnail-duckling-3.jpg">
+        </ion-thumbnail>
+        <h2>Dewey</h2>
+      </ion-item>
+      <ion-item>
+        <ion-thumbnail item-left>
+          <img src="img/thumbnail-duckling-4.jpg">
+        </ion-thumbnail>
+        <h2>Louie</h2>
+      </ion-item>
+    </ion-list>
   </div>