rework to standardize on npm instead of bower for the build. We still support bower releases, but we will build with npm and tools. Removed optional rubysass, libsass is the standard moving forward because of it's speed.

Gemfile

@@ -5,6 +5,5 @@ group :development, :test do
   gem 'jekyll-redirect-from', '~> 0.9.0'
   gem 'jekyll-seo-tag', '~> 0.1.3'
   gem 'jekyll-sitemap', '~> 0.9.0'
-  gem 'sass', '~> 3.4.19'
   gem 'scss_lint', '~> 0.43'
 end

Gemfile.lock

@@ -3,7 +3,7 @@ GEM
   specs:
     colorator (0.1)
     ffi (1.9.10)
-    jekyll (3.0.1)
+    jekyll (3.0.2)
       colorator (~> 0.1)
       jekyll-sass-converter (~> 1.0)
       jekyll-watch (~> 1.1)
@@ -19,7 +19,7 @@ GEM
     jekyll-seo-tag (0.1.4)
       jekyll (>= 2.0)
     jekyll-sitemap (0.9.0)
-    jekyll-watch (1.3.0)
+    jekyll-watch (1.3.1)
       listen (~> 3.0)
     kramdown (1.9.0)
     liquid (3.0.6)
@@ -27,15 +27,15 @@ GEM
       rb-fsevent (>= 0.9.3)
       rb-inotify (>= 0.9)
     mercenary (0.3.5)
-    rainbow (2.0.0)
+    rake (10.5.0)
     rb-fsevent (0.9.7)
     rb-inotify (0.9.5)
       ffi (>= 0.5.0)
     rouge (1.10.1)
     safe_yaml (1.0.4)
     sass (3.4.21)
-    scss_lint (0.43.2)
-      rainbow (~> 2.0)
+    scss_lint (0.44.0)
+      rake (~> 10.0)
       sass (~> 3.4.15)
 
 PLATFORMS
@@ -46,5 +46,4 @@ DEPENDENCIES
   jekyll-redirect-from (~> 0.9.0)
   jekyll-seo-tag (~> 0.1.3)
   jekyll-sitemap (~> 0.9.0)
-  sass (~> 3.4.19)
   scss_lint (~> 0.43)

Gruntfile.js

@@ -76,6 +76,26 @@ module.exports = function (grunt) {
       'docs-dist-css': 'docs/dist/css'
     },
 
