From f87a4d416df09828a3f123ee011d2c3f96334d7c Mon Sep 17 00:00:00 2001 From: Tanner Date: Fri, 5 Nov 2021 21:43:46 -0700 Subject: [PATCH 01/17] Add clean-css as a dev dependency --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 98e9a9a..88240f9 100644 --- a/package.json +++ b/package.json @@ -66,6 +66,7 @@ ], "devDependencies": { "autoprefixer": "^10.3.7", + "clean-css": "^5.2.2", "cypress": "^6.9.1", "git-branch-is": "^4.0.0", "is-git-status-clean": "^1.0.0", From 263f9dfabab0ed743c820f0fdcfc3078e95984b7 Mon Sep 17 00:00:00 2001 From: Tanner Date: Fri, 5 Nov 2021 21:44:27 -0700 Subject: [PATCH 02/17] Add build:minify command to package.json --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index 88240f9..d570aa4 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "build:errors-and-warnings": "sass --no-source-map src/checka11y.scss ./checka11y.css --style=compressed && sass --no-source-map ./checka11y.css ./checka11y.css --style=expanded && npx postcss checka11y.css --use autoprefixer --replace --no-map", "build:errors-only": "sass --no-source-map src/errors/checka11y-errors.scss ./checka11y-errors.css --style=compressed && sass --no-source-map ./checka11y-errors.css ./checka11y-errors.css --style=expanded && npx postcss checka11y-errors.css --use autoprefixer --replace --no-map", "build:warnings-only": "sass --no-source-map src/warnings/checka11y-warnings.scss ./checka11y-warnings.css --style=compressed && sass --no-source-map ./checka11y-warnings.css ./checka11y-warnings.css --style=expanded && npx postcss checka11y-warnings.css --use autoprefixer --replace --no-map", + "build:minify": "npm run build && node minify.js", "lint:check": "stylelint \"**/*.scss\" --max-warnings=0 --ignore-path .gitignore", "lint:fix": "stylelint \"**/*.scss\" --max-warnings=0 --ignore-path .gitignore --fix", "test": "cypress run --headless", From 80d0cbc0b81478836c322eba1e131059c54cd17f Mon Sep 17 00:00:00 2001 From: Tanner Date: Fri, 5 Nov 2021 21:45:07 -0700 Subject: [PATCH 03/17] Add minify.js to handle minifying stylesheets --- minify.js | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) create mode 100644 minify.js diff --git a/minify.js b/minify.js new file mode 100644 index 0000000..fdabafb --- /dev/null +++ b/minify.js @@ -0,0 +1,25 @@ +const fs = require("fs"); +const CleanCSS = require("clean-css"); +const stylesheets = ["checka11y.css", "checka11y-errors.css", "checka11y-warnings.css"]; + +console.log("Running clean-css!"); +stylesheets.forEach(filename => { + let minifiedFile = `${filename.slice(0, -4)}-minified.css`; + console.log(`Generating ${minifiedFile}`); + fs.readFile(`./${filename}`, "utf8", (err, data) => { + if (err) { + console.error(err); + return; + } + + // todo: replace {} with config options if we want (e.g use beautify or other formatting options) + // https://www.npmjs.com/package/clean-css#formatting-options + let styles = new CleanCSS({}).minify(data).styles; + fs.writeFile(`./${minifiedFile}`, styles, (err) => { + if (err) { + console.error(err); + return; + } + }); + }); +}); From 6560d92c9bde59d53a540bbaca75c408383907e1 Mon Sep 17 00:00:00 2001 From: Tanner Date: Fri, 5 Nov 2021 21:45:38 -0700 Subject: [PATCH 04/17] Adds generated minified stylesheets --- checka11y-errors-minified.css | 1 + checka11y-minified.css | 1 + checka11y-warnings-minified.css | 1 + 3 files changed, 3 insertions(+) create mode 100644 checka11y-errors-minified.css create mode 100644 checka11y-minified.css create mode 100644 checka11y-warnings-minified.css diff --git a/checka11y-errors-minified.css b/checka11y-errors-minified.css new file mode 100644 index 0000000..cd3e809 --- /dev/null +++ b/checka11y-errors-minified.css @@ -0,0 +1 @@ +:root{--checka11y-text-error:#721c24;--checka11y-bg-error:#ffc6c6;--checka11y-border-error:#f00}:root{--checka11y-space:0.25rem;--checka11y-space-0:calc(var(--checka11y-space) * 0);--checka11y-space-2:calc(var(--checka11y-space) * 2);--checka11y-space-4:calc(var(--checka11y-space) * 4);--checka11y-space-6:calc(var(--checka11y-space) * 6)}button audio[controls]{border:.4rem solid;border-color:var(--checka11y-border-error);background-image:url('data:image/svg+xml;utf8,ERROR (E0000): Ensure that <audio controls> is not a child of <button>.');background-position:bottom center;background-repeat:no-repeat;min-width:550px;padding-bottom:80px}button button::after{display:block;font-size:1rem;font-family:verdana,geneva,tahoma,sans-serif;font-weight:700;font-style:initial;padding:var(--checka11y-space-4) var(--checka11y-space-6);border-radius:.75rem;letter-spacing:initial;text-decoration:none;text-transform:initial;text-shadow:none;content:"ERROR (E0000): Ensure that