Merge branch 'master' into issues/3094

Author: montogeek

.gitignore

@@ -10,4 +10,5 @@ yarn-error.log
 package-lock.json
 .cache
 internal-links.tap
-stats.json
+stats.json
+printable.md

package.json

@@ -25,30 +25,34 @@
   },
   "scripts": {
     "clean-dist": "rimraf ./dist",
-    "clean": "npm run clean-dist && rimraf src/content/**/_*.md src/**/_*.json",
+    "clean-printable": "rimraf src/content/**/printable.md",
+    "preclean": "run-s clean-dist clean-printable",
+    "clean": "rimraf src/content/**/_*.md src/**/_*.json",
     "start": "npm run clean-dist && cross-env NODE_ENV=development webpack-dev-server --config webpack.dev.js --env.dev",
     "update-repos": "node src/utilities/fetch-package-repos.js",
     "content": "node src/scripts/build-content-tree.js ./src/content ./src/_content.json",
-    "build-test": "npm run build && http-server dist/",
-    "bundle-analyze": "run-s clean fetch content && cross-env NODE_ENV=production webpack --config webpack.ssg.js && cross-env NODE_ENV=production webpack --config webpack.prod.js  --profile --json > stats.json && webpack-bundle-analyzer stats.json",
+    "bundle-analyze": "run-s clean fetch printable content && cross-env NODE_ENV=production webpack --config webpack.ssg.js && run-s clean-printable content && cross-env NODE_ENV=production webpack --config webpack.prod.js  --profile --json > stats.json && webpack-bundle-analyzer stats.json",
     "fetch": "run-p fetch:*",
     "fetch:readmes": "node src/utilities/fetch-package-readmes.js",
     "fetch:supporters": "node src/utilities/fetch-supporters.js",
     "fetch:starter-kits": "node src/utilities/fetch-starter-kits.js",
     "prebuild": "npm run clean",
-    "build": "run-s fetch content && cross-env NODE_ENV=production webpack --config webpack.ssg.js && cross-env NODE_ENV=production webpack --config webpack.prod.js",
+    "build": "run-s fetch printable content && cross-env NODE_ENV=production webpack --config webpack.ssg.js && run-s clean-printable content && cross-env NODE_ENV=production webpack --config webpack.prod.js",
     "postbuild": "bundlesize && npm run sitemap",
+    "build-test": "npm run build && http-server dist/",
     "test": "npm run lint",
     "lint": "run-s lint:*",
     "lint:js": "eslint src --ext .js,.jsx,.md --cache true --cache-location .cache/.eslintcache",
     "lint:markdown": "markdownlint --rules markdownlint-rule-emphasis-style --config ./.markdownlint.json *.md ./src/content/**/*.md --ignore './src/content/**/_*.md'",
     "lint:social": "alex . -q",
     "lint:prose": "cp .proselintrc ~/ && proselint src/content",
-    "lint:links": "hyperlink -r dist/index.html --canonicalroot https://webpack.js.org/ -i --todo https://img.shields.io --todo https://codecov.io/gh --todo 'content-type-mismatch https://travis-ci.org' --todo 'Asset is used as both Html and Image' | tee internal-links.tap | tap-spot",
+    "lint:links": "hyperlink -c 8 -r dist/index.html --canonicalroot https://webpack.js.org/ -i --todo https://img.shields.io --todo https://codecov.io/gh --todo 'content-type-mismatch https://travis-ci.org' --todo 'Asset is used as both Html and Image' | tee internal-links.tap | tap-spot",
     "linkcheck": "hyperlink -r dist/index.html --canonicalroot https://webpack.js.org/ --skip support__ --skip sidecar.gitter.im --skip vimdoc.sourceforge.net --skip img.shields.io --skip npmjs.com/package/ --skip opencollective.com/webpack --todo external-redirect | tee external-links.tap | tap-spot",
-    "sitemap": "cd dist && sitemap-static --pretty --prefix=https://webpack.js.org/ > sitemap.xml",
+    "sitemap": "cd dist && sitemap-static --ignore-file=../sitemap-ignore.json --pretty --prefix=https://webpack.js.org/ > sitemap.xml",
     "serve": "npm run build && sirv start ./dist --port 4000",
-    "deploy": "gh-pages -d dist"
+    "deploy": "gh-pages -d dist",
+    "preprintable": "npm run clean-printable",
+    "printable": "node ./src/scripts/concatenate-docs.js"
   },
   "husky": {
     "hooks": {

sitemap-ignore.json

@@ -0,0 +1,4 @@
+[
+	"app-shell/index.html",
+	"appcache/manifest.html"
+]

src/assets/icon-print.svg

@@ -1,6 +1,12 @@
 @import 'functions';
 @import 'mixins';
 
+.contributors__section {
+  @media print {
+    display: none;
+  }
+}
+
 .contributors__list {
   font-size: 14px;
   margin-left: -0.5em;

src/components/Contributors/Contributors.scss

@@ -88,22 +88,16 @@ export default class Cube extends React.Component {
       let degrees = 0;
       let axis = 'y';
 
-      let lastTime = performance.now();
       let animation = () => {
-        let nowTime = performance.now();
-        let deltaTime = nowTime - lastTime;
-
-        if (repeatDelay <= deltaTime) {
-          let obj = {};
-          obj[axis] = degrees += 90;
+        let obj = {};
+        obj[axis] = degrees += 90;
+        this.setState({ ...obj, iteration: (this.state.iteration + 1) % 4 });
+        tick();
+      };
 
-          this.setState({ ...obj, iteration: (this.state.iteration + 1) % 4 });
-          lastTime = performance.now();
-        }
+      let tick = () => setTimeout(() => requestAnimationFrame(animation), repeatDelay);
 
-        this._requestAnimation = requestAnimationFrame(animation);
-      };
-      animation();
+      this._timeout = tick();
     }
   }
 
@@ -115,7 +109,7 @@ export default class Cube extends React.Component {
       this.container.removeEventListener('mouseleave', this._reset);
 
     } else if (continuous) {
-      cancelAnimationFrame(this._requestAnimation);
+      clearTimeout(this._timeout);
     }
   }
 

src/components/Cube/Cube.jsx

@@ -10,6 +10,10 @@
   @include break {
     right: 1.5em;
   }
+
+  @media print {
+    display: none;
+  }
 }
 
 .gitter__button {

src/components/Gitter/Gitter.scss

@@ -5,6 +5,10 @@
   color: getColor(white);
   background: getColor(emperor);
 
+  @media print {
+    display: none;
+  }
+
   a {
     color: getColor(malibu);
 

src/components/NotificationBar/NotificationBar.scss

@@ -77,7 +77,7 @@ class Page extends React.Component {
           {contentRender}
 
           {loadRelated && (
-            <div>
+            <div className="related__section">
               <hr />
               <h3>Further Reading</h3>
               <ul>
@@ -91,7 +91,7 @@ class Page extends React.Component {
           )}
 
           {loadContributors && (
-            <div>
+            <div className="contributors__section">
               <hr />
               <h3>Contributors</h3>
               <Contributors contributors={contributors} />

src/components/Page/Page.jsx

@@ -9,6 +9,13 @@
 
   @include break {
     flex: 3;
-    padding: 1.5em;
+    // page links not fitting in 768+ resolutions with long headings
+    padding: 2em 1.5em 1.5em;
+  }
+
+  .related__section {
+    @media print {
+      display: none;
+    }
   }
 }