+    sass: {
+      options: {
+        includePaths: ['scss', 'node_modules'],
+        precision: 6,
+        sourceComments: true,
+        sourceMap: true,
+        outputStyle: 'expanded'
+      },
+      core: {
+        files: {
+          'dist/css/<%= pkg.name %>.css': 'scss/<%= pkg.name %>.scss'
+        }
+      },
+      docs: {
+        files: {
+          'docs/dist/css/docs.css': 'docs/assets/scss/docs.scss'
+        }
+      }
+    },
+
     eslint: {
       options: {
         configFile: 'js/.eslintrc'
@@ -482,13 +502,8 @@ module.exports = function (grunt) {
 
   });
 
-
   // These plugins provide necessary tasks.
-  require('load-grunt-tasks')(grunt, {
-    scope: 'devDependencies',
-    // Exclude Sass compilers. We choose the one to load later on.
-    pattern: ['grunt-*', '!grunt-sass', '!grunt-contrib-sass']
-  });
+  require('load-grunt-tasks')(grunt);
   require('time-grunt')(grunt);
 
   // Docs HTML validation task
@@ -557,11 +572,6 @@ module.exports = function (grunt) {
   grunt.registerTask('test-scss', ['scsslint:core']);
 
   // CSS distribution task.
-  // Supported Compilers: sass (Ruby) and libsass.
-  (function (sassCompilerName) {
-    require('./grunt/bs-sass-compile/' + sassCompilerName + '.js')(grunt);
-  })(process.env.MDB_SASS || 'libsass');
-  // grunt.registerTask('sass-compile', ['sass:core', 'sass:extras', 'sass:docs']);
   grunt.registerTask('sass-compile', ['sass:core', 'sass:docs']);
 
   grunt.registerTask('dist-css', [

docs/_plugins/variables.rb

@@ -18,10 +18,10 @@ module Variables
       site.data['minified'] = minified
 
       metadata_files = {
-        'bower' => '../bower.json',
         'package' => '../package.json',
-        'bower_jquery' => '../bower_components/jquery/.bower.json',
-        'bower_tether' => '../bower_components/tether/.bower.json'
+        'npm_bootstrap' => '../node_modules/bootstrap/package.json',
+        'npm_jquery' => '../node_modules/jquery/package.json',
+        'npm_tether' => '../node_modules/tether/package.json'
       }
 
       metadata_files.each do |metadata, path|
@@ -29,24 +29,24 @@ module Variables
         site.data[metadata] = contents
       end
 
-      # validate and provide some quick access to common variables (instead of diving into package and bower)
+      # validate and provide some quick access to common variables
       name = site.data['package']['name']
       assert_not_nil :name, name
 
       version = site.data['package']['version']
       assert_not_nil :version, version
 
-      bootstrap_version = site.data['bower']['dependencies']['bootstrap']
+      bootstrap_version = site.data['npm_bootstrap']['version']
       assert_not_nil :bootstrap_version, bootstrap_version
 
       if (bootstrap_version.include?('rosskevin'))
         bootstrap_version = 'v4-dev' # hack since we are using a rosskevin flex branch
       end
 
-      tether_version = site.data['bower_tether']['version']
+      tether_version = site.data['npm_tether']['version']
       assert_not_nil :tether_version, tether_version
 
-      jquery_version = site.data['bower_jquery']['version']
+      jquery_version = site.data['npm_jquery']['version']
       assert_not_nil :jquery_version, jquery_version
 
       site.data['name'] = name
@@ -55,7 +55,6 @@ module Variables
       site.data['tether_version'] = tether_version
       site.data['jquery_version'] = jquery_version
 
-
       # fabricate the archive and release links based on the site.repo and version
       repo = site.config['repo']
       site.data['download'] = {

docs/getting-started/build-tools.md

@@ -36,14 +36,6 @@ Our Gruntfile includes the following commands and tasks:
 | `grunt docs` | Builds and tests CSS, JavaScript, and other assets which are used when running the documentation locally via `jekyll serve`. |
 | `grunt watch` | This is a convenience method for watching just Sass files and automatically building them whenever you save. |
 
-## Switching Sass compilers
-
-Material Design for Bootstrap will be compiled with [libsass][libsass] by default, but you can opt into traditional Ruby Sass by setting the `MDB_SASS` environment variable. Two options are supported:
-
-* `libsass` (default) to use [libsass][libsass] via [grunt-sass][grunt-sass].
-* `sass` to use [Ruby Sass][ruby-sass] via [grunt-contrib-sass][grunt-contrib-sass].
-
-For example, run `MDB_SASS=sass grunt` to test and build Material Design for Bootstrap with Ruby Sass.
 
 ## Autoprefixer
 
@@ -71,7 +63,7 @@ Bootstrap checked out in parallel to this project, running three (3) different t
   
     1. Performs an initial dependency setup/build
     
-        `bundle install && npm install && bower install && grunt dist`
+        `bundle install && npm install && grunt dist`
       
     1. Start serving the documentation on <http://localhost:9000>
       
@@ -81,7 +73,7 @@ Bootstrap checked out in parallel to this project, running three (3) different t
 
     1. Performs an initial dependency setup/build
     
-        `bundle install && npm install && bower install && grunt dist`
+        `bundle install && npm install && grunt dist`
          
     1. Watch both the core and docs sources for changes
     

docs/getting-started/customization.md

@@ -18,27 +18,28 @@ Here are some ways to customize:
 
 ## 1. (Recommended) Include the source in your application
 
-Installing via Bower, customizing MDB is a breeze.  
+Installing via npm (recommended) or bower, customizing MDB is a breeze.  
  
-1. Add `bootstrap-material-design` as a dependeny to your `bower.json`
-1. `bower install`
-1. In your application's Sass, redefine any customized variable _before_ `@import`ing bootstrap material design from your bower dependency directory.  For example:
+1. Add `bootstrap-material-design` as a dependency to your `package.json` or your `bower.json`
+1. `npm install` or `bower install` depending on your tool of choice
+1. Add either `node_modules` or `bower_components` in the `includePaths` for your grunt-sass, gulp-sass, or equivalent so you are able to import without specifying the full path of the resource.
+1. In your application's SCSS, redefine any customized variable _before_ `@import`ing bootstrap material design.  For example:
 
 ~~~~~~~~
 $brand-primary: #3f51b5;         // bootstrap variable
 $mdb-label-color-focus: #303f9f; // mdb variable
 
-@import "../bower_components/bootstrap-material-design/scss/core"; // make sure to use _core.scss!
+@import "bootstrap-material-design/scss/core"; // make sure to use _core.scss!
 ~~~~~~~~
 
 
-## 2. Download the source and change/compile
+## 3. Download the source and change/compile
 
 {% callout warning %}
 This method is not recommended because it may be difficult to use source control **and** keep up to date with new releases.  Please consider the recommended method above. 
 {% endcallout %}
 
-1. Download the source via bower or otherwise
+1. Download the source via npm, bower or otherwise
 2. Change any of the variables
 3. Run `grunt dist`
 

docs/getting-started/download.md

@@ -36,12 +36,6 @@ Pull in Material Design for Bootstrap's **source files** into nearly any project
 **Heads up!** Not all package managers have the v4 alpha published yet, but we should have them up shortly!
 {% endcallout %}
 
-### Bower
-
-Install and manage Material Design for Bootstrap's Sass and JavaScript using [Bower](http://bower.io).
-
-{% highlight bash %}$ bower install bootstrap-material-design#v{{ site.data.version }}{% endhighlight %}
-
 ### npm
 
 Install Material Design for Bootstrap in your Node powered apps with [the npm package](https://www.npmjs.org/package/bootstrap):
@@ -55,6 +49,12 @@ Material Design for Material Design for Bootstrap's `package.json` contains some
 - `sass` - path to Material Design for Bootstrap's main [Sass](http://sass-lang.com/) source file
 - `style` - path to Material Design for Bootstrap's non-minified CSS that's been precompiled using the default settings (no customization)
 
+### Bower
+
+Install and manage Material Design for Bootstrap's Sass and JavaScript using [Bower](http://bower.io).
+
+{% highlight bash %}$ bower install bootstrap-material-design#v{{ site.data.version }}{% endhighlight %}
+
 ### Meteor
 
 {% highlight bash %}

docs/getting-started/javascript.md

@@ -17,7 +17,7 @@ Plugins can be included individually (using Bootstrap's individual `*.js` files)
 
 ## Dependencies
 
-Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs. Also note that all plugins depend on jQuery (this means jQuery must be included **before** the plugin files). [Consult our `bower.json`]({{ site.repo }}/blob/v{{ site.data.version }}/bower.json) to see which versions of jQuery are supported.
+Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs. Also note that all plugins depend on jQuery (this means jQuery must be included **before** the plugin files). [Consult our `package.json`]({{ site.repo }}/blob/v{{ site.data.version }}/package.json) to see which versions of jQuery are supported.
 
 ## Data attributes
 

docs/getting-started/release-process.md

@@ -36,7 +36,7 @@ Use the following task template:
 Tag for bower - a valid tag starts with a `v` such as `v4.0.0`
 
 ### NPM
-TODO: push to npm?
+`npm publish`
 
 ### Meteor
 TODO: push to meteor?

docs/migration.md

@@ -118,7 +118,7 @@ Our documentation received an upgrade across the board as well. Here's the low d
 - We're using Jekyll (seeded from Bootstrap's project itself) and we have custom plugins in the mix:
   - `example.rb` is a fork of the default `highlight.rb` plugin, allowing for easier example-code handling.
   - `callout.rb` is a similar fork of that, but designed for our special docs callouts.
-  - `variables.rb` which gathers the version (`package.json`), dependencies (`bower.json`) and makes them available to render text and links in the documentation `site.data`.  No more SED to replace versions everywhere! 
+  - `variables.rb` which gathers the version from (`package.json`), dependencies from `node_modules` (`package.json`) and makes them available to render text and links in the documentation `site.data`.  No more SED to replace versions everywhere! 
 - All docs content has been rewritten in Markdown (instead of HTML) for easier editing.
 - Pages have been reorganized for simpler content and a more approachable hierarchy.
 - We moved from regular CSS to SCSS to take full advantage of variables, mixins, and more.

grunt/bs-sass-compile/libsass.js

@@ -1,34 +0,0 @@
-// Compile Bootstrap with [libsass][1] using [grunt-sass][2]
-// [1]: https://github.com/sass/libsass
-// [2]: https://github.com/sindresorhus/grunt-sass
-module.exports = function configureLibsass(grunt) {
-  grunt.config.merge({
-    sass: {
-      options: {
-        includePaths: ['scss'],
-        precision: 6,
-        sourceComments: true,
-        sourceMap: true,
-        outputStyle: 'expanded'
-      },
-      core: {
-        files: {
-          'dist/css/<%= pkg.name %>.css': 'scss/<%= pkg.name %>.scss'
-        }
-      },
-      extras: {
-        files: {
-          //'dist/css/<%= pkg.name %>-flex.css': 'scss/<%= pkg.name %>.scss',
-          //'dist/css/<%= pkg.name %>-grid.css': 'scss/<%= pkg.name %>-grid.scss',
-          //'dist/css/<%= pkg.name %>-reboot.css': 'scss/<%= pkg.name %>-reboot.scss'
-        }
-      },
-      docs: {
-        files: {
-          'docs/dist/css/docs.css': 'docs/assets/scss/docs.scss'
-        }
-      }
-    }
-  });
-  grunt.loadNpmTasks('grunt-sass');
-};

grunt/bs-sass-compile/sass.js

@@ -1,38 +0,0 @@
-// Compile Bootstrap with [Ruby Sass][1] using [grunt-contrib-sass][2]
-// [1]: https://github.com/sass/sass
-// [2]: https://github.com/gruntjs/grunt-contrib-sass
-module.exports = function configureRubySass(grunt) {
-  var options = {
-    loadPath: ['scss'],
-    precision: 6,
-    sourcemap: 'auto',
-    style: 'expanded',
-    trace: true,
-    bundleExec: true
-  };
-  grunt.config.merge({
-    sass: {
-      core: {
-        options: options,
-        files: {
-          'dist/css/<%= pkg.name %>.css': 'scss/<%= pkg.name %>.scss'
-        }
-      },
-      extras: {
-        options: options,
-        files: {
-          //'dist/css/<%= pkg.name %>-flex.css': 'scss/<%= pkg.name %>-flex.scss',
-          //'dist/css/<%= pkg.name %>-grid.css': 'scss/<%= pkg.name %>-grid.scss',
-          //'dist/css/<%= pkg.name %>-reboot.css': 'scss/<%= pkg.name %>-reboot.scss'
-        }
-      },
-      docs: {
-        options: options,
-        files: {
-          'docs/dist/css/docs.css': 'docs/assets/scss/docs.scss'
-        }
-      }
-    }
-  });
-  grunt.loadNpmTasks('grunt-contrib-sass');
-};

package.json

@@ -32,6 +32,11 @@
     "url": "https://github.com/FezVrasta/bootstrap-material-design/issues"
   },
   "license": "MIT",
+  "dependencies": {
+    "bootstrap": "rosskevin/bootstrap#v4-tmp-flex-master",
+    "jquery": "^2.0",
+    "tether": "^1.1.1"
+  },
   "devDependencies": {
     "autoprefixer": "^6.0.3",
     "babel-eslint": "^4.1.6",
@@ -47,7 +52,6 @@
     "grunt-contrib-copy": "~0.8.1",
     "grunt-contrib-cssmin": "~0.14.0",
     "grunt-contrib-qunit": "~0.7.0",
-    "grunt-contrib-sass": "^0.9.2",
     "grunt-contrib-uglify": "~0.11.0",
     "grunt-contrib-watch": "~0.6.1",
     "grunt-csscomb": "~3.1.0",

scss/_bootstrap.scss

@@ -3,49 +3,49 @@
 //@import "../../bootstrap/scss/
 
 // Core variables and mixins
-@import "../bower_components/bootstrap/scss/custom";
-@import "../bower_components/bootstrap/scss/variables";
-@import "../bower_components/bootstrap/scss/mixins";
+@import "bootstrap/scss/custom";
+@import "bootstrap/scss/variables";
+@import "bootstrap/scss/mixins";
 
 // Reset and dependencies
-@import "../bower_components/bootstrap/scss/normalize";
-@import "../bower_components/bootstrap/scss/print";
+@import "bootstrap/scss/normalize";
+@import "bootstrap/scss/print";
 
 // Core CSS
-@import "../bower_components/bootstrap/scss/reboot";
-@import "../bower_components/bootstrap/scss/type";
-@import "../bower_components/bootstrap/scss/images";
-@import "../bower_components/bootstrap/scss/code";
-@import "../bower_components/bootstrap/scss/grid";
-@import "../bower_components/bootstrap/scss/tables";
-@import "../bower_components/bootstrap/scss/forms";
-@import "../bower_components/bootstrap/scss/buttons";
+@import "bootstrap/scss/reboot";
+@import "bootstrap/scss/type";
+@import "bootstrap/scss/images";
+@import "bootstrap/scss/code";
+@import "bootstrap/scss/grid";
+@import "bootstrap/scss/tables";
+@import "bootstrap/scss/forms";
+@import "bootstrap/scss/buttons";
 
 // Components
-@import "../bower_components/bootstrap/scss/animation";
-@import "../bower_components/bootstrap/scss/dropdown";
-@import "../bower_components/bootstrap/scss/button-group";
-@import "../bower_components/bootstrap/scss/input-group";
-@import "../bower_components/bootstrap/scss/custom-forms";
-@import "../bower_components/bootstrap/scss/nav";
-@import "../bower_components/bootstrap/scss/navbar";
-@import "../bower_components/bootstrap/scss/card";
-@import "../bower_components/bootstrap/scss/breadcrumb";
-@import "../bower_components/bootstrap/scss/pagination";
-@import "../bower_components/bootstrap/scss/labels";
-@import "../bower_components/bootstrap/scss/jumbotron";
-@import "../bower_components/bootstrap/scss/alert";
-@import "../bower_components/bootstrap/scss/progress";
-@import "../bower_components/bootstrap/scss/media";
-@import "../bower_components/bootstrap/scss/list-group";
-@import "../bower_components/bootstrap/scss/responsive-embed";
-@import "../bower_components/bootstrap/scss/close";
+@import "bootstrap/scss/animation";
+@import "bootstrap/scss/dropdown";
+@import "bootstrap/scss/button-group";
+@import "bootstrap/scss/input-group";
+@import "bootstrap/scss/custom-forms";
+@import "bootstrap/scss/nav";
+@import "bootstrap/scss/navbar";
+@import "bootstrap/scss/card";
+@import "bootstrap/scss/breadcrumb";
+@import "bootstrap/scss/pagination";
+@import "bootstrap/scss/labels";
+@import "bootstrap/scss/jumbotron";
+@import "bootstrap/scss/alert";
+@import "bootstrap/scss/progress";
+@import "bootstrap/scss/media";
+@import "bootstrap/scss/list-group";
+@import "bootstrap/scss/responsive-embed";
+@import "bootstrap/scss/close";
 
 // Components w/ JavaScript
-@import "../bower_components/bootstrap/scss/modal";
-@import "../bower_components/bootstrap/scss/tooltip";
-@import "../bower_components/bootstrap/scss/popover";
-@import "../bower_components/bootstrap/scss/carousel";
+@import "bootstrap/scss/modal";
+@import "bootstrap/scss/tooltip";
+@import "bootstrap/scss/popover";
+@import "bootstrap/scss/carousel";
 
 // Utility classes
-@import "../bower_components/bootstrap/scss/utilities";
+@import "bootstrap/scss/utilities";

scss/_variables.scss

@@ -16,7 +16,27 @@ $mdb-text-color-inverse-light: rgba($white, 0.54) !default;
 $mdb-label-color: $gray-light !default;
 $mdb-label-color-inner-focus: $gray !default; // e.g. radio label or text-muted not a control-label which is primary
 
-@import "variables/bootstrap";
+// Customized BS variables
+@import "variables/bootstrap/components";
+@import "variables/bootstrap/spacing";
+@import "variables/bootstrap/body";
+@import "variables/bootstrap/brand";
+@import "variables/bootstrap/buttons";
+@import "variables/bootstrap/card";
+@import "variables/bootstrap/code";
+@import "variables/bootstrap/dropdown";
+@import "variables/bootstrap/forms";
+@import "variables/bootstrap/list-group";
+@import "variables/bootstrap/nav";
+@import "variables/bootstrap/state";
+@import "variables/bootstrap/type";
+@import "variables/bootstrap/modals";
+
+// import their vars after customization for use below
+$enable-flex: true;     // fully adopt flexbox layouts
+$enable-shadows: true;  // enable shadows, set to false to turn off shadows
+@import "bootstrap/scss/variables"; // from bootstrap node_module
+
 
 //
 @import "variables/layout";

scss/variables/_bootstrap.scss

@@ -1,21 +0,0 @@
-// Customized BS variables
-@import "bootstrap/components";
-@import "bootstrap/spacing";
-
-@import "bootstrap/body";
-@import "bootstrap/brand";
-@import "bootstrap/buttons";
-@import "bootstrap/card";
-@import "bootstrap/code";
-@import "bootstrap/dropdown";
-@import "bootstrap/forms";
-@import "bootstrap/list-group";
-@import "bootstrap/nav";
-@import "bootstrap/state";
-@import "bootstrap/type";
-@import "bootstrap/modals";
-
-// import their vars after customization for use below
-$enable-flex: true;     // fully adopt flexbox layouts
-$enable-shadows: true;  // enable shadows, set to false to turn off shadows
-@import "../../bower_components/bootstrap/scss/variables";