Merge pull request #115 from wfp/release-v0.12.0

Release v0.12.0

Fix #113 
Fix #87

Author: Matthew Morek

dist/css/bootstrap-theme.css

@@ -3,7 +3,7 @@ title: "WFP UI Guidelines"
 email: "me@matthewmorek.com"
 description: ""
 url: "https://cdn.wfp.org" # WFP CDN
-version: "v0.11.0"
+version: "v0.12.0"
 quiet: true
 
 exclude: ["*.sublime-*", "*.sh", "*.yml", "*.DS_*"]

dist/css/wfpui+grid.css

@@ -1,4 +1,3 @@
 // Mixins
 // Project: WFPUI Guide
-// Author: Matthew Morek (me@matthewmorek.com)
-// URL: http://matthewmorek.com
+

dist/css/wfpui.css

@@ -1,4 +1,4 @@
 // Project Variables
 // Project: WFPUI Guide
-// Author: Matthew Morek (me@matthewmorek.com)
-// URL: http://matthewmorek.com
+
+

docs/_config.yml

@@ -4,9 +4,7 @@
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-
-    <title>Theme Template for Bootstrap</title>
-
+    <title>WFP UI Bootstrap Theme</title>
     <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
     <link rel="shortcut icon" href="http://cdn.wfp.org/favicon.ico">
     <link rel="stylesheet" href="http://cdn.wfp.org/libraries/webfonts/lato/lato.css">
@@ -58,7 +56,7 @@
 
       <!-- Main jumbotron for a primary marketing message or call to action -->
       <div class="jumbotron">
-        <h1>Theme example</h1>
+        <h1>Bootstrap Theme Example</h1>
         <p>This is a template showcasing the optional theme stylesheet included in Bootstrap. Use it as a starting point to create something more unique by building on or modifying it.</p>
       </div>
 

docs/_sass/_mixins.scss

@@ -62,12 +62,12 @@ <h2 class="menu--heading">Menu</h2>
 
     <section class="wfp-box">
 
-      <h1 id="home">Header One</h1>
-      <h2>Header Two</h2>
-      <h3>Header Three</h3>
-      <h4>Header Four</h4>
-      <h5>Header Five</h5>
-      <h6>Header Six</h6>
+      <h1 id="home">Header #1</h1>
+      <h2>Header #2</h2>
+      <h3>Header #3</h3>
+      <h4>Header #4</h4>
+      <h5>Header #5</h5>
+      <h6>Header #6</h6>
       <p>The Zero Hunger Challenge, launched by UN Secretary General Ban Ki-moon, encourages everyone - whether in government, business or civil society - to focus their energies on ending hunger in our lifetimes. By <a href="#">partnering with WFP</a> and supporting its work, major global companies such as Unilever, DSM and MasterCard have already started to do this, joining with governments and civil society in the quest for zero hunger.</p>
 
       <blockquote>The Zero Hunger Challenge, launched by UN Secretary General Ban Ki-moon, encourages everyone - whether in government, business or civil society - to focus their energies on ending hunger in our lifetimes. By partnering with WFP and supporting its work, major global companies such as Unilever, DSM and MasterCard have already started to do this, joining with governments and civil society in the quest for zero hunger.</blockquote>
@@ -270,14 +270,44 @@ <h2 class="section-title"><code>.wfp-seg-control</code></h2>
       </ul>
     </div>
 
-    <h2 class="section-title"><code>.wfp-breadcrumbs</code></h2>
+    <h2 class="section-title"><code>.wfp-breadcrumbs-light</code></h2>
 
     <div class="wfp-content-wrapper wfp-text-center">
