Merge pull request thomaspark#1027 from XhmikosR/grunt-html

Add grunt-html for HTML validation

.github/workflows/ci.yml

@@ -26,6 +26,8 @@ jobs:
             ${{ runner.OS }}-node-v${{ env.NODE }}-${{ hashFiles('package.json') }}-${{ hashFiles('package-lock.json') }}
             ${{ runner.OS }}-node-v${{ env.NODE }}-
 
+      - run: java -version
+
       - name: Install npm dependencies
         run: npm ci
 
@@ -34,3 +36,6 @@ jobs:
 
       - name: Run tests
         run: npm test
+
+      - name: Run vnu.jar tests
+        run: npm run htmllint

Gruntfile.js

@@ -51,6 +51,7 @@ module.exports = grunt => {
   grunt.loadNpmTasks('grunt-contrib-cssmin');
   grunt.loadNpmTasks('grunt-contrib-watch');
   grunt.loadNpmTasks('grunt-sass');
+  grunt.loadNpmTasks('grunt-html');
 
   // Force use of Unix newlines
   grunt.util.linefeed = '\n';
@@ -148,6 +149,21 @@ module.exports = grunt => {
         dest: ''
       }
     },
+    htmllint: {
+      options: {
+        ignore: [
+          /Attribute “autocomplete” is only allowed when the input type is.*/,
+          /Attribute “autocomplete” not allowed on element “button” at this point./,
+          /Bad value “” for attribute “action” on element “form”./
+        ]
+      },
+      src: [
+        'docs/**/*.html',
+        '!docs/**/bower_components/**/*.html',
+        '!docs/_vendor/**/*.html',
+        '!docs/2/**/*.html'
+      ]
+    },
     connect: {
       options: {
         hostname: 'localhost',
@@ -238,6 +254,7 @@ module.exports = grunt => {
   });
 
   grunt.registerTask('vendor', 'copy:vendor');
+
   grunt.registerTask('docs-css', ['sass:docs', 'postcss:docs']);
 
   grunt.registerTask('server', 'connect:keepalive');

docs/2/css/bootswatch.css

@@ -25,6 +25,11 @@ section {
 	margin-bottom: 15px;
 }
 
+iframe {
+  overflow: hidden;
+  border: none;
+}
+
 #social {
 	display: inline-block;
 	margin-top: 45px;

docs/2/index.html

@@ -90,8 +90,8 @@ <h1>Bootswatch</h1>
 
     <div id="social">
       <span>
-        <iframe id="gh-fork" src="https://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=fork" allowtransparency="true" frameborder="0" scrolling="0" width="53" height="20"></iframe>
-        <iframe id="gh-star" src="https://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="110" height="20"></iframe>
+        <iframe id="gh-fork" src="https://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=fork" width="53" height="20"></iframe>
+        <iframe id="gh-star" src="https://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=watch&count=true" width="110" height="20"></iframe>
       </span>
       <span>
         <a href="https://twitter.com/thomashpark" class="twitter-follow-button" data-show-count="false" data-show-screen-name="true">Follow @thomashpark</a>

docs/3/assets/less/custom.less

@@ -7,6 +7,11 @@ body {
   }
 }
 
+iframe {
+  overflow: hidden;
+  border: none;
+}
+
 @media (min-width: 768px) {
   body {
     > .navbar-transparent {

docs/3/help/index.html

@@ -160,9 +160,9 @@ <h1 id="tools">Tools</h1>
             <h1 id="support">Support</h1>
             <p>Show your support for Bootswatch by buying official gear.</p>
             <p>T-shirts based on several themes including Cyborg, Flatly, and Slate are available at <a href="https://shop.spreadshirt.com/bootswatch/">Spreadshirt</a>.</p>
-            <p><a href="https://shop.spreadshirt.com/bootswatch/"><img src="../assets/img/tshirt.jpg"></a></p>
+            <p><a href="https://shop.spreadshirt.com/bootswatch/"><img src="../assets/img/tshirt.jpg" alt="Bootswatch T-shirt"></a></p>
             <p>Stickers are available at <a href="https://www.stickermule.com/marketplace/1959-bootswatch">Sticker Mule</a>.</p>
-            <p><a href="https://www.stickermule.com/marketplace/1959-bootswatch"><img src="../assets/img/stickers.jpg"></a></p>
+            <p><a href="https://www.stickermule.com/marketplace/1959-bootswatch"><img src="../assets/img/stickers.jpg" alt="Bootswatch Stickers"></a></p>
             <p>Donations are also accepted via <a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=PU2DH4BMF9MWS&source=url">PayPal</a>.</p>
 
         </div>

docs/3/index.html

@@ -33,7 +33,7 @@
     <div class="navbar navbar-default navbar-fixed-top navbar-transparent">
       <div class="container">
         <div class="navbar-header">
-          <a href="./" class="navbar-brand"><img src="assets/img/logo-nav.png">Bootswatch</a>
+          <a href="./" class="navbar-brand"><img src="assets/img/logo-nav.png" alt="">Bootswatch</a>
           <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main">
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -91,8 +91,8 @@
             <h1>Free themes for Bootstrap</h1>
             <div id="social">
               <span>
-                <iframe id="gh-fork" src="https://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=fork" allowtransparency="true" frameborder="0" scrolling="0" width="53" height="20"></iframe>
-                <iframe id="gh-star" src="https://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="110" height="20"></iframe>
+                <iframe id="gh-fork" src="https://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=fork" width="53" height="20"></iframe>
+                <iframe id="gh-star" src="https://ghbtns.com/github-btn.html?user=thomaspark&repo=bootswatch&type=watch&count=true" width="110" height="20"></iframe>
               </span>
               <span style="display: inline-block; width: 210px;">
                 <a href="https://twitter.com/bootswatch" class="twitter-follow-button" data-show-count="false" data-show-screen-name="true"></a>

docs/3/tests/components.html

@@ -854,7 +854,7 @@ <h4>Icons, labels, and input groups</h4>
         </div>
 
         <div class="bs-example">
-          <form role="form">
+          <form>
             <div class="form-group has-success has-feedback">
               <label class="control-label" for="inputSuccess2">Input with success</label>
               <input type="text" class="form-control" id="inputSuccess2">
@@ -1725,7 +1725,7 @@ <h3 id="navbar-forms">Forms</h3>
 
           <div class="navbar navbar-default">
             <form class="navbar-form navbar-left">
-              <select name="" class="form-control" style="width: 200px;">
+              <select class="form-control" style="width: 200px;">
                 <option value="1">1</option>
                 <option value="2">2</option>
                 <option value="3">3</option>
@@ -2865,7 +2865,7 @@ <h1 id="popovers">Popovers</h1>
       ================================================== -->
       <div class="bs-docs-section">
         <div class="page-header">
-          <h1 id="popovers">Checkbox / Radio</h1>
+          <h1 id="checkbox-radio">Checkbox / Radio</h1>
         </div>
         <div class="bs-example" style="padding-bottom: 24px;">
           <div class="btn-group" data-toggle="buttons">

docs/_assets/scss/custom.scss

@@ -9,6 +9,7 @@ pre {
 }
 
 iframe {
+  overflow: hidden;
   border: none;
 }