fix(doc): externalized orange custom doc

docs.css surcharge in sass

Gruntfile.js

@@ -218,6 +218,10 @@ module.exports = function (grunt) {
           'bower_components/jquery.tablesorter/dist/js/jquery.tablesorter.js'
         ],
         dest: 'dist/js/<%= pkg.name %>.js'
+      },
+      docsOrange: {
+        src: ['docs/assets/css/docs.min.css', 'docs-orange/assets/css/docs-orange.min.css'],
+        dest: 'docs/assets/css/docs.min.css'
       }
       /* end mod */
     },
@@ -274,7 +278,9 @@ module.exports = function (grunt) {
             autoprefixer
           ]
         },
-        src: 'docs/assets/css/docs.min.css'
+        /* boosted mod */
+        src: ['docs/assets/css/docs.min.css', 'docs-orange/assets/css/docs-orange.min.css']
+        /* end mod */
       },
       examples: {
         options: {
@@ -334,6 +340,10 @@ module.exports = function (grunt) {
       docs: {
         src: 'docs/assets/css/src/docs.css',
         dest: 'docs/assets/css/src/docs.css'
+      },
+      docsOrange: {
+        src: 'docs-orange/assets/css/src/docs-orange.css',
+        dest: 'docs-orange/assets/css/src/docs-orange.css'
       }
     },
 
@@ -560,7 +570,9 @@ module.exports = function (grunt) {
   });
 
   // Docs task.
-  grunt.registerTask('docs-css', ['postcss:docs', 'postcss:examples', 'csscomb:docs', 'csscomb:examples', 'cssmin:docs']);
+  /* boosted mod */
+  grunt.registerTask('docs-css', ['postcss:docs', 'postcss:examples', 'csscomb:docs', 'csscomb:examples', 'csscomb:docsOrange', 'concat:docsOrange', 'cssmin:docs']);
+  /* end mod */
   grunt.registerTask('docs-js', ['uglify:docsJs']);
   grunt.registerTask('lint-docs-js', ['jscs:assets']);
   grunt.registerTask('docs', ['docs-css', 'docs-js', 'lint-docs-js', 'clean:docs', 'copy:docs']);

docs-orange/assets/css/docs-orange.min.css

@@ -0,0 +1,28 @@
+.bd-pageheader {
+  color: #fff;
+  background-color: #000;
+}
+
+.bd-pageheader h1 {
+  font-size: 5rem;
+}
+
+.bd-pageheader p {
+  font-size: 1.4rem;
+}
+
+@media (min-width: 768px) {
+  .bd-pageheader h1 {
+    font-size: 5rem;
+  }
+  .bd-pageheader p {
+    font-size: 1.4rem;
+  }
+}
+
+.bd-search .form-control {
+  height: auto;
+  padding-top: 0;
+  padding-bottom: 0;
+  background-color: transparent;
+}

docs-orange/assets/scss/docs-orange.scss

@@ -0,0 +1,76 @@
+@import '../../../scss/variables';
+@import '../../../scss/o-variables';
+@import '../../../scss/mixins';
+
+.bd-pageheader {
+  background-color: $brand-orange-black;
+  color: $brand-orange-white;
+  border-top: 2px solid $gray-dark;
+  padding-top: 6rem;
+  padding-bottom: 6rem;
+
+  @include media-breakpoint-up(md) {
+    h1 {
+      font-size: 5rem;
+    }
+
+    p {
+      font-size: 1.4rem;
+    }
+  }
+
+  h1 {
+    font-size: 5rem;
+  }
+
+  p {
+    font-size: 1.4rem;
+  }
+
+
+}
+
+.bd-search {
+
+  .form-control {
+    background-color: transparent;
+    height: auto;
+    padding-bottom: 0;
+    padding-top: 0;
+  }
+}
+
+.bd-navbar {
+  font-size: 1.8rem;
+  min-height: 6.8rem;
+  padding: 0;
+
+  @include media-breakpoint-down(sm) {
+    .nav-link {
+      float: none;
+
+      + .nav-link {
+        margin-left: 0;
+      }
+    }
+  }
+
+  .navbar-nav {
+    .nav-link {
+      color: $brand-orange-white;
+      margin-top: 2.8rem;
+      padding: 1rem;
+
+      &.active,
+      &:hover,
+      &:focus {
+        background-color: $brand-orange-black;
+        color: $brand-orange;
+      }
+    }
+  }
+
+  .dropdown-menu {
+    font-size: inherit;
+  }
+}

grunt/bs-sass-compile/libsass.js

@@ -25,7 +25,10 @@ module.exports = function configureLibsass(grunt) {
       },
       docs: {
         files: {
-          'docs/assets/css/docs.min.css': 'docs/assets/scss/docs.scss'
+          'docs/assets/css/docs.min.css': 'docs/assets/scss/docs.scss',
+          /* boosted mod */
+          'docs-orange/assets/css/docs-orange.min.css': 'docs-orange/assets/scss/docs-orange.scss'
+          /* end mod */
         }
       }
     }