-      <ul class="wfp-breadcrumbs">
-        <li class="breadcrumbs--item"><a href="#home" class="breadcrumbs--link home"><span class="icon-home-dark"></span><span>Home</span></a></li>
-        <li class="breadcrumbs--item"><a href="#email" class="breadcrumbs--link">Careers</a></li>
-        <li class="breadcrumbs--item"><span class="breadcrumbs--last">Internships</span></li>
-      </ul>
+      <nav class="wfp-breadcrumbs">
+        <ol class="breadcrumbs--wrapper">
+          <li class="breadcrumbs--item">
+            <a href="#home" class="breadcrumbs--link home">
+              <span class="icon-home-dark xsmall"></span><span>Home</span>
+            </a>
+          </li>
+          <li class="breadcrumbs--item">
+            <a href="#email" class="breadcrumbs--link">Careers</a>
+          </li>
+          <li class="breadcrumbs--item">
+            <span class="breadcrumbs--last">Internships</span>
+          </li>
+        </ol>
+      </nav>
+    </div>
+
+    <h2 class="section-title"><code>.wfp-breadcrumbs-dark</code></h2>
+
+    <div class="wfp-content-wrapper wfp-text-center">
+      <nav class="wfp-breadcrumbs--dark">
+        <ol class="breadcrumbs--wrapper">
+          <li class="breadcrumbs--item">
+            <a href="#home" class="breadcrumbs--link home">
+              <span class="icon-home-light xsmall"></span><span>Home</span>
+            </a>
+          </li>
+          <li class="breadcrumbs--item">
+            <a href="#email" class="breadcrumbs--link">Careers</a>
+          </li>
+          <li class="breadcrumbs--item">
+            <span class="breadcrumbs--last">Internships</span>
+          </li>
+        </ol>
+      </nav>
     </div>
 
     <h2 class="section-title"><code>.wfp-pagination</code></h2>

docs/_sass/_vars.scss

@@ -72,15 +72,17 @@ module.exports = function(grunt) {
       },
       docs: {
         files: {
-          'docs/css/main.css': 'docs/_sass/main.scss'
+          'docs/css/main.css': 'docs/_sass/main.scss',
+          'docs/css/bootstrap-theme.css': 'scss/bootstrap-theme.scss'
         }
       },
       docsDist: {
         options: {
           sourceMap: false
         },
         files: {
-          'docs/css/main.css': 'docs/_sass/main.scss'
+          'docs/css/main.css': 'docs/_sass/main.scss',
+          'docs/css/bootstrap-theme.css': 'scss/bootstrap-theme.scss'
         }
       }
     },
@@ -112,6 +114,12 @@ module.exports = function(grunt) {
         src: 'dist/css/*.css'
       },
       docs: {
+        options: {
+          processors: [
+            require('autoprefixer')({ browsers: ['last 2 version'] }),
+            require('pixrem')()
+          ]
+        },
         src: 'docs/css/*.css'
       },
       docsDist: {
@@ -280,9 +288,9 @@ module.exports = function(grunt) {
     htmlaudit: {
       default: {
         options: {
-          baseUri: 'http://cdn.wfp.org/guides/ui/v0.8.0/'
+          baseUri: 'http://cdn.wfp.org/guides/ui/v0.11.0/'
         },
-        src: './dist/docs/**/*.html'
+        src: './dist/docs/*.html'
       },
       ci: {
         options: {
@@ -297,9 +305,9 @@ module.exports = function(grunt) {
       }
     },
     copy: {
-      docs: {
-        src: './js/lib/responsive-nav.js',
-        dest: './docs/js/lib/responsive-nav.js'
+      docsJS: {
+        src: './dist/js/responsive-nav.min.js',
+        dest: './docs/js/lib/responsive-nav.min.js'
       }
     }
   });
@@ -324,11 +332,11 @@ module.exports = function(grunt) {
   // Build Grunticon Icons
   grunt.registerTask('gen-icons', ['clean:grunticon', 'grunticon']);
   // Build WFP UI Docs locally
-  grunt.registerTask('docs', ['sass:docs', 'postcss:docs', 'uglify:docs', 'jekyll']);
+  grunt.registerTask('docs', ['sass:docs', 'copy', 'postcss:docs', 'uglify:docs', 'jekyll']);
   // Build WFP UI Docs
-  grunt.registerTask('docs-build', ['sasslint', 'sass:docs', 'copy:docs', 'uglify:docs', 'postcss:docs', 'jekyll']);
+  grunt.registerTask('docs-build', ['sasslint', 'sass:docs', 'copy', 'uglify:docs', 'postcss:docs', 'jekyll']);
   // Build dist-ready WFP UI Docs
-  grunt.registerTask('docs-dist', ['sass:docsDist', 'copy:docs', 'postcss:docsDist', 'uglify:docs', 'jekyll']);
+  grunt.registerTask('docs-dist', ['sass:docsDist', 'copy', 'postcss:docsDist', 'uglify:docs', 'jekyll']);
   // Build WFP UI
   grunt.registerTask('build', ['eslint', 'sasslint', 'sass:dev', 'postcss:dev']);
   // Build a dist-ready WFP UI with all stati resources