Fixed build and docs

_config.yml

@@ -36,6 +36,7 @@ url: "http://rosskevin.github.io"
 # other variables generated in
 
 mkp:               http://www.creative-tim.com/product/material-kit-pro?affiliate_id=87385
+mdp:               http://www.creative-tim.com/product/material-dashboard-pro?affiliate_id=87385
 #blog:             http://blog.getbootstrap.com
 #expo:             http://expo.getbootstrap.com
 #themes:           http://themes.getbootstrap.com

docs/_includes/nav-home.html

@@ -1,7 +1,7 @@
-<header class="navbar navbar-light navbar-static-top bd-navbar" role="banner">
+<header class="navbar navbar-light navbar-toggleable-md bd-navbar">
   <div class="container">
     {% comment %}
-    <nav class="nav navbar-nav pull-xs-right">
+    <nav class="nav navbar-nav float-right">
       <div class="nav-item dropdown">
         <a class="nav-item nav-link dropdown-toggle" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
           v{{ site.data.version }}
@@ -25,14 +25,13 @@
     </nav>
     {% endcomment %}
 
-    <nav>
+    <div class="d-flex justify-content-between d-lg-none">
-      <div class="clearfix">
+      <a class="navbar-brand" href="{{ site.baseurl }}/">
-        <button class="navbar-toggler pull-xs-right hidden-sm-up" type="button" data-toggle="collapse" data-target="#bd-main-nav" aria-controls="bd-main-nav" aria-expanded="false" aria-label="Toggle navigation">
-          &#9776;
-        </button>
-        <a class="navbar-brand hidden-sm-up" href="{{ site.baseurl }}/">
         Bootstrap Material Design
       </a>
+      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#bd-main-nav" aria-controls="bd-main-nav" aria-expanded="false" aria-label="Toggle navigation">
+        <span class="navbar-toggler-icon"></span>
+      </button>
     </div>
     <div class="collapse navbar-toggleable-xs" id="bd-main-nav">
       <ul class="nav navbar-nav">
@@ -48,6 +47,9 @@
         <li class="nav-item">
           <a class="nav-item nav-link" href="{{ site.mkp }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Material Kit Pro');">Material Kit Pro</a>
         </li>
+        <li class="nav-item">
+          <a class="nav-item nav-link" href="{{ site.mdp }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Material Kit Pro');">Material Dashboard Pro</a>
+        </li>
         <!--
         <li class="nav-item">
           <a class="nav-item nav-link" href="{{ site.expo }}" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Expo');">Expo</a>
@@ -58,6 +60,5 @@
         -->
       </ul>
     </div>
-    </nav>
   </div>
 </header>

docs/assets/scss/_ads.scss

@@ -10,7 +10,7 @@
   width: auto !important;
   height: auto !important;
   padding: 1.25rem !important;
-  margin: 2rem ($grid-gutter-width * -1) -2rem !important;
+  margin: 2rem ($grid-gutter-width-base * -1) -2rem !important;
   overflow: hidden; // clearfix
   font-family: inherit !important;
   font-size: .8rem !important;

docs/assets/scss/_component-examples.scss

@@ -326,7 +326,7 @@
 
 .highlight {
   padding: 1rem;
-  margin: 1rem (-$grid-gutter-width / 2);
+  margin: 1rem (-$grid-gutter-width-base / 2);
   background-color: #f7f7f9;
 
   @include media-breakpoint-up(sm) {

docs/assets/scss/_featurettes.scss

@@ -28,10 +28,10 @@
 
   @include media-breakpoint-up(md) {
     .col-sm-6:first-child {
-      padding-right: ($grid-gutter-width * 1.5);
+      padding-right: ($grid-gutter-width-base * 1.5);
     };
     .col-sm-6:last-child {
-      padding-left: ($grid-gutter-width * 1.5);
+      padding-left: ($grid-gutter-width-base * 1.5);
     }
   }
 }

docs/assets/scss/_masthead.scss

@@ -4,7 +4,7 @@
 
 .bd-masthead {
   position: relative;
-  padding: 3rem ($grid-gutter-width / 2) 2rem;
+  padding: 3rem ($grid-gutter-width-base / 2) 2rem;
   color: $bd-purple-light;
   text-align: center;
   background-image: linear-gradient(135deg, darken($bd-purple, 20%), $bd-purple, lighten(saturate($bd-purple, 5%), 15%));

docs/assets/scss/_page-header.scss

@@ -3,7 +3,7 @@
 // scss-lint:disable ImportantRule
 
 .bd-pageheader {
-  padding: 2rem ($grid-gutter-width / 2);
+  padding: 2rem ($grid-gutter-width-base / 2);
   margin-bottom: 1.5rem;
   color: $bd-purple-light;
   text-align: center;

docs/assets/scss/bmd/_ads.scss

@@ -13,7 +13,7 @@
   width: auto !important;
   height: auto !important;
   padding: 1.25rem !important;
-  margin: 2rem ($grid-gutter-width * -1) -2rem !important;
+  margin: 2rem ($grid-gutter-width-base * -1) -2rem !important;
   overflow: hidden; // clearfix
   font-family: inherit !important;
   font-size: .8rem !important;

docs/components/dropdowns.md

@@ -48,7 +48,7 @@ And with `<a>` elements:
 
 {% example html %}
 <div class="dropdown open">
-  <a class="btn btn-secondary dropdown-toggle" href="http://example.com" id="dropdownMenuLink" data-target="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+  <a class="btn btn-secondary dropdown-toggle" href="http://example.com" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
     Dropdown link
   </a>
 
@@ -512,20 +512,6 @@ Add `data-toggle="dropdown"` to a link or button to toggle a dropdown.
 </div>
 {% endhighlight %}
 
-To keep URLs intact with link buttons, use the `data-target` attribute instead of `href="#"`.
-
-{% highlight html %}
-<div class="dropdown">
-  <a id="dLabel" data-target="#" href="http://example.com" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-    Dropdown trigger
-  </a>
-
-  <div class="dropdown-menu" aria-labelledby="dLabel">
-    ...
-  </div>
-</div>
-{% endhighlight %}
-
 ### Via JavaScript
 
 Call the dropdowns via JavaScript:

gulpfile.babel.js

@@ -61,7 +61,7 @@ const rollupConfig = {
 const preset = Preset.baseline()
 
 const copyJsToDocs = new Copy(gulp, preset, {
-  task: {name: 'dist:js->docs'},
+  task: {name: 'dist:js-docs'},
   source: {
     options: {cwd: 'dist'},
     glob: ['*.iife*.js']
@@ -70,7 +70,7 @@ const copyJsToDocs = new Copy(gulp, preset, {
 })
 
 const copyCssToDocs = new Copy(gulp, preset, {
-  task: {name: 'dist:css->docs'},
+  task: {name: 'dist:css-docs'},
   source: {
     options: {cwd: 'dist'},
     glob: ['*.css']
@@ -159,4 +159,3 @@ new Aggregate(gulp, 'publish',
     })
   )
 )
-

package.json

@@ -18,6 +18,7 @@
   "homepage": "https://github.com/FezVrasta/bootstrap-material-design",
   "author": "Federico Zivolo",
   "scripts": {
+    "gulp": "gulp",
     "test": "grunt test"
   },
   "style": "dist/css/bootstrap-material-design.css",
@@ -39,6 +40,7 @@
     "babel-core": "^6.11.4",
     "babel-eslint": ">=6.1.2",
     "babel-preset-es2015": "6.9.0",
+    "babel-register": "^6.24.0",
     "bootstrap": "twbs/bootstrap#v4-dev",
     "extend": "^3.0.0",
     "gulp": "github:gulpjs/gulp#4.0",

scss/_core-bootstrap.scss

@@ -25,7 +25,7 @@
 
 
 // Reset and dependencies
-@import "bootstrap/scss/normalize";
+@import "bootstrap/scss/reboot";
 @import "bootstrap/scss/print";
 
 // Core CSS
@@ -39,7 +39,6 @@
 @import "bootstrap/scss/buttons";
 
 // Components
-@import "bootstrap/scss/animation";
 @import "bootstrap/scss/dropdown";
 @import "bootstrap/scss/button-group";
 @import "bootstrap/scss/input-group";
@@ -49,7 +48,6 @@
 @import "bootstrap/scss/card";
 @import "bootstrap/scss/breadcrumb";
 @import "bootstrap/scss/pagination";
-@import "bootstrap/scss/tags";
 @import "bootstrap/scss/jumbotron";
 @import "bootstrap/scss/alert";
 @import "bootstrap/scss/progress";

scss/_custom.scss

@@ -0,0 +1,4 @@
+// Bootstrap overrides
+//
+// Copy variables from `_variables.scss` to this file to override default values
+// without modifying source files.