build(): add gulpfile to inline resources.

Author: jelbourn

gulpfile.js

@@ -0,0 +1,19 @@
+var gulp = require('gulp');
+var inlineNg2Template = require('gulp-inline-ng2-template');
+
+
+/**
+ * DO NOT ADD EXTRA TASKS HERE.
+ *
+ * gulp is only used temporarily in order to perform HTML and CSS in-lining for publishing.
+ * Eventually the CLI should support this.
+ *
+ * See https://github.com/angular/angular-cli/issues/296
+ *
+ */
+
+gulp.task('inline-resources', function(){
+  gulp.src('./dist/components/**/*.js')
+      .pipe(inlineNg2Template({base: './dist'}))
+      .pipe(gulp.dest('./dist/components'));
+});

package.json

@@ -44,6 +44,8 @@
     "ember-cli-inject-live-reload": "^1.3.0",
     "fs-extra": "^0.26.5",
     "glob": "^6.0.4",
+    "gulp": "^3.9.1",
+    "gulp-inline-ng2-template": "^1.1.2",
     "jasmine-core": "^2.3.4",
     "js-yaml": "^3.5.2",
     "karma": "^0.13.15",

src/components/sidenav/sidenav.scss

@@ -12,15 +12,15 @@ $md-sidenav-push-background-color: md-color($md-background, dialog) !default;
 
 
 /**
- * Mixin to help with defining LTR/RTL `transform: translateX()` values.
+ * Mixin to help with defining LTR/RTL 'transform: translateX()' values.
  * @param $open The translation value when the sidenav is opened.
  * @param $close The translation value when the sidenav is closed.
  */
 @mixin md-sidenav-transition($open, $close) {
   transform: translateX($close);
 
   &.md-sidenav-closed {
-    // We use `visibility: hidden | visible` because `display: none` will not animate any
+    // We use 'visibility: hidden | visible' because 'display: none' will not animate any
     // transitions, while visibility will interpolate transitions properly.
     // see https://developer.mozilla.org/en-US/docs/Web/CSS/visibility, the Interpolation
     // section.
@@ -46,7 +46,7 @@ $md-sidenav-push-background-color: md-color($md-background, dialog) !default;
 :host {
   // We need a stacking context here so that the backdrop and drawers are clipped to the
   // MdSidenavLayout. This creates a new z-index stack so we use low numbered z-indices.
-  // We create another stacking context in the `<md-content>` and in each sidenav so that
+  // We create another stacking context in the '<md-content>' and in each sidenav so that
   // the application content does not get messed up with our own CSS.
   @include md-stacking-context();
 
@@ -71,7 +71,7 @@ $md-sidenav-push-background-color: md-color($md-background, dialog) !default;
     // numbers.
     z-index: 2;
 
-    // We use `visibility: hidden | visible` because `display: none` will not animate any
+    // We use 'visibility: hidden | visible' because 'display: none' will not animate any
     // transitions, while visibility will interpolate transitions properly.
     // see https://developer.mozilla.org/en-US/docs/Web/CSS/visibility, the Interpolation
     // section.