HTML5 Boilerplate v6.0.1 update

BlowbackAgency · Sep 15, 2017 · af2ead2 · af2ead2
1 parent 44ed300
commit af2ead2
Show file tree

Hide file tree

Showing 23 changed files with 267 additions and 244 deletions.
diff --git a/.gitignore b/.gitignore
@@ -2,6 +2,5 @@
 \.*
 
 # except these git related...
-!.gitkeep
 !.gitignore
 !.gitattributes
diff --git a/apple-touch-icon.png b/apple-touch-icon.png
diff --git a/browserconfig.xml b/browserconfig.xml
diff --git a/crossdomain.xml b/crossdomain.xml
diff --git a/favicon.ico b/favicon.ico
diff --git a/humans.txt b/humans.txt
diff --git a/icon.png b/icon.png
diff --git a/robots.txt b/robots.txt
diff --git a/site-h5bp/templates/404.php b/site-h5bp/templates/404.php
@@ -1,5 +1,6 @@
+<?php namespace ProcessWire; ?>
 <!doctype html>
-<html lang="en">
+<html lang="">
 <head>
 	<meta charset="utf-8" />
 	<title><?php echo $page->title; ?></title>

diff --git a/site-h5bp/templates/basic-page.php b/site-h5bp/templates/basic-page.php
@@ -1,3 +1,4 @@
+<?php namespace ProcessWire; ?>
 <!doctype html>
 <html class="no-js" lang="">
 	<head>
@@ -7,34 +8,33 @@
 		<meta name="description" content="" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
 
-		<link rel="apple-touch-icon" href="<?php echo $config->urls->root; ?>apple-touch-icon.png" />
+		<link rel="manifest" href="site.webmanifest" />
+		<link rel="apple-touch-icon" href="<?php echo $config->urls->root; ?>icon.png" />
 		<!-- Place favicon.ico in the root directory -->
 
 		<link rel="stylesheet" href="<?php echo $config->urls->templates; ?>css/normalize.css" />
 		<link rel="stylesheet" href="<?php echo $config->urls->templates; ?>css/main.css" />
-		<script src="<?php echo $config->urls->templates; ?>js/vendor/modernizr-2.8.3.min.js"></script>
 	</head>
 	<body>
-		<!--[if lt IE 8]>
-			<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
+		<!--[if lte IE 9]>
+			<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
 		<![endif]-->
 
 		<!-- Add your site or application content here -->
 		<?php echo "{$page->body}\n"; ?>
 
-		<script src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
-		<script>window.jQuery || document.write('<script src="<?php echo $config->urls->templates; ?>js/vendor/jquery-1.12.0.min.js"><\/script>')</script>
+		<script src="<?php echo $config->urls->templates; ?>js/vendor/modernizr-3.5.0.min.js"></script>
+		<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
+		<script>window.jQuery || document.write('<script src="<?php echo $config->urls->templates; ?>js/vendor/jquery-3.2.1.min.js"><\/script>')</script>
 		<script src="<?php echo $config->urls->templates; ?>js/plugins.js"></script>
 		<script src="<?php echo $config->urls->templates; ?>js/main.js"></script>
 
-		<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
+		<!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
 		<script>
-			(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
-			function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
-			e=o.createElement(i);r=o.getElementsByTagName(i)[0];
-			e.src='https://www.google-analytics.com/analytics.js';
-			r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
-			ga('create','UA-XXXXX-X','auto');ga('send','pageview');
+				window.ga=function(){ga.q.push(arguments)};ga.q=[];ga.l=+new Date;
+				ga('create','UA-XXXXX-Y','auto');ga('send','pageview')
 		</script>
+		<script src="https://www.google-analytics.com/analytics.js" async defer></script>
+
 	</body>
 </html>
diff --git a/site-h5bp/templates/css/main.css b/site-h5bp/templates/css/main.css
@@ -1,4 +1,4 @@
-/*! HTML5 Boilerplate v5.3.0 | MIT License | https://html5boilerplate.com/ */
+/*! HTML5 Boilerplate v6.0.1 | MIT License | https://html5boilerplate.com/ */
 
 /*
  * What follows is the result of much research on cross-browser styling.
@@ -20,7 +20,9 @@ html {
  * Remove text-shadow in selection highlight:
  * https://twitter.com/miketaylr/status/12228805301
  *
- * These selection rule sets have to be separate.
+ * Vendor-prefixed and regular ::selection selectors cannot be combined:
+ * https://stackoverflow.com/a/16982510/7133471
+ *
  * Customize the background color to match your design.
  */
 
@@ -125,18 +127,25 @@ textarea {
 
 /*
  * Hide only visually, but have it available for screen readers:
- * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
+ * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
+ *
+ * 1. For long content, line feeds are not interpreted as spaces and small width
+ *    causes content to wrap 1 word per line:
+ *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
  */
 
 .visuallyhidden {
     border: 0;
     clip: rect(0 0 0 0);
+    -webkit-clip-path: inset(50%);
+    clip-path: inset(50%);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
+    white-space: nowrap; /* 1 */
 }
 
 /*
@@ -148,11 +157,14 @@ textarea {
 .visuallyhidden.focusable:active,
 .visuallyhidden.focusable:focus {
     clip: auto;
+    -webkit-clip-path: none;
+    clip-path: none;
     height: auto;
     margin: 0;
     overflow: visible;
     position: static;
     width: auto;
+    white-space: inherit;
 }
 
 /*
@@ -211,9 +223,7 @@ textarea {
 @media print {
     *,
     *:before,
-    *:after,
-    *:first-letter,
-    *:first-line {
+    *:after {
         background: transparent !important;
         color: #000 !important; /* Black prints faster:
                                    http://www.sanbeiji.com/archives/953 */
@@ -244,6 +254,9 @@ textarea {
         content: "";
     }
 
+    pre {
+        white-space: pre-wrap !important;
+    }
     pre,
     blockquote {
         border: 1px solid #999;
@@ -264,10 +277,6 @@ textarea {
         page-break-inside: avoid;
     }
 
-    img {
-        max-width: 100% !important;
-    }
-
     p,
     h2,
     h3 {