docs(demos): update gulp file and API demos to include windows theme

demos/action-sheet/index.ts

@@ -15,84 +15,45 @@ class ApiDemoApp {
   templateUrl: 'main.html'
 })
 export class InitialPage {
-  constructor(nav: NavController, platform: Platform) {
+  constructor(public nav: NavController, public platform: Platform) { }
-    this.nav = nav;
-    this.platform = platform;
-  }
 
   present() {
-    if (this.platform.is('android')) {
+    let actionSheet = ActionSheet.create({
-      var androidSheet = {
+      title: 'Albums',
-        title: 'Albums',
-        buttons: [
-          {
-            text: 'Delete',
-            style: 'destructive',
-            icon: 'md-trash',
-            handler: () => {
-              console.log('Destructive clicked');
-            }
-          },
-          { text: 'Share',
-            icon: 'share',
-            handler: () => {
-              console.log('Share clicked');
-            }
-          },
-          { text: 'Play',
-            icon: 'arrow-dropright-circle',
-            handler: () => {
-              console.log('Play clicked');
-            }
-          },
-          { text: 'Favorite',
-            icon: 'md-heart-outline',
-            handler: () => {
-              console.log('Favorite clicked');
-            }
-          },
-          {
-            text: 'Cancel',
-            style: 'cancel',
-            icon: 'md-close',
-            handler: () => {
-              console.log('Cancel clicked');
-            }
-          }
-        ],
-      };
-    }
-
-    let actionSheet = ActionSheet.create( androidSheet || {
       buttons: [
         {
           text: 'Delete',
-          style: 'destructive',
+          role: 'destructive',
+          icon: !this.platform.is('ios') ? 'trash' : null,
           handler: () => {
-            console.log('Destructive clicked');
+            console.log('Delete clicked');
           }
         },
         {
           text: 'Share',
+          icon: !this.platform.is('ios') ? 'share' : null,
           handler: () => {
             console.log('Share clicked');
           }
         },
         {
           text: 'Play',
+          icon: !this.platform.is('ios') ? 'arrow-dropright-circle' : null,
           handler: () => {
             console.log('Play clicked');
           }
         },
         {
           text: 'Favorite',
+          icon: !this.platform.is('ios') ? 'heart-outline' : null,
           handler: () => {
             console.log('Favorite clicked');
           }
         },
         {
           text: 'Cancel',
-          style: 'cancel',
+          role: 'cancel', // will always sort to be on the bottom
+          icon: !this.platform.is('ios') ? 'close' : null,
           handler: () => {
             console.log('Cancel clicked');
           }

demos/app.wp.scss

@@ -0,0 +1 @@
+@import "../ionic/ionic.wp";

demos/output.wp.scss

@@ -0,0 +1,36 @@
+$font-path: "../fonts";
+$roboto-font-path: "../fonts";
+
+// http://ionicframework.com/docs/v2/theming/
+
+
+// App Shared Variables
+// --------------------------------------------------
+// To customize the look and feel of this app, you can override
+// the Sass variables found in Ionic's source scss files. Setting
+// variables before Ionic's Sass will use these variables rather than
+// Ionic's default Sass variable values. App Shared Sass imports belong
+// in the app.core.scss file and not this file. Sass variables specific
+// to the mode belong in either the app.ios.scss or app.md.scss files.
+
+
+// App Shared Color Variables
+// --------------------------------------------------
+// It's highly recommended to change the default colors
+// to match your app's branding. Ionic uses a Sass map of
+// colors so you can add, rename and remove colors as needed.
+// The "primary" color is the only required color in the map.
+// Both iOS and MD colors can be further customized if colors
+// are different per mode.
+
+$colors: (
+  primary:    #387ef5,
+  secondary:  #32db64,
+  danger:     #f53d3d,
+  light:      #f4f4f4,
+  dark:       #222,
+  vibrant:    rebeccapurple,
+  bright:     #FFC125
+);
+
+@import "../ionic/ionic.wp";

gulpfile.js

@@ -648,11 +648,20 @@ function buildDemoSass(isProductionMode) {
     .pipe(concat('output.md.scss'))
     .pipe(gulp.dest('demos/'))
 
+    gulp.src([
+        sassVars,
+        'demos/app.variables.scss',
+        'demos/app.wp.scss'
+      ])
+    .pipe(concat('output.wp.scss'))
+    .pipe(gulp.dest('demos/'))
+
   })();
 
   gulp.src([
     'demos/output.ios.scss',
-    'demos/output.md.scss'
+    'demos/output.md.scss',
+    'demos/output.wp.scss'
   ])
 
   .pipe(sass({

scripts/demos/index.template.dev.html

@@ -8,6 +8,7 @@
   <link rel="stylesheet" type="text/css" href="/dist/demos/scrollbar-fix.css">
   <link ios-href="../output.ios.css" rel="stylesheet">
   <link md-href="../output.md.css" rel="stylesheet">
+  <link wp-href="../output.wp.css" rel="stylesheet">
   <script type="text/javascript" src="/dist/demos/scrollbar-fix.js"></script>
   <script src="../../js/es6-shim.min.js"></script>
   <script src="../../js/es6-module-loader.src.js"></script>

scripts/demos/index.template.html

@@ -8,6 +8,7 @@
   <link rel="stylesheet" type="text/css" href="/dist/demos/scrollbar-fix.css">
   <link ios-href="../output.ios.css" rel="stylesheet">
   <link md-href="../output.md.css" rel="stylesheet">
+  <link wp-href="../output.wp.css" rel="stylesheet">
   <script type="text/javascript" src="/dist/demos/scrollbar-fix.js"></script>
 
 </head>