Merge branch 'master' into patch-1

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/pre-push

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn build && git add . && git commit --amend --no-edit

USERS.md

@@ -40,3 +40,4 @@ TEMPLATE:
 - https://farhamdani.com/ - **Farhamdani** (Freelancer & Nganggur Productive)
 - https://fmg3d.com/ - **Finn M Glas** (Aspiring Physicist, Software Developer)
 - https://abhinav031.github.io - **Abhinav Sriram** (Digital Artist, Hobbyist)
+- https://schnerring.net/ - **Michael Schnerring** (Software Engineer)

assets/css/main.css

@@ -133,6 +133,7 @@ code, kbd {
   border-radius: 5px;
   font-size: .9rem;
   font-weight: normal;
+  font-feature-settings: normal;
 
   code, kbd {
     background: transparent;

package.json

@@ -6,7 +6,8 @@
   "license": "MIT",
   "scripts": {
     "dev": "webpack --mode=development --watch",
-    "build": "webpack --mode=production"
+    "build": "webpack --mode=production",
+    "prepare": "husky install"
   },
   "browserslist": [
     "last 2 versions",
@@ -24,35 +25,34 @@
     "browserslist": "^4.0.1",
     "clean-webpack-plugin": "^3.0.0",
     "clipboard": "^2.0.4",
-    "css-loader": "^4.2.2",
+    "css-loader": "^5.1.3",
-    "cssnano": "^4.1.8",
+    "cssnano": "^5.0.8",
     "eslint-config-airbnb": "^18.2.0",
-    "eslint-config-prettier": "^6.11.0",
+    "eslint-config-prettier": "^8.1.0",
     "eslint-plugin-jsx-a11y": "^6.2.1",
-    "extract-text-webpack-plugin": "^4.0.0-beta.0",
     "file-loader": "^6.1.0",
     "html-webpack-plugin": "^4.4.1",
-    "husky": "^4.2.5",
+    "husky": "^5.1.3",
-    "mini-css-extract-plugin": "^0.11.0",
+    "mini-css-extract-plugin": "^1.3.9",
     "postcss": "^8.2.10",
     "postcss-browser-reporter": "^0.6.0",
-    "postcss-cli": "^7.1.2",
+    "postcss-cli": "^8.3.1",
-    "postcss-import": "^12.0.1",
+    "postcss-color-function": "^4.0.1",
-    "postcss-loader": "^3.0.0",
+    "postcss-color-mod-function": "^3.0.3",
-    "postcss-mixins": "^6.2.1",
+    "postcss-import": "^14.0.0",
-    "postcss-nested": "^4.2.3",
+    "postcss-loader": "^5.2.0",
+    "postcss-mixins": "^7.0.3",
+    "postcss-nested": "^5.0.5",
     "postcss-preset-env": "^6.7.0",
-    "postcss-reporter": "^6.0.1",
+    "postcss-reporter": "^7.0.2",
-    "postcss-url": "^8.0.0",
+    "postcss-url": "^10.1.3",
-    "prettier": "^2.1.1",
     "prettier-eslint-cli": "^5.0.0",
-    "prettier-plugin-go-template": "^0.0.9",
     "ramda": "^0.27.1",
     "style-loader": "^1.2.1",
-    "uglifyjs-webpack-plugin": "^2.2.0",
+    "terser-webpack-plugin": "^5.2.4",
     "url-loader": "^4.1.0",
-    "webpack": "^4.29.3",
+    "webpack": "^5.27.1",
-    "webpack-cli": "^3.2.3"
+    "webpack-cli": "^4.5.0"
   },
   "husky": {
     "hooks": {

static/assets/main.js

@@ -1 +1 @@
-!function(n){var o={};function r(e){if(o[e])return o[e].exports;var t=o[e]={i:e,l:!1,exports:{}};return n[e].call(t.exports,t,t.exports,r),t.l=!0,t.exports}r.m=n,r.c=o,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(t,e){if(1&e&&(t=r(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)r.d(n,o,function(e){return t[e]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t,n){n(1),e.exports=n(2)},function(e,t){function n(){return window.matchMedia(l).matches}function o(){c&&c.classList.toggle("hidden",!n()),i&&i.classList.toggle("hidden",n()),u&&u.classList.toggle("hidden",!n())}var r=document.querySelector(".container"),i=document.querySelector(".menu"),c=document.querySelector(".menu-trigger"),d=(document.querySelector(".menu__inner--desktop"),document.querySelector(".menu__sub-inner-more-trigger")),u=document.querySelector(".menu__sub-inner-more"),l=getComputedStyle(document.body).getPropertyValue("--phoneWidth");i&&i.addEventListener("click",function(e){return e.stopPropagation()}),u&&u.addEventListener("click",function(e){return e.stopPropagation()}),o(),document.body.addEventListener("click",function(){n()||!u||u.classList.contains("hidden")?n()&&!i.classList.contains("hidden")&&i.classList.add("hidden"):u.classList.add("hidden")}),window.addEventListener("resize",o),c&&c.addEventListener("click",function(e){e.stopPropagation(),i&&i.classList.toggle("hidden")}),d&&d.addEventListener("click",function(e){e.stopPropagation(),u&&u.classList.toggle("hidden"),u&&u.getBoundingClientRect().right>r.getBoundingClientRect().right&&(u.style.left="auto",u.style.right=0)})},function(e,t){var n=window.localStorage&&window.localStorage.getItem("theme"),o=document.querySelector(".theme-toggle"),r="dark"===n;null!==n&&document.body.classList.toggle("dark-theme",r),o.addEventListener("click",function(){document.body.classList.toggle("dark-theme"),window.localStorage&&window.localStorage.setItem("theme",document.body.classList.contains("dark-theme")?"dark":"light")})}]);
+!function(){var e,t,n,o,i,d,c,s,r,a,l;e=document.querySelector(".container"),t=document.querySelector(".menu"),n=document.querySelector(".menu-trigger"),document.querySelector(".menu__inner--desktop"),o=document.querySelector(".menu__sub-inner-more-trigger"),i=document.querySelector(".menu__sub-inner-more"),d=getComputedStyle(document.body).getPropertyValue("--phoneWidth"),c=function(){return window.matchMedia(d).matches},s=function(){n&&n.classList.toggle("hidden",!c()),t&&t.classList.toggle("hidden",c()),i&&i.classList.toggle("hidden",!c())},t&&t.addEventListener("click",(function(e){return e.stopPropagation()})),i&&i.addEventListener("click",(function(e){return e.stopPropagation()})),s(),document.body.addEventListener("click",(function(){c()||!i||i.classList.contains("hidden")?c()&&!t.classList.contains("hidden")&&t.classList.add("hidden"):i.classList.add("hidden")})),window.addEventListener("resize",s),n&&n.addEventListener("click",(function(e){e.stopPropagation(),t&&t.classList.toggle("hidden")})),o&&o.addEventListener("click",(function(t){t.stopPropagation(),i&&i.classList.toggle("hidden"),i&&i.getBoundingClientRect().right>e.getBoundingClientRect().right&&(i.style.left="auto",i.style.right=0)})),r=window.localStorage&&window.localStorage.getItem("theme"),a=document.querySelector(".theme-toggle"),l="dark"===r,null!==r&&document.body.classList.toggle("dark-theme",l),a.addEventListener("click",(function(){document.body.classList.toggle("dark-theme"),window.localStorage&&window.localStorage.setItem("theme",document.body.classList.contains("dark-theme")?"dark":"light")}))}();

webpack.config.js

@@ -1,14 +1,12 @@
-const Webpack = require("webpack");
-const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 const { CleanWebpackPlugin } = require("clean-webpack-plugin");
-const HtmlWebpackPlugin = require("html-webpack-plugin");
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
-const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
+const TerserPlugin = require("terser-webpack-plugin");
 
 const path = require("path");
 
 const join = (...paths) => path.join(__dirname, ...paths);
 
-module.exports = (env, { mode, watch }) => ({
+module.exports = (env, { mode }) => ({
   resolve: {
     extensions: [".js", ".css"],
     modules: ["assets", "node_modules"],
@@ -23,7 +21,6 @@ module.exports = (env, { mode, watch }) => ({
     path: join("static/assets"),
     publicPath: "",
   },
-  watch,
   performance: {
     hints: false,
   },
@@ -40,25 +37,12 @@ module.exports = (env, { mode, watch }) => ({
         },
       },
       {
-        test: /\.(png|jpg|svg)$/,
+        test: /\.(png|jpg|woff|woff2|ttf|eot|svg)$/,
         use: [
           {
-            loader: "file-loader",
+            loader: "url-loader",
             options: {
-              name: "[name].[ext]",
+              limit: 8192,
-              outputPath: "images",
-            },
-          },
-        ],
-      },
-      {
-        test: /\.(woff|woff2|ttf|eot)$/,
-        use: [
-          {
-            loader: "file-loader",
-            options: {
-              name: "[name].[ext]",
-              outputPath: "fonts",
             },
           },
         ],
@@ -77,14 +61,7 @@ module.exports = (env, { mode, watch }) => ({
               importLoaders: 1,
             },
           },
-          {
+          "postcss-loader",
-            loader: "postcss-loader",
-            options: {
-              config: {
-                path: "postcss.config.js",
-              },
-            },
-          },
         ],
       },
     ],
@@ -94,21 +71,18 @@ module.exports = (env, { mode, watch }) => ({
       name: "vendor",
       minChunks: 2,
     },
+    minimize: true,
     minimizer: [
-      new UglifyJsPlugin({
+      new TerserPlugin({
-        sourceMap: true,
+        parallel: true,
+        extractComments: false,
       }),
     ],
   },
   plugins: [
     new CleanWebpackPlugin({
       cleanOnceBeforeBuildPatterns: [join("static/assets")],
-      cleanAfterEveryBuildPatterns: [
+      cleanAfterEveryBuildPatterns: ["!images/**/*", "!fonts/**/*", join("static/assets/style.js")],
-        "!images/**/*",
-        "!fonts/**/*",
-        // Remove unused file for a production build.
-        mode === "production" && join("static/assets/style.js"),
-      ],
       verbose: true,
     }),
     new MiniCssExtractPlugin({