From 4b84358b51c47746985ccfa40816424da6404ed2 Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Thu, 27 Jul 2023 13:35:06 +0100 Subject: [PATCH 01/10] Upgrade to `stylelint@15` with `stylelint-config-gds@1` See release notes: https://github.com/alphagov/stylelint-config-gds/blob/main/CHANGELOG.md#100 --- package-lock.json | 564 +++++++++++++++++++++++++++++++--------------- package.json | 4 +- 2 files changed, 380 insertions(+), 188 deletions(-) diff --git a/package-lock.json b/package-lock.json index f385601eb4..8d8be2b294 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,9 +14,6 @@ "shared/*", "docs/examples/*" ], - "dependencies": { - "@types/node": "^20.4.8" - }, "devDependencies": { "@babel/core": "^7.22.9", "@babel/preset-env": "^7.22.9", @@ -49,8 +46,8 @@ "postcss-scss": "^4.0.6", "prettier": "^3.0.0", "standard": "^17.1.0", - "stylelint": "^14.16.1", - "stylelint-config-gds": "^0.3.0", + "stylelint": "^15.10.2", + "stylelint-config-gds": "^1.0.0", "stylelint-order": "^6.0.3", "typescript": "^5.1.6" }, @@ -1945,20 +1942,90 @@ "@jridgewell/sourcemap-codec": "^1.4.10" } }, - "node_modules/@csstools/selector-specificity": { + "node_modules/@csstools/css-parser-algorithms": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.3.1.tgz", + "integrity": "sha512-xrvsmVUtefWMWQsGgFffqWSK03pZ1vfDki4IVIIUxxDKnGBzqNgv0A7SB1oXtVNEkcVO8xi1ZrTL29HhSu5kGA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "engines": { + "node": "^14 || ^16 || >=18" + }, + "peerDependencies": { + "@csstools/css-tokenizer": "^2.2.0" + } + }, + "node_modules/@csstools/css-tokenizer": { "version": "2.2.0", - "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-2.2.0.tgz", - "integrity": "sha512-+OJ9konv95ClSTOJCmMZqpd5+YGsB2S+x6w3E1oaM8UuR5j8nTNHYSz8c9BEPGDOCMQYIEEGlVPj/VY64iTbGw==", + "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.2.0.tgz", + "integrity": "sha512-wErmsWCbsmig8sQKkM6pFhr/oPha1bHfvxsUY5CYSQxwyhA9Ulrs8EqCgClhg4Tgg2XapVstGqSVcz0xOYizZA==", "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "engines": { + "node": "^14 || ^16 || >=18" + } + }, + "node_modules/@csstools/media-query-list-parser": { + "version": "2.1.4", + "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.1.4.tgz", + "integrity": "sha512-V/OUXYX91tAC1CDsiY+HotIcJR+vPtzrX8pCplCpT++i8ThZZsq5F5dzZh/bDM3WUOjrvC1ljed1oSJxMfjqhw==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], "engines": { "node": "^14 || ^16 || >=18" }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/csstools" + "peerDependencies": { + "@csstools/css-parser-algorithms": "^2.3.1", + "@csstools/css-tokenizer": "^2.2.0" + } + }, + "node_modules/@csstools/selector-specificity": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-3.0.0.tgz", + "integrity": "sha512-hBI9tfBtuPIi885ZsZ32IMEU/5nlZH/KOVYJCOh7gyMxaVLGmLedYqFN6Ui1LXkI8JlC8IsuC0rF0btcRZKd5g==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "engines": { + "node": "^14 || ^16 || >=18" }, "peerDependencies": { - "postcss-selector-parser": "^6.0.10" + "postcss-selector-parser": "^6.0.13" } }, "node_modules/@discoveryjs/json-ext": { @@ -4731,12 +4798,6 @@ "integrity": "sha512-OFwMPH5eJOhtwR92GMjTNWukaKTdWQC12cBgRvrTQl5CwhruSq6734wi1CTSh5Qjm/pMJWaKOOPKZOp6FpIkXQ==", "optional": true }, - "node_modules/@types/parse-json": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/@types/parse-json/-/parse-json-4.0.0.tgz", - "integrity": "sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==", - "dev": true - }, "node_modules/@types/qs": { "version": "6.9.7", "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.7.tgz", @@ -7314,29 +7375,45 @@ } }, "node_modules/camelcase-keys": { - "version": "6.2.2", - "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-6.2.2.tgz", - "integrity": "sha512-YrwaA0vEKazPBkn0ipTiMpSajYDSe+KjQfrjhcBMxJt/znbvlHd8Pw/Vamaz5EB4Wfhs3SUR3Z9mwRu/P3s3Yg==", + "version": "7.0.2", + "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-7.0.2.tgz", + "integrity": "sha512-Rjs1H+A9R+Ig+4E/9oyB66UC5Mj9Xq3N//vcLf2WzgdTi/3gUu3Z9KoqmlrEG4VuuLK8wJHofxzdQXz/knhiYg==", "dev": true, "dependencies": { - "camelcase": "^5.3.1", - "map-obj": "^4.0.0", - "quick-lru": "^4.0.1" + "camelcase": "^6.3.0", + "map-obj": "^4.1.0", + "quick-lru": "^5.1.1", + "type-fest": "^1.2.1" }, "engines": { - "node": ">=8" + "node": ">=12" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/camelcase-keys/node_modules/quick-lru": { - "version": "4.0.1", - "resolved": "https://registry.npmjs.org/quick-lru/-/quick-lru-4.0.1.tgz", - "integrity": "sha512-ARhCpm70fzdcvNQfPoy49IaanKkTlRWF2JMzqhcJbhSFRZv7nPTvZJdcY7301IPmvW+/p0RgIWnQDLJxifsQ7g==", + "node_modules/camelcase-keys/node_modules/camelcase": { + "version": "6.3.0", + "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz", + "integrity": "sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==", "dev": true, "engines": { - "node": ">=8" + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/camelcase-keys/node_modules/type-fest": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-1.4.0.tgz", + "integrity": "sha512-yGSza74xk0UG8k+pLh5oeoYirvIiWo5t0/o3zHHAO2tRDiZcxWP7fywNlXhqb6/r6sWvwi+RsyQMWhVLe4BVuA==", + "dev": true, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/caniuse-api": { @@ -17372,9 +17449,9 @@ } }, "node_modules/known-css-properties": { - "version": "0.26.0", - "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.26.0.tgz", - "integrity": "sha512-5FZRzrZzNTBruuurWpvZnvP9pum+fe0HcK8z/ooo+U+Hmp4vtbyp1/QDsqmufirXy4egGzbaH/y2uCZf+6W5Kg==", + "version": "0.27.0", + "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.27.0.tgz", + "integrity": "sha512-uMCj6+hZYDoffuvAJjFAPz56E9uoowFHmTkqRtRq5WyC5Q6Cu/fTZKNQpX/RbzChBYLLl3lo8CjFZBAZXq9qFg==", "dev": true }, "node_modules/last-run": { @@ -18659,24 +18736,36 @@ "dev": true }, "node_modules/meow": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/meow/-/meow-9.0.0.tgz", - "integrity": "sha512-+obSblOQmRhcyBt62furQqRAQpNyWXo8BuQ5bN7dG8wmwQ+vwHKp/rCFD4CrTP8CsDQD1sjoZ94K417XEUk8IQ==", + "version": "10.1.5", + "resolved": "https://registry.npmjs.org/meow/-/meow-10.1.5.tgz", + "integrity": "sha512-/d+PQ4GKmGvM9Bee/DPa8z3mXs/pkvJE2KEThngVNOqtmljC6K7NMPxtc2JeZYTmpWb9k/TmxjeL18ez3h7vCw==", "dev": true, "dependencies": { - "@types/minimist": "^1.2.0", - "camelcase-keys": "^6.2.2", - "decamelize": "^1.2.0", + "@types/minimist": "^1.2.2", + "camelcase-keys": "^7.0.0", + "decamelize": "^5.0.0", "decamelize-keys": "^1.1.0", "hard-rejection": "^2.1.0", "minimist-options": "4.1.0", - "normalize-package-data": "^3.0.0", - "read-pkg-up": "^7.0.1", - "redent": "^3.0.0", - "trim-newlines": "^3.0.0", - "type-fest": "^0.18.0", - "yargs-parser": "^20.2.3" + "normalize-package-data": "^3.0.2", + "read-pkg-up": "^8.0.0", + "redent": "^4.0.0", + "trim-newlines": "^4.0.2", + "type-fest": "^1.2.2", + "yargs-parser": "^20.2.9" }, + "engines": { + "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/meow/node_modules/decamelize": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-5.0.1.tgz", + "integrity": "sha512-VfxadyCECXgQlkoEAjeghAr5gY3Hf+IKjKb+X8tGVDtveCjN+USwprd2q3QXBR9T1+x2DG0XZF5/w+7HAtSaXA==", + "dev": true, "engines": { "node": ">=10" }, @@ -18685,9 +18774,9 @@ } }, "node_modules/meow/node_modules/type-fest": { - "version": "0.18.1", - "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.18.1.tgz", - "integrity": "sha512-OIAYXk8+ISY+qTOwkHtKqzAuxchoMiD9Udx+FSGQDuiRR+PJKJHc2NJAXlbhkGwTt/4/nKZxELY1w3ReWOL8mw==", + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-1.4.0.tgz", + "integrity": "sha512-yGSza74xk0UG8k+pLh5oeoYirvIiWo5t0/o3zHHAO2tRDiZcxWP7fywNlXhqb6/r6sWvwi+RsyQMWhVLe4BVuA==", "dev": true, "engines": { "node": ">=10" @@ -21909,80 +21998,108 @@ } }, "node_modules/read-pkg": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz", - "integrity": "sha512-Ug69mNOpfvKDAc2Q8DRpMjjzdtrnv9HcSMX+4VsZxD1aZ6ZzrIE7rlzXBtWTyhULSMKg076AW6WR5iZpD0JiOg==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-6.0.0.tgz", + "integrity": "sha512-X1Fu3dPuk/8ZLsMhEj5f4wFAF0DWoK7qhGJvgaijocXxBmSToKfbFtqbxMO7bVjNA1dmE5huAzjXj/ey86iw9Q==", "dev": true, "dependencies": { "@types/normalize-package-data": "^2.4.0", - "normalize-package-data": "^2.5.0", - "parse-json": "^5.0.0", - "type-fest": "^0.6.0" + "normalize-package-data": "^3.0.2", + "parse-json": "^5.2.0", + "type-fest": "^1.0.1" }, "engines": { - "node": ">=8" + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/read-pkg-up": { - "version": "7.0.1", - "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-7.0.1.tgz", - "integrity": "sha512-zK0TB7Xd6JpCLmlLmufqykGE+/TlOePD6qKClNW7hHDKFh/J7/7gCWGR7joEQEW1bKq3a3yUZSObOoWLFQ4ohg==", + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/read-pkg-up/-/read-pkg-up-8.0.0.tgz", + "integrity": "sha512-snVCqPczksT0HS2EC+SxUndvSzn6LRCwpfSvLrIfR5BKDQQZMaI6jPRC9dYvYFDRAuFEAnkwww8kBBNE/3VvzQ==", "dev": true, "dependencies": { - "find-up": "^4.1.0", - "read-pkg": "^5.2.0", - "type-fest": "^0.8.1" + "find-up": "^5.0.0", + "read-pkg": "^6.0.0", + "type-fest": "^1.0.1" }, "engines": { - "node": ">=8" + "node": ">=12" }, "funding": { "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/read-pkg-up/node_modules/type-fest": { - "version": "0.8.1", - "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.8.1.tgz", - "integrity": "sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA==", + "node_modules/read-pkg-up/node_modules/find-up": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", + "integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==", "dev": true, + "dependencies": { + "locate-path": "^6.0.0", + "path-exists": "^4.0.0" + }, "engines": { - "node": ">=8" + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/read-pkg/node_modules/hosted-git-info": { - "version": "2.8.9", - "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.9.tgz", - "integrity": "sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==", - "dev": true + "node_modules/read-pkg-up/node_modules/locate-path": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz", + "integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==", + "dev": true, + "dependencies": { + "p-locate": "^5.0.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } }, - "node_modules/read-pkg/node_modules/normalize-package-data": { - "version": "2.5.0", - "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.5.0.tgz", - "integrity": "sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==", + "node_modules/read-pkg-up/node_modules/p-locate": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz", + "integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==", "dev": true, "dependencies": { - "hosted-git-info": "^2.1.4", - "resolve": "^1.10.0", - "semver": "2 || 3 || 4 || 5", - "validate-npm-package-license": "^3.0.1" + "p-limit": "^3.0.2" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/read-pkg/node_modules/semver": { - "version": "5.7.2", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz", - "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==", + "node_modules/read-pkg-up/node_modules/type-fest": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-1.4.0.tgz", + "integrity": "sha512-yGSza74xk0UG8k+pLh5oeoYirvIiWo5t0/o3zHHAO2tRDiZcxWP7fywNlXhqb6/r6sWvwi+RsyQMWhVLe4BVuA==", "dev": true, - "bin": { - "semver": "bin/semver" + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/read-pkg/node_modules/type-fest": { - "version": "0.6.0", - "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.6.0.tgz", - "integrity": "sha512-q+MB8nYR1KDLrgr4G5yemftpMC7/QLqVndBmEEdqzmNj5dcFOO4Oo8qlwZE3ULT3+Zim1F8Kq4cBnikNhlCMlg==", + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-1.4.0.tgz", + "integrity": "sha512-yGSza74xk0UG8k+pLh5oeoYirvIiWo5t0/o3zHHAO2tRDiZcxWP7fywNlXhqb6/r6sWvwi+RsyQMWhVLe4BVuA==", "dev": true, "engines": { - "node": ">=8" + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/readable-stream": { @@ -22030,16 +22147,46 @@ } }, "node_modules/redent": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz", - "integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==", + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/redent/-/redent-4.0.0.tgz", + "integrity": "sha512-tYkDkVVtYkSVhuQ4zBgfvciymHaeuel+zFKXShfDnFP5SyVEP7qo70Rf1jTOTCx3vGNAbnEi/xFkcfQVMIBWag==", "dev": true, "dependencies": { - "indent-string": "^4.0.0", - "strip-indent": "^3.0.0" + "indent-string": "^5.0.0", + "strip-indent": "^4.0.0" }, "engines": { - "node": ">=8" + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/redent/node_modules/indent-string": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-5.0.0.tgz", + "integrity": "sha512-m6FAo/spmsW2Ab2fU35JTYwtOKa2yAwXSwgjSv1TJzh4Mh7mC3lzAOVLBprb72XsTrgkEIsl7YrFNAiDiRhIGg==", + "dev": true, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/redent/node_modules/strip-indent": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-4.0.0.tgz", + "integrity": "sha512-mnVSV2l+Zv6BLpSD/8V87CW/y9EmmbYzGCIavsnsI6/nwn26DwffM/yztm30Z/I2DY9wdS3vXVCMnHDgZaVNoA==", + "dev": true, + "dependencies": { + "min-indent": "^1.0.1" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/regenerate": { @@ -24745,55 +24892,57 @@ } }, "node_modules/stylelint": { - "version": "14.16.1", - "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-14.16.1.tgz", - "integrity": "sha512-ErlzR/T3hhbV+a925/gbfc3f3Fep9/bnspMiJPorfGEmcBbXdS+oo6LrVtoUZ/w9fqD6o6k7PtUlCOsCRdjX/A==", + "version": "15.10.2", + "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-15.10.2.tgz", + "integrity": "sha512-UxqSb3hB74g4DTO45QhUHkJMjKKU//lNUAOWyvPBVPZbCknJ5HjOWWZo+UDuhHa9FLeVdHBZXxu43eXkjyIPWg==", "dev": true, "dependencies": { - "@csstools/selector-specificity": "^2.0.2", + "@csstools/css-parser-algorithms": "^2.3.0", + "@csstools/css-tokenizer": "^2.1.1", + "@csstools/media-query-list-parser": "^2.1.2", + "@csstools/selector-specificity": "^3.0.0", "balanced-match": "^2.0.0", "colord": "^2.9.3", - "cosmiconfig": "^7.1.0", - "css-functions-list": "^3.1.0", + "cosmiconfig": "^8.2.0", + "css-functions-list": "^3.2.0", + "css-tree": "^2.3.1", "debug": "^4.3.4", - "fast-glob": "^3.2.12", + "fast-glob": "^3.3.0", "fastest-levenshtein": "^1.0.16", "file-entry-cache": "^6.0.1", "global-modules": "^2.0.0", "globby": "^11.1.0", "globjoin": "^0.1.4", - "html-tags": "^3.2.0", - "ignore": "^5.2.1", + "html-tags": "^3.3.1", + "ignore": "^5.2.4", "import-lazy": "^4.0.0", "imurmurhash": "^0.1.4", "is-plain-object": "^5.0.0", - "known-css-properties": "^0.26.0", + "known-css-properties": "^0.27.0", "mathml-tag-names": "^2.1.3", - "meow": "^9.0.0", + "meow": "^10.1.5", "micromatch": "^4.0.5", "normalize-path": "^3.0.0", "picocolors": "^1.0.0", - "postcss": "^8.4.19", - "postcss-media-query-parser": "^0.2.3", + "postcss": "^8.4.25", "postcss-resolve-nested-selector": "^0.1.1", "postcss-safe-parser": "^6.0.0", - "postcss-selector-parser": "^6.0.11", + "postcss-selector-parser": "^6.0.13", "postcss-value-parser": "^4.2.0", "resolve-from": "^5.0.0", "string-width": "^4.2.3", "strip-ansi": "^6.0.1", "style-search": "^0.1.0", - "supports-hyperlinks": "^2.3.0", + "supports-hyperlinks": "^3.0.0", "svg-tags": "^1.0.0", "table": "^6.8.1", - "v8-compile-cache": "^2.3.0", - "write-file-atomic": "^4.0.2" + "write-file-atomic": "^5.0.1" }, "bin": { - "stylelint": "bin/stylelint.js" + "stylelint": "bin/stylelint.mjs" }, "engines": { - "node": "^12.20.0 || ^14.13.1 || >=16.0.0" + "node": "^14.13.1 || >=16.0.0" }, "funding": { "type": "opencollective", @@ -24801,42 +24950,43 @@ } }, "node_modules/stylelint-config-gds": { - "version": "0.3.0", - "resolved": "https://registry.npmjs.org/stylelint-config-gds/-/stylelint-config-gds-0.3.0.tgz", - "integrity": "sha512-mZ0/C2JAneCrMbmBABJGIIczDR/jlacObBggU5j69bMK2TEwp3kwXDd2YZEPmVe1ayIbsZ/HPAV8khK3kfunWw==", + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-gds/-/stylelint-config-gds-1.0.0.tgz", + "integrity": "sha512-TlBxYdXLJtPcH0HhSlRmWv2sOgSTezYAiTwOOZ/qc3/hq4IJ1hoGKHalTGZaKK/K7iDcs4AU9NYw7MCYLR5GFw==", "dev": true, "dependencies": { - "stylelint-config-standard": "^29.0.0", - "stylelint-config-standard-scss": "^6.1.0" + "stylelint-config-standard": "^34.0.0", + "stylelint-config-standard-scss": "^10.0.0" }, "peerDependencies": { - "stylelint": "^14.14.0" + "stylelint": "^15.10.2" } }, - "node_modules/stylelint-config-gds/node_modules/stylelint-config-standard": { - "version": "29.0.0", - "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-29.0.0.tgz", - "integrity": "sha512-uy8tZLbfq6ZrXy4JKu3W+7lYLgRQBxYTUUB88vPgQ+ZzAxdrvcaSUW9hOMNLYBnwH+9Kkj19M2DHdZ4gKwI7tg==", + "node_modules/stylelint-config-recommended": { + "version": "13.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-13.0.0.tgz", + "integrity": "sha512-EH+yRj6h3GAe/fRiyaoO2F9l9Tgg50AOFhaszyfov9v6ayXJ1IkSHwTxd7lB48FmOeSGDPLjatjO11fJpmarkQ==", "dev": true, - "dependencies": { - "stylelint-config-recommended": "^9.0.0" + "engines": { + "node": "^14.13.1 || >=16.0.0" }, "peerDependencies": { - "stylelint": "^14.14.0" + "stylelint": "^15.10.0" } }, - "node_modules/stylelint-config-gds/node_modules/stylelint-config-standard-scss": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-6.1.0.tgz", - "integrity": "sha512-iZ2B5kQT2G3rUzx+437cEpdcnFOQkwnwqXuY8Z0QUwIHQVE8mnYChGAquyKFUKZRZ0pRnrciARlPaR1RBtPb0Q==", + "node_modules/stylelint-config-recommended-scss": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-12.0.0.tgz", + "integrity": "sha512-5Bb2mlGy6WLa30oNeKpZvavv2lowJUsUJO25+OA68GFTemlwd1zbFsL7q0bReKipOSU3sG47hKneZ6Nd+ctrFA==", "dev": true, "dependencies": { - "stylelint-config-recommended-scss": "^8.0.0", - "stylelint-config-standard": "^29.0.0" + "postcss-scss": "^4.0.6", + "stylelint-config-recommended": "^12.0.0", + "stylelint-scss": "^5.0.0" }, "peerDependencies": { "postcss": "^8.3.3", - "stylelint": "^14.14.0" + "stylelint": "^15.5.0" }, "peerDependenciesMeta": { "postcss": { @@ -24844,19 +24994,42 @@ } } }, - "node_modules/stylelint-config-gds/node_modules/stylelint-config-standard-scss/node_modules/stylelint-config-recommended-scss": { - "version": "8.0.0", - "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-8.0.0.tgz", - "integrity": "sha512-BxjxEzRaZoQb7Iinc3p92GS6zRdRAkIuEu2ZFLTxJK2e1AIcCb5B5MXY9KOXdGTnYFZ+KKx6R4Fv9zU6CtMYPQ==", + "node_modules/stylelint-config-recommended-scss/node_modules/stylelint-config-recommended": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-12.0.0.tgz", + "integrity": "sha512-x6x8QNARrGO2sG6iURkzqL+Dp+4bJorPMMRNPScdvaUK8PsynriOcMW7AFDKqkWAS5wbue/u8fUT/4ynzcmqdQ==", + "dev": true, + "peerDependencies": { + "stylelint": "^15.5.0" + } + }, + "node_modules/stylelint-config-standard": { + "version": "34.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-34.0.0.tgz", + "integrity": "sha512-u0VSZnVyW9VSryBG2LSO+OQTjN7zF9XJaAJRX/4EwkmU0R2jYwmBSN10acqZisDitS0CLiEiGjX7+Hrq8TAhfQ==", "dev": true, "dependencies": { - "postcss-scss": "^4.0.2", - "stylelint-config-recommended": "^9.0.0", - "stylelint-scss": "^4.0.0" + "stylelint-config-recommended": "^13.0.0" + }, + "engines": { + "node": "^14.13.1 || >=16.0.0" + }, + "peerDependencies": { + "stylelint": "^15.10.0" + } + }, + "node_modules/stylelint-config-standard-scss": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-10.0.0.tgz", + "integrity": "sha512-bChBEo1p3xUVWh/wenJI+josoMk21f2yuLDGzGjmKYcALfl2u3DFltY+n4UHswYiXghqXaA8mRh+bFy/q1hQlg==", + "dev": true, + "dependencies": { + "stylelint-config-recommended-scss": "^12.0.0", + "stylelint-config-standard": "^33.0.0" }, "peerDependencies": { "postcss": "^8.3.3", - "stylelint": "^14.10.0" + "stylelint": "^15.5.0" }, "peerDependenciesMeta": { "postcss": { @@ -24864,22 +25037,25 @@ } } }, - "node_modules/stylelint-config-gds/node_modules/stylelint-config-standard-scss/node_modules/stylelint-config-recommended-scss/node_modules/stylelint-config-recommended": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-9.0.0.tgz", - "integrity": "sha512-9YQSrJq4NvvRuTbzDsWX3rrFOzOlYBmZP+o513BJN/yfEmGSr0AxdvrWs0P/ilSpVV/wisamAHu5XSk8Rcf4CQ==", + "node_modules/stylelint-config-standard-scss/node_modules/stylelint-config-recommended": { + "version": "12.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-12.0.0.tgz", + "integrity": "sha512-x6x8QNARrGO2sG6iURkzqL+Dp+4bJorPMMRNPScdvaUK8PsynriOcMW7AFDKqkWAS5wbue/u8fUT/4ynzcmqdQ==", "dev": true, "peerDependencies": { - "stylelint": "^14.10.0" + "stylelint": "^15.5.0" } }, - "node_modules/stylelint-config-gds/node_modules/stylelint-config-standard/node_modules/stylelint-config-recommended": { - "version": "9.0.0", - "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-9.0.0.tgz", - "integrity": "sha512-9YQSrJq4NvvRuTbzDsWX3rrFOzOlYBmZP+o513BJN/yfEmGSr0AxdvrWs0P/ilSpVV/wisamAHu5XSk8Rcf4CQ==", + "node_modules/stylelint-config-standard-scss/node_modules/stylelint-config-standard": { + "version": "33.0.0", + "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-33.0.0.tgz", + "integrity": "sha512-eyxnLWoXImUn77+ODIuW9qXBDNM+ALN68L3wT1lN2oNspZ7D9NVGlNHb2QCUn4xDug6VZLsh0tF8NyoYzkgTzg==", "dev": true, + "dependencies": { + "stylelint-config-recommended": "^12.0.0" + }, "peerDependencies": { - "stylelint": "^14.10.0" + "stylelint": "^15.5.0" } }, "node_modules/stylelint-order": { @@ -24896,14 +25072,14 @@ } }, "node_modules/stylelint-scss": { - "version": "4.7.0", - "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-4.7.0.tgz", - "integrity": "sha512-TSUgIeS0H3jqDZnby1UO1Qv3poi1N8wUYIJY6D1tuUq2MN3lwp/rITVo0wD+1SWTmRm0tNmGO0b7nKInnqF6Hg==", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-5.0.1.tgz", + "integrity": "sha512-n87iCRZrr2J7//I/QFsDXxFLnHKw633U4qvWZ+mOW6KDAp/HLj06H+6+f9zOuTYy+MdGdTuCSDROCpQIhw5fvQ==", "dev": true, "dependencies": { "postcss-media-query-parser": "^0.2.3", "postcss-resolve-nested-selector": "^0.1.1", - "postcss-selector-parser": "^6.0.11", + "postcss-selector-parser": "^6.0.13", "postcss-value-parser": "^4.2.0" }, "peerDependencies": { @@ -24916,20 +25092,17 @@ "integrity": "sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==", "dev": true }, - "node_modules/stylelint/node_modules/cosmiconfig": { - "version": "7.1.0", - "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz", - "integrity": "sha512-AdmX6xUzdNASswsFtmwSt7Vj8po9IuqXm0UXz7QKPuEUmPB4XyjGfaAr2PSuELMwkRMVH1EpIkX5bTZGRB3eCA==", + "node_modules/stylelint/node_modules/css-tree": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz", + "integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==", "dev": true, "dependencies": { - "@types/parse-json": "^4.0.0", - "import-fresh": "^3.2.1", - "parse-json": "^5.0.0", - "path-type": "^4.0.0", - "yaml": "^1.10.0" + "mdn-data": "2.0.30", + "source-map-js": "^1.0.1" }, "engines": { - "node": ">=10" + "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0" } }, "node_modules/stylelint/node_modules/global-modules": { @@ -24967,12 +25140,30 @@ "node": ">=0.10.0" } }, + "node_modules/stylelint/node_modules/mdn-data": { + "version": "2.0.30", + "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz", + "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==", + "dev": true + }, "node_modules/stylelint/node_modules/picocolors": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==", "dev": true }, + "node_modules/stylelint/node_modules/signal-exit": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz", + "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==", + "dev": true, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, "node_modules/stylelint/node_modules/which": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz", @@ -24985,13 +25176,17 @@ "which": "bin/which" } }, - "node_modules/stylelint/node_modules/yaml": { - "version": "1.10.2", - "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz", - "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==", + "node_modules/stylelint/node_modules/write-file-atomic": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-5.0.1.tgz", + "integrity": "sha512-+QU2zd6OTD8XWIJCbffaiQeH9U73qIqafo1x6V1snCWYGJf6cVE0cDR4D8xRzcEnfI21IFrUPzPGtcPf8AC+Rw==", "dev": true, + "dependencies": { + "imurmurhash": "^0.1.4", + "signal-exit": "^4.0.1" + }, "engines": { - "node": ">= 6" + "node": "^14.17.0 || ^16.13.0 || >=18.0.0" } }, "node_modules/superagent": { @@ -25068,16 +25263,16 @@ } }, "node_modules/supports-hyperlinks": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/supports-hyperlinks/-/supports-hyperlinks-2.3.0.tgz", - "integrity": "sha512-RpsAZlpWcDwOPQA22aCH4J0t7L8JmAvsCxfOSEwm7cQs3LshN36QaTkwd70DnBOXDWGssw2eUoc8CaRWT0XunA==", + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/supports-hyperlinks/-/supports-hyperlinks-3.0.0.tgz", + "integrity": "sha512-QBDPHyPQDRTy9ku4URNGY5Lah8PAaXs6tAAwp55sL5WCsSW7GIfdf6W5ixfziW+t7wh3GVvHyHHyQ1ESsoRvaA==", "dev": true, "dependencies": { "has-flag": "^4.0.0", "supports-color": "^7.0.0" }, "engines": { - "node": ">=8" + "node": ">=14.18" } }, "node_modules/supports-hyperlinks/node_modules/has-flag": { @@ -25769,12 +25964,15 @@ } }, "node_modules/trim-newlines": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-3.0.1.tgz", - "integrity": "sha512-c1PTsA3tYrIsLGkJkzHF+w9F2EyxfXGo4UyJc4pFL++FMjnq0HJS69T3M7d//gKrFKwy429bouPescbjecU+Zw==", + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-4.1.1.tgz", + "integrity": "sha512-jRKj0n0jXWo6kh62nA5TEh3+4igKDXLvzBJcPpiizP7oOolUrYIxmVBG9TOtHYFHoddUk6YvAkGeGoSVTXfQXQ==", "dev": true, "engines": { - "node": ">=8" + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/ts-api-utils": { @@ -26463,12 +26661,6 @@ "uuid": "dist/bin/uuid" } }, - "node_modules/v8-compile-cache": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz", - "integrity": "sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==", - "dev": true - }, "node_modules/v8-compile-cache-lib": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz", diff --git a/package.json b/package.json index 8581114613..372b7d1a21 100644 --- a/package.json +++ b/package.json @@ -76,8 +76,8 @@ "postcss-scss": "^4.0.6", "prettier": "^3.0.0", "standard": "^17.1.0", - "stylelint": "^14.16.1", - "stylelint-config-gds": "^0.3.0", + "stylelint": "^15.10.2", + "stylelint-config-gds": "^1.0.0", "stylelint-order": "^6.0.3", "typescript": "^5.1.6" }, From 0d16d5c1f4e072fe9d22f784f0ab13668ab36e1b Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Tue, 20 Jun 2023 09:36:07 +0100 Subject: [PATCH 02/10] Configure Stylelint to for new or unused rules --- stylelint.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/stylelint.config.js b/stylelint.config.js index dc93459836..56d03cc81f 100644 --- a/stylelint.config.js +++ b/stylelint.config.js @@ -34,7 +34,7 @@ module.exports = { 'rule-empty-line-before': null, 'selector-max-id': null, 'string-quotes': null, - 'unit-no-unknown': null, + 'shorthand-property-no-redundant-values': null, // Allow markdown `*.md` Sass bad examples 'scss/at-if-no-null': null, From 9a1c9c04ab495f94a27c4197f77c86c8bb129c4f Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Thu, 29 Jun 2023 11:20:26 +0100 Subject: [PATCH 03/10] Configure Stylelint to remove deprecated rules --- .../src/govuk/helpers/_device-pixels.scss | 5 ++--- .../src/govuk/helpers/_spacing.scss | 8 +++---- .../src/govuk/settings/_colours-palette.scss | 5 ----- stylelint.config.js | 21 +------------------ 4 files changed, 6 insertions(+), 33 deletions(-) diff --git a/packages/govuk-frontend/src/govuk/helpers/_device-pixels.scss b/packages/govuk-frontend/src/govuk/helpers/_device-pixels.scss index ae83f50646..1a6ef9f832 100644 --- a/packages/govuk-frontend/src/govuk/helpers/_device-pixels.scss +++ b/packages/govuk-frontend/src/govuk/helpers/_device-pixels.scss @@ -28,11 +28,10 @@ /// @access public @mixin govuk-device-pixel-ratio($ratio: 2) { - // stylelint-disable indentation @media only screen and (-webkit-min-device-pixel-ratio: $ratio), only screen and (-o-min-device-pixel-ratio: #{($ratio * 10)} / 10), only screen and (min-resolution: #{($ratio * 96)}dpi), only screen and (min-resolution: #{$ratio}dppx) { - @content; - } + @content; + } } diff --git a/packages/govuk-frontend/src/govuk/helpers/_spacing.scss b/packages/govuk-frontend/src/govuk/helpers/_spacing.scss index 9a93a09c21..cd5932ff12 100644 --- a/packages/govuk-frontend/src/govuk/helpers/_spacing.scss +++ b/packages/govuk-frontend/src/govuk/helpers/_spacing.scss @@ -2,8 +2,6 @@ /// @group helpers/spacing //// -// stylelint-disable indentation - /// Single point spacing /// /// Returns measurement corresponding to the spacing point requested. @@ -35,7 +33,7 @@ $actual-input-type: type-of($spacing-point); @if $actual-input-type != "number" { @error "Expected a number (integer), but got a " - + "#{$actual-input-type}."; + + "#{$actual-input-type}."; } $is-negative: false; @@ -80,7 +78,7 @@ @if not map-has-key($govuk-spacing-responsive-scale, $responsive-spacing-point) { @error "Unknown spacing point `#{$responsive-spacing-point}`. Make sure you are using a point from the " - + "responsive spacing scale in `_settings/spacing.scss`."; + + "responsive spacing scale in `_settings/spacing.scss`."; } // Make sure that the return value from `_settings/spacing.scss` is a map. @@ -88,7 +86,7 @@ $actual-map-type: type-of($scale-map); @if $actual-map-type != "map" { @error "Expected a number (integer), but got a " - + "#{$actual-map-type}. Make sure you are using a map to set the responsive spacing in `_settings/spacing.scss`)"; + + "#{$actual-map-type}. Make sure you are using a map to set the responsive spacing in `_settings/spacing.scss`)"; } // Loop through each breakpoint in the map diff --git a/packages/govuk-frontend/src/govuk/settings/_colours-palette.scss b/packages/govuk-frontend/src/govuk/settings/_colours-palette.scss index 361155ff77..ea3833fd16 100644 --- a/packages/govuk-frontend/src/govuk/settings/_colours-palette.scss +++ b/packages/govuk-frontend/src/govuk/settings/_colours-palette.scss @@ -1,6 +1,3 @@ -// stylelint-disable value-list-max-empty-lines -- allow empty lines in lists -// in this file to allow grouping - //// /// @group settings/colours //// @@ -22,13 +19,11 @@ $govuk-colours: ( "dark-blue": #003078, "light-blue": #5694ca, "purple": #4c2c92, - "black": #0b0c0c, "dark-grey": #505a5f, "mid-grey": #b1b4b6, "light-grey": #f3f2f1, "white": #ffffff, - "light-purple": #6f72af, "bright-purple": #912b88, "pink": #d53880, diff --git a/stylelint.config.js b/stylelint.config.js index 56d03cc81f..17b52fba12 100644 --- a/stylelint.config.js +++ b/stylelint.config.js @@ -20,20 +20,12 @@ module.exports = { files: ['**/coding-standards/css.md'], rules: { // Allow markdown `*.md` CSS bad examples - 'block-closing-brace-space-before': null, 'block-no-empty': null, - 'block-opening-brace-space-after': null, - 'color-hex-case': null, 'color-hex-length': null, 'declaration-block-single-line-max-declarations': null, - 'declaration-block-trailing-semicolon': null, - 'declaration-colon-space-after': null, 'length-zero-no-unit': null, - 'number-leading-zero': null, - 'number-no-trailing-zeros': null, 'rule-empty-line-before': null, 'selector-max-id': null, - 'string-quotes': null, 'shorthand-property-no-redundant-values': null, // Allow markdown `*.md` Sass bad examples @@ -212,17 +204,6 @@ module.exports = { 'src', 'cursor', '-webkit-appearance' - ], - - /** - * We no longer need to use single colon pseudo-selectors, as we've dropped - * support for Internet Explorer 8. Override the - * `selector-pseudo-element-colon-notation` value until the upstream - * Stylelint config has been updated. - * - * https://github.com/alphagov/stylelint-config-gds/pull/36 - * https://stylelint.io/user-guide/rules/list/selector-pseudo-element-colon-notation/ - */ - 'selector-pseudo-element-colon-notation': 'double' + ] } } From 7c764ab3ff67ea349bcf60143886d0c1ed74e60a Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Mon, 12 Jun 2023 16:33:06 +0100 Subject: [PATCH 04/10] Configure Stylelint to ignore legacy source symlinks --- stylelint.config.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/stylelint.config.js b/stylelint.config.js index 17b52fba12..fdd2551f38 100644 --- a/stylelint.config.js +++ b/stylelint.config.js @@ -7,6 +7,10 @@ module.exports = { // Ignore CSS-in-JS (including dotfiles) '**/?(.)*.{cjs,js,mjs}', + // Legacy source symlinks + 'src/govuk/**', + 'src/govuk-prototype-kit/**', + // Prevent CHANGELOG history changes 'CHANGELOG.md' ], From ed59f7f577907864550205b838a705fdf4147046 Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Tue, 20 Jun 2023 09:16:01 +0100 Subject: [PATCH 05/10] Configure Prettier to format `*.scss` files --- .lintstagedrc.js | 2 +- .prettierrc.js | 1 + package.json | 2 +- 3 files changed, 3 insertions(+), 2 deletions(-) diff --git a/.lintstagedrc.js b/.lintstagedrc.js index ff1e38e872..9f9f819453 100644 --- a/.lintstagedrc.js +++ b/.lintstagedrc.js @@ -20,7 +20,7 @@ module.exports = { '*.{cjs,js,mjs}': commands.eslint, '*.{json,yaml,yml}': commands.prettier, '*.md': [commands.eslint, commands.stylelint, commands.prettier], - '*.scss': commands.stylelint + '*.scss': [commands.stylelint, commands.prettier] } // Configure paths to ignore diff --git a/.prettierrc.js b/.prettierrc.js index eaaa2db473..5cf69113b6 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -18,6 +18,7 @@ module.exports = { { files: '*.scss', options: { + printWidth: 120, singleQuote: false } } diff --git a/package.json b/package.json index 372b7d1a21..2818a177f2 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,7 @@ "lint:editorconfig:cli": "editorconfig-checker", "lint:js": "npm run lint:js:cli -- \"**/*.{cjs,js,md,mjs}\"", "lint:js:cli": "eslint --cache --cache-location .cache/eslint --cache-strategy content --color --ignore-path .gitignore --max-warnings 0", - "lint:prettier": "npm run lint:prettier:cli -- \"**/*.{json,md,yaml,yml}\"", + "lint:prettier": "npm run lint:prettier:cli -- \"**/*.{json,md,scss,yaml,yml}\"", "lint:prettier:cli": "prettier --cache --cache-location .cache/prettier --cache-strategy content --check", "lint:scss": "npm run lint:scss:cli -- \"**/*.{md,scss}\"", "lint:scss:cli": "stylelint --cache --cache-location .cache/stylelint --cache-strategy content --color --ignore-path .gitignore --max-warnings 0", From 6924f46e405d5a5a490d6e73a44632662f02190f Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Mon, 17 Jul 2023 09:35:15 +0100 Subject: [PATCH 06/10] Run `prettier --write` --- .../full-page-examples/campaign-page.scss | 10 +++++++++- .../govuk/components/accordion/_index.scss | 12 ++++++----- .../govuk/components/back-link/_index.scss | 5 ++++- .../govuk/components/breadcrumbs/_index.scss | 6 ++++-- .../src/govuk/components/button/_index.scss | 5 +++-- .../govuk/components/checkboxes/_index.scss | 7 +++---- .../components/cookie-banner/_index.scss | 1 - .../src/govuk/components/details/_index.scss | 1 - .../components/exit-this-page/_index.scss | 4 ++-- .../src/govuk/components/fieldset/_index.scss | 9 +++++---- .../govuk/components/file-upload/_index.scss | 2 +- .../src/govuk/components/footer/_index.scss | 9 ++++----- .../src/govuk/components/header/_index.scss | 13 ++++++------ .../src/govuk/components/hint/_index.scss | 5 ++++- .../src/govuk/components/input/_index.scss | 4 ++-- .../src/govuk/components/radios/_index.scss | 11 +++++----- .../src/govuk/components/select/_index.scss | 2 +- .../src/govuk/components/tabs/_index.scss | 1 - .../src/govuk/components/textarea/_index.scss | 2 +- .../src/govuk/core/_global-styles.scss | 1 - .../govuk-frontend/src/govuk/core/_links.scss | 1 - .../govuk-frontend/src/govuk/core/_lists.scss | 1 - .../src/govuk/core/_section-break.scss | 1 - .../src/govuk/core/_typography.scss | 7 +++---- .../src/govuk/helpers/_focused.scss | 4 +++- .../src/govuk/helpers/_links.scss | 7 ++++--- .../src/govuk/helpers/_spacing.scss | 12 ++++++----- .../src/govuk/helpers/_typography.scss | 7 +------ .../src/govuk/objects/_grid.scss | 4 ++-- .../src/govuk/objects/_template.scss | 1 - .../src/govuk/objects/_width-container.scss | 1 - .../src/govuk/overrides/_spacing.scss | 10 +--------- .../settings/_colours-organisations.scss | 4 ++-- .../src/govuk/settings/_links.scss | 2 +- .../src/govuk/settings/_measurements.scss | 20 ++++++++++++++----- .../src/govuk/settings/_media-queries.scss | 4 ++-- .../src/govuk/settings/_warnings.scss | 3 +-- .../src/govuk/tools/_font-url.scss | 5 ++--- .../src/govuk/tools/_image-url.scss | 5 ++--- 39 files changed, 107 insertions(+), 102 deletions(-) diff --git a/packages/govuk-frontend-review/src/stylesheets/full-page-examples/campaign-page.scss b/packages/govuk-frontend-review/src/stylesheets/full-page-examples/campaign-page.scss index 0229034363..d921acca0a 100644 --- a/packages/govuk-frontend-review/src/stylesheets/full-page-examples/campaign-page.scss +++ b/packages/govuk-frontend-review/src/stylesheets/full-page-examples/campaign-page.scss @@ -61,7 +61,15 @@ padding: govuk-spacing(6) govuk-spacing(5); border-left: solid #fff500; border-width: 0 0 0 10px; - border-image: repeating-linear-gradient(25deg, transparent 0, #fff500 1px, #fff500 10px, transparent 11px, transparent 20px) 25; + border-image: repeating-linear-gradient( + 25deg, + transparent 0, + #fff500 1px, + #fff500 10px, + transparent 11px, + transparent 20px + ) + 25; color: govuk-colour("white"); background-color: #272828; } diff --git a/packages/govuk-frontend/src/govuk/components/accordion/_index.scss b/packages/govuk-frontend/src/govuk/components/accordion/_index.scss index 17c34fa15e..37cfb52b33 100644 --- a/packages/govuk-frontend/src/govuk/components/accordion/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/accordion/_index.scss @@ -89,7 +89,7 @@ cursor: pointer; -webkit-appearance: none; - @include govuk-media-query ($from: tablet) { + @include govuk-media-query($from: tablet) { margin-bottom: 14px; } @@ -105,7 +105,9 @@ // The GOV.UK Design System focus state adds a box-shadow to the top and bottom of the // button. We add a grey box-shadow on hover too, to make the height of the hover state // match the height of the focus state. - box-shadow: 0 -2px $govuk-accordion-hover-colour, 0 4px $govuk-accordion-hover-colour; + box-shadow: + 0 -2px $govuk-accordion-hover-colour, + 0 4px $govuk-accordion-hover-colour; .govuk-accordion__section-toggle-text { color: $govuk-accordion-base-colour; @@ -200,7 +202,7 @@ cursor: pointer; -webkit-appearance: none; - @include govuk-media-query ($from: tablet) { + @include govuk-media-query($from: tablet) { padding-bottom: govuk-spacing(2); } @@ -262,7 +264,7 @@ padding-bottom: govuk-spacing(3); border-bottom: 0; - @include govuk-media-query ($from: tablet) { + @include govuk-media-query($from: tablet) { padding-bottom: govuk-spacing(4); } } @@ -272,7 +274,7 @@ .govuk-accordion__section-button:focus .govuk-accordion__section-toggle-focus { padding-bottom: 3px; - @include govuk-media-query ($from: desktop) { + @include govuk-media-query($from: desktop) { padding-bottom: 2px; } } diff --git a/packages/govuk-frontend/src/govuk/components/back-link/_index.scss b/packages/govuk-frontend/src/govuk/components/back-link/_index.scss index 480076b03e..ff426947bc 100644 --- a/packages/govuk-frontend/src/govuk/components/back-link/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/back-link/_index.scss @@ -50,7 +50,10 @@ border-color: $chevron-border-colour; @supports (border-width: unquote("max(0px)")) { - border-width: unquote("max(#{$chevron-border-min-width}, #{$chevron-border-width}) max(#{$chevron-border-min-width}, #{$chevron-border-width})") 0 0; + border-width: unquote( + "max(#{$chevron-border-min-width}, #{$chevron-border-width}) max(#{$chevron-border-min-width}, #{$chevron-border-width})" + ) + 0 0; // Ensure that the chevron never gets smaller than 16px font-size: unquote("max(#{$font-size * 1px}, 1em)"); diff --git a/packages/govuk-frontend/src/govuk/components/breadcrumbs/_index.scss b/packages/govuk-frontend/src/govuk/components/breadcrumbs/_index.scss index dff29dbf82..cac755cb26 100644 --- a/packages/govuk-frontend/src/govuk/components/breadcrumbs/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/breadcrumbs/_index.scss @@ -35,7 +35,6 @@ } .govuk-breadcrumbs__list-item { - display: inline-block; position: relative; @@ -73,7 +72,10 @@ border-color: $chevron-border-colour; @supports (border-width: unquote("max(0px)")) { - border-width: unquote("max(#{$chevron-border-min-width}, #{$chevron-border-width}) max(#{$chevron-border-min-width}, #{$chevron-border-width})") 0 0; + border-width: unquote( + "max(#{$chevron-border-min-width}, #{$chevron-border-width}) max(#{$chevron-border-min-width}, #{$chevron-border-width})" + ) + 0 0; // Ensure that the chevron never gets smaller than 16px font-size: unquote("max(#{$font-size * 1px}, 1em)"); diff --git a/packages/govuk-frontend/src/govuk/components/button/_index.scss b/packages/govuk-frontend/src/govuk/components/button/_index.scss index 7cdafe9204..4e9801352a 100644 --- a/packages/govuk-frontend/src/govuk/components/button/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/button/_index.scss @@ -56,7 +56,8 @@ $govuk-button-text-colour: govuk-colour("white") !default; margin-right: 0; margin-left: 0; @include govuk-responsive-margin(6, "bottom", $adjustment: $button-shadow-size); // s2 - padding: (govuk-spacing(2) - $govuk-border-width-form-element) govuk-spacing(2) (govuk-spacing(2) - $govuk-border-width-form-element - ($button-shadow-size / 2)); // s1 + padding: (govuk-spacing(2) - $govuk-border-width-form-element) govuk-spacing(2) + (govuk-spacing(2) - $govuk-border-width-form-element - ($button-shadow-size / 2)); // s1 border: $govuk-border-width-form-element solid transparent; border-radius: 0; color: $govuk-button-text-colour; @@ -143,7 +144,7 @@ $govuk-button-text-colour: govuk-colour("white") !default; } .govuk-button[disabled] { - opacity: (.5); + opacity: (0.5); &:hover { background-color: $govuk-button-colour; diff --git a/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss b/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss index 36cb8e5984..42f0ee85b8 100644 --- a/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss @@ -4,7 +4,6 @@ @import "../label/index"; @include govuk-exports("govuk/component/checkboxes") { - $govuk-touch-target-size: 44px; $govuk-checkboxes-size: 40px; $govuk-small-checkboxes-size: 24px; @@ -134,7 +133,7 @@ .govuk-checkboxes__input:disabled + .govuk-checkboxes__label, .govuk-checkboxes__input:disabled ~ .govuk-hint { - opacity: .5; + opacity: 0.5; } // ========================================================= @@ -184,7 +183,6 @@ // ========================================================= .govuk-checkboxes--small { - $input-offset: ($govuk-touch-target-size - $govuk-small-checkboxes-size) / 2; $label-offset: $govuk-touch-target-size - $input-offset; @@ -291,7 +289,8 @@ outline-color: Highlight; } box-shadow: - 0 0 0 $govuk-focus-width $govuk-focus-colour, // 1 + 0 0 0 $govuk-focus-width $govuk-focus-colour, + // 1 0 0 0 $govuk-hover-width $govuk-hover-colour; // 2 } diff --git a/packages/govuk-frontend/src/govuk/components/cookie-banner/_index.scss b/packages/govuk-frontend/src/govuk/components/cookie-banner/_index.scss index d34f6d759a..3af5025fe8 100644 --- a/packages/govuk-frontend/src/govuk/components/cookie-banner/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/cookie-banner/_index.scss @@ -1,5 +1,4 @@ @include govuk-exports("govuk/component/cookie-banner") { - // This needs to be kept in sync with the header component's styles $border-bottom-width: govuk-spacing(2); diff --git a/packages/govuk-frontend/src/govuk/components/details/_index.scss b/packages/govuk-frontend/src/govuk/components/details/_index.scss index 8f7e43eec4..cc72b90e40 100644 --- a/packages/govuk-frontend/src/govuk/components/details/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/details/_index.scss @@ -69,7 +69,6 @@ // - do not support ES6 modules or the
element (eg, IE8+) @supports not (-ms-ime-align: auto) { .govuk-details__summary { - // Absolutely position the marker against this element position: relative; diff --git a/packages/govuk-frontend/src/govuk/components/exit-this-page/_index.scss b/packages/govuk-frontend/src/govuk/components/exit-this-page/_index.scss index fb4c29ae35..d561e99f5d 100644 --- a/packages/govuk-frontend/src/govuk/components/exit-this-page/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/exit-this-page/_index.scss @@ -1,7 +1,7 @@ @import "../button/index"; @include govuk-exports("govuk/component/exit-this-page") { - $indicator-size: .75em; + $indicator-size: 0.75em; .govuk-exit-this-page { @include govuk-responsive-margin(8, "bottom"); @@ -43,7 +43,7 @@ display: inline-block; width: $indicator-size; height: $indicator-size; - margin: 0 .125em; + margin: 0 0.125em; border-width: 2px; border-style: solid; border-radius: 50%; diff --git a/packages/govuk-frontend/src/govuk/components/fieldset/_index.scss b/packages/govuk-frontend/src/govuk/components/fieldset/_index.scss index d1739b07a8..0dae851446 100644 --- a/packages/govuk-frontend/src/govuk/components/fieldset/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/fieldset/_index.scss @@ -11,7 +11,8 @@ // https://bugzilla.mozilla.org/show_bug.cgi?id=504622 @supports not (caret-color: auto) { .govuk-fieldset, - x:-moz-any-link { // stylelint-disable-line selector-type-no-unknown + x:-moz-any-link { + // stylelint-disable-line selector-type-no-unknown display: table-cell; } } @@ -24,12 +25,12 @@ // 1. IE9-11 & Edge 12-13 // 2. IE8-11 box-sizing: border-box; // 1 - display: table; // 2 - max-width: 100%; // 1 + display: table; // 2 + max-width: 100%; // 1 margin-bottom: govuk-spacing(2); padding: 0; - white-space: normal; // 1 + white-space: normal; // 1 } // Modifiers that make legends look more like their equivalent headings diff --git a/packages/govuk-frontend/src/govuk/components/file-upload/_index.scss b/packages/govuk-frontend/src/govuk/components/file-upload/_index.scss index 51f94924a2..1a65a95727 100644 --- a/packages/govuk-frontend/src/govuk/components/file-upload/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/file-upload/_index.scss @@ -43,7 +43,7 @@ } &:disabled { - opacity: .5; + opacity: 0.5; cursor: not-allowed; } } diff --git a/packages/govuk-frontend/src/govuk/components/footer/_index.scss b/packages/govuk-frontend/src/govuk/components/footer/_index.scss index 97e18b4f1a..fea4ba1536 100644 --- a/packages/govuk-frontend/src/govuk/components/footer/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/footer/_index.scss @@ -1,5 +1,4 @@ @include govuk-exports("govuk/component/footer") { - $govuk-footer-background: $govuk-canvas-background-colour; $govuk-footer-border: $govuk-border-colour; $govuk-footer-text: $govuk-text-colour; @@ -50,7 +49,7 @@ .govuk-footer__meta-item--grow { flex: 1; // Support: Flexbox - @include govuk-media-query ($until: tablet) { + @include govuk-media-query($until: tablet) { flex-basis: 320px; // Support: Flexbox } } @@ -58,7 +57,7 @@ .govuk-footer__licence-logo { display: inline-block; margin-right: govuk-spacing(2); - @include govuk-media-query ($until: desktop) { + @include govuk-media-query($until: desktop) { margin-bottom: govuk-spacing(3); } vertical-align: top; @@ -106,7 +105,7 @@ margin-bottom: govuk-spacing(6); padding-bottom: govuk-spacing(4); - @include govuk-media-query ($until: tablet) { + @include govuk-media-query($until: tablet) { padding-bottom: govuk-spacing(2); } border-bottom: 1px solid $govuk-footer-border; @@ -131,7 +130,7 @@ column-gap: $govuk-gutter; // Support: Columns } - @include govuk-media-query ($from: desktop) { + @include govuk-media-query($from: desktop) { .govuk-footer__list--columns-2 { column-count: 2; // Support: Columns } diff --git a/packages/govuk-frontend/src/govuk/components/header/_index.scss b/packages/govuk-frontend/src/govuk/components/header/_index.scss index a7d49b91e1..e437fc45dd 100644 --- a/packages/govuk-frontend/src/govuk/components/header/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/header/_index.scss @@ -1,5 +1,4 @@ @include govuk-exports("govuk/component/header") { - $govuk-header-background: govuk-colour("black"); $govuk-header-border-color: $govuk-brand-colour; $govuk-header-border-width: govuk-spacing(2); @@ -148,7 +147,7 @@ @include govuk-responsive-margin(2, "bottom"); padding-right: govuk-spacing(8); - @include govuk-media-query ($from: desktop) { + @include govuk-media-query($from: desktop) { width: 33.33%; padding-right: $govuk-gutter-half; float: left; @@ -157,7 +156,7 @@ } .govuk-header__content { - @include govuk-media-query ($from: desktop) { + @include govuk-media-query($from: desktop) { width: 66.66%; padding-left: $govuk-gutter-half; float: left; @@ -198,7 +197,7 @@ @include govuk-shape-arrow($direction: up, $base: 10px, $display: inline-block); } - @include govuk-media-query ($from: tablet) { + @include govuk-media-query($from: tablet) { top: govuk-spacing(3); } @@ -213,7 +212,7 @@ } .govuk-header__navigation { - @include govuk-media-query ($from: desktop) { + @include govuk-media-query($from: desktop) { margin-bottom: govuk-spacing(2); } } @@ -230,7 +229,7 @@ } .govuk-header__navigation--end { - @include govuk-media-query ($from: desktop) { + @include govuk-media-query($from: desktop) { margin: 0; padding: govuk-spacing(1) 0; text-align: right; @@ -241,7 +240,7 @@ padding: govuk-spacing(2) 0; border-bottom: 1px solid $govuk-header-nav-item-border-color; - @include govuk-media-query ($from: desktop) { + @include govuk-media-query($from: desktop) { display: inline-block; margin-right: govuk-spacing(3); padding: govuk-spacing(1) 0; diff --git a/packages/govuk-frontend/src/govuk/components/hint/_index.scss b/packages/govuk-frontend/src/govuk/components/hint/_index.scss index 27dba01513..e651aa7abe 100644 --- a/packages/govuk-frontend/src/govuk/components/hint/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/hint/_index.scss @@ -31,7 +31,10 @@ // This adjustment will not work in browsers that do not support :not(). // Users with these browsers will see the default size margin (5px larger). - .govuk-fieldset__legend:not(.govuk-fieldset__legend--m):not(.govuk-fieldset__legend--l):not(.govuk-fieldset__legend--xl) + .govuk-hint { + .govuk-fieldset__legend:not(.govuk-fieldset__legend--m):not(.govuk-fieldset__legend--l):not( + .govuk-fieldset__legend--xl + ) + + .govuk-hint { margin-bottom: govuk-spacing(2); } diff --git a/packages/govuk-frontend/src/govuk/components/input/_index.scss b/packages/govuk-frontend/src/govuk/components/input/_index.scss index 52cc67cfb0..5a71d64ff0 100644 --- a/packages/govuk-frontend/src/govuk/components/input/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/input/_index.scss @@ -31,7 +31,7 @@ } &:disabled { - opacity: .5; + opacity: 0.5; color: inherit; background-color: transparent; cursor: not-allowed; @@ -58,7 +58,7 @@ .govuk-input--extra-letter-spacing { @include govuk-font(false, $tabular: true); - letter-spacing: .05em; + letter-spacing: 0.05em; } // em measurements are based on the point size of the typeface diff --git a/packages/govuk-frontend/src/govuk/components/radios/_index.scss b/packages/govuk-frontend/src/govuk/components/radios/_index.scss index 1cc1a6b6c7..773d05211d 100644 --- a/packages/govuk-frontend/src/govuk/components/radios/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/radios/_index.scss @@ -4,7 +4,6 @@ @import "../label/index"; @include govuk-exports("govuk/component/radios") { - $govuk-touch-target-size: 44px; $govuk-radios-size: 40px; $govuk-small-radios-size: 24px; @@ -134,7 +133,7 @@ .govuk-radios__input:disabled + .govuk-radios__label, .govuk-radios__input:disabled ~ .govuk-hint { - opacity: .5; + opacity: 0.5; } // ========================================================= @@ -142,7 +141,7 @@ // ========================================================= .govuk-radios--inline { - @include govuk-media-query ($from: tablet) { + @include govuk-media-query($from: tablet) { @include govuk-clearfix; .govuk-radios__item { @@ -200,7 +199,6 @@ // ========================================================= .govuk-radios--small { - $input-offset: ($govuk-touch-target-size - $govuk-small-radios-size) / 2; $label-offset: $govuk-touch-target-size - $input-offset; @@ -311,8 +309,9 @@ outline-color: Highlight; } box-shadow: - 0 0 0 $govuk-radios-focus-width $govuk-focus-colour, // 1 - 0 0 0 $govuk-hover-width $govuk-hover-colour; // 2 + 0 0 0 $govuk-radios-focus-width $govuk-focus-colour, + // 1 + 0 0 0 $govuk-hover-width $govuk-hover-colour; // 2 } // For devices that explicitly don't support hover, don't provide a hover diff --git a/packages/govuk-frontend/src/govuk/components/select/_index.scss b/packages/govuk-frontend/src/govuk/components/select/_index.scss index 350328b2a1..791e80bc24 100644 --- a/packages/govuk-frontend/src/govuk/components/select/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/select/_index.scss @@ -34,7 +34,7 @@ } &:disabled { - opacity: .5; + opacity: 0.5; color: inherit; cursor: not-allowed; } diff --git a/packages/govuk-frontend/src/govuk/components/tabs/_index.scss b/packages/govuk-frontend/src/govuk/components/tabs/_index.scss index cf755d69e1..f5e48d1869 100644 --- a/packages/govuk-frontend/src/govuk/components/tabs/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/tabs/_index.scss @@ -43,7 +43,6 @@ // GOV.UK Frontend JavaScript enabled .govuk-frontend-supported { - @include govuk-media-query($from: tablet) { .govuk-tabs__list { @include govuk-clearfix; diff --git a/packages/govuk-frontend/src/govuk/components/textarea/_index.scss b/packages/govuk-frontend/src/govuk/components/textarea/_index.scss index 947ce25189..2ff20e2a05 100644 --- a/packages/govuk-frontend/src/govuk/components/textarea/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/textarea/_index.scss @@ -31,7 +31,7 @@ } &:disabled { - opacity: .5; + opacity: 0.5; color: inherit; background-color: transparent; cursor: not-allowed; diff --git a/packages/govuk-frontend/src/govuk/core/_global-styles.scss b/packages/govuk-frontend/src/govuk/core/_global-styles.scss index 20d043a003..bf383b6043 100644 --- a/packages/govuk-frontend/src/govuk/core/_global-styles.scss +++ b/packages/govuk-frontend/src/govuk/core/_global-styles.scss @@ -12,7 +12,6 @@ } @include govuk-exports("govuk/core/global-styles") { - @if $govuk-global-styles == true { @include govuk-global-styles; } diff --git a/packages/govuk-frontend/src/govuk/core/_links.scss b/packages/govuk-frontend/src/govuk/core/_links.scss index bd62d2ec14..8c7a24c73f 100644 --- a/packages/govuk-frontend/src/govuk/core/_links.scss +++ b/packages/govuk-frontend/src/govuk/core/_links.scss @@ -1,5 +1,4 @@ @include govuk-exports("govuk/core/links") { - %govuk-link { @include govuk-link-common; @include govuk-link-style-default; diff --git a/packages/govuk-frontend/src/govuk/core/_lists.scss b/packages/govuk-frontend/src/govuk/core/_lists.scss index 7afb5584b6..00a59a7e87 100644 --- a/packages/govuk-frontend/src/govuk/core/_lists.scss +++ b/packages/govuk-frontend/src/govuk/core/_lists.scss @@ -1,5 +1,4 @@ @include govuk-exports("govuk/core/lists") { - %govuk-list { @include govuk-font($size: 19); @include govuk-text-colour; diff --git a/packages/govuk-frontend/src/govuk/core/_section-break.scss b/packages/govuk-frontend/src/govuk/core/_section-break.scss index fb9876e6d6..1f39b0946c 100644 --- a/packages/govuk-frontend/src/govuk/core/_section-break.scss +++ b/packages/govuk-frontend/src/govuk/core/_section-break.scss @@ -1,5 +1,4 @@ @include govuk-exports("govuk/core/section-break") { - %govuk-section-break { margin: 0; border: 0; diff --git a/packages/govuk-frontend/src/govuk/core/_typography.scss b/packages/govuk-frontend/src/govuk/core/_typography.scss index db5bf99559..b1898d59ac 100644 --- a/packages/govuk-frontend/src/govuk/core/_typography.scss +++ b/packages/govuk-frontend/src/govuk/core/_typography.scss @@ -1,5 +1,4 @@ @include govuk-exports("govuk/core/typography") { - // Headings %govuk-heading-xl { @@ -157,7 +156,7 @@ // Contextual adjustments // Add top padding to headings that appear directly after paragraphs. - %govuk-body-l + %govuk-heading-l { + %govuk-body-l + %govuk-heading-l { padding-top: govuk-spacing(1); @include govuk-media-query($from: tablet) { @@ -165,8 +164,8 @@ } } - %govuk-body-m + %govuk-heading-l, - %govuk-body-s + %govuk-heading-l, + %govuk-body-m + %govuk-heading-l, + %govuk-body-s + %govuk-heading-l, %govuk-list + %govuk-heading-l { @include govuk-responsive-padding(4, "top"); } diff --git a/packages/govuk-frontend/src/govuk/helpers/_focused.scss b/packages/govuk-frontend/src/govuk/helpers/_focused.scss index a94f8c469f..e5e468e035 100644 --- a/packages/govuk-frontend/src/govuk/helpers/_focused.scss +++ b/packages/govuk-frontend/src/govuk/helpers/_focused.scss @@ -17,7 +17,9 @@ outline: $govuk-focus-width solid transparent; color: $govuk-focus-text-colour; background-color: $govuk-focus-colour; - box-shadow: 0 -2px $govuk-focus-colour, 0 4px $govuk-focus-text-colour; + box-shadow: + 0 -2px $govuk-focus-colour, + 0 4px $govuk-focus-text-colour; // When link is focussed, hide the default underline since the // box shadow adds the "underline" text-decoration: none; diff --git a/packages/govuk-frontend/src/govuk/helpers/_links.scss b/packages/govuk-frontend/src/govuk/helpers/_links.scss index 3ad9de0a57..a20b821110 100644 --- a/packages/govuk-frontend/src/govuk/helpers/_links.scss +++ b/packages/govuk-frontend/src/govuk/helpers/_links.scss @@ -230,7 +230,7 @@ // https://bugs.webkit.org/show_bug.cgi?id=224483 &:hover { @if type-of($govuk-text-colour) == color { - color: rgba($govuk-text-colour, .99); + color: rgba($govuk-text-colour, 0.99); } } @@ -266,7 +266,7 @@ // https://bugs.webkit.org/show_bug.cgi?id=224483 &:hover, &:active { - color: rgba(govuk-colour("white"), .99); + color: rgba(govuk-colour("white"), 0.99); } &:focus { @@ -349,7 +349,8 @@ @include govuk-media-query($media-type: print) { &[href^="/"], &[href^="http://"], - &[href^="https://"] { + &[href^="https://"] + { &::after { content: " (" attr(href) ")"; font-size: 90%; diff --git a/packages/govuk-frontend/src/govuk/helpers/_spacing.scss b/packages/govuk-frontend/src/govuk/helpers/_spacing.scss index cd5932ff12..97165a9d33 100644 --- a/packages/govuk-frontend/src/govuk/helpers/_spacing.scss +++ b/packages/govuk-frontend/src/govuk/helpers/_spacing.scss @@ -29,7 +29,6 @@ /// @access public @function govuk-spacing($spacing-point) { - $actual-input-type: type-of($spacing-point); @if $actual-input-type != "number" { @error "Expected a number (integer), but got a " @@ -69,8 +68,13 @@ /// /// @access private -@mixin _govuk-responsive-spacing($responsive-spacing-point, $property, $direction: "all", $important: false, $adjustment: false) { - +@mixin _govuk-responsive-spacing( + $responsive-spacing-point, + $property, + $direction: "all", + $important: false, + $adjustment: false +) { $actual-input-type: type-of($responsive-spacing-point); @if $actual-input-type != "number" { @error "Expected a number (integer), but got a " + "#{$actual-input-type}."; @@ -91,14 +95,12 @@ // Loop through each breakpoint in the map @each $breakpoint, $breakpoint-value in $scale-map { - @if $adjustment { $breakpoint-value: $breakpoint-value + $adjustment; } // The 'null' breakpoint is for mobile. @if not $breakpoint { - @if $direction == all { #{$property}: $breakpoint-value if($important, !important, null); } @else { diff --git a/packages/govuk-frontend/src/govuk/helpers/_typography.scss b/packages/govuk-frontend/src/govuk/helpers/_typography.scss index 69eda3122f..141dc02d2e 100644 --- a/packages/govuk-frontend/src/govuk/helpers/_typography.scss +++ b/packages/govuk-frontend/src/govuk/helpers/_typography.scss @@ -115,7 +115,6 @@ /// @access public @mixin govuk-typography-responsive($size, $override-line-height: false, $important: false) { - @if not map-has-key($govuk-typography-scale, $size) { @error "Unknown font size `#{$size}` - expected a point from the typography scale."; } @@ -127,11 +126,7 @@ $font-size-rem: govuk-px-to-rem($font-size); $line-height: _govuk-line-height( - $line-height: if( - $override-line-height, - $override-line-height, - map-get($breakpoint-map, "line-height") - ), + $line-height: if($override-line-height, $override-line-height, map-get($breakpoint-map, "line-height")), $font-size: $font-size ); diff --git a/packages/govuk-frontend/src/govuk/objects/_grid.scss b/packages/govuk-frontend/src/govuk/objects/_grid.scss index 4ae792a92e..c773127ca3 100644 --- a/packages/govuk-frontend/src/govuk/objects/_grid.scss +++ b/packages/govuk-frontend/src/govuk/objects/_grid.scss @@ -3,8 +3,8 @@ @include govuk-exports("govuk/objects/grid") { .govuk-grid-row { @include govuk-clearfix; - margin-right: - ($govuk-gutter-half); - margin-left: - ($govuk-gutter-half); + margin-right: -($govuk-gutter-half); + margin-left: -($govuk-gutter-half); } @each $width in map-keys($govuk-grid-widths) { diff --git a/packages/govuk-frontend/src/govuk/objects/_template.scss b/packages/govuk-frontend/src/govuk/objects/_template.scss index 8a7be9ed45..ac246829c9 100644 --- a/packages/govuk-frontend/src/govuk/objects/_template.scss +++ b/packages/govuk-frontend/src/govuk/objects/_template.scss @@ -1,7 +1,6 @@ @import "../base"; @include govuk-exports("govuk/objects/template") { - // Applied to the element .govuk-template { // Set the overall page background colour to the same colour as used by the diff --git a/packages/govuk-frontend/src/govuk/objects/_width-container.scss b/packages/govuk-frontend/src/govuk/objects/_width-container.scss index ce94407bd7..2252f352e2 100644 --- a/packages/govuk-frontend/src/govuk/objects/_width-container.scss +++ b/packages/govuk-frontend/src/govuk/objects/_width-container.scss @@ -18,7 +18,6 @@ /// @access public @mixin govuk-width-container($width: $govuk-page-width) { - // By default, limit the width of the container to the page width max-width: $width; diff --git a/packages/govuk-frontend/src/govuk/overrides/_spacing.scss b/packages/govuk-frontend/src/govuk/overrides/_spacing.scss index 5fbae35124..170b6e496e 100644 --- a/packages/govuk-frontend/src/govuk/overrides/_spacing.scss +++ b/packages/govuk-frontend/src/govuk/overrides/_spacing.scss @@ -9,12 +9,7 @@ /// @type Map /// @access private -$_spacing-directions: ( - "top", - "right", - "bottom", - "left" -) !default; +$_spacing-directions: ("top", "right", "bottom", "left") !default; /// Generate responsive spacing override classes /// @@ -40,15 +35,12 @@ $_spacing-directions: ( // For each point in the spacing scale (defined in settings), create an // override that affects all directions... @each $scale-point, $scale-map in $govuk-spacing-responsive-scale { - .govuk-\!-#{$property}-#{$scale-point} { - @include _govuk-responsive-spacing($scale-point, $property, "all", true); } // ... and then an override for each individual direction @each $direction in $_spacing-directions { - .govuk-\!-#{$property}-#{$direction}-#{$scale-point} { @include _govuk-responsive-spacing($scale-point, $property, $direction, true); } diff --git a/packages/govuk-frontend/src/govuk/settings/_colours-organisations.scss b/packages/govuk-frontend/src/govuk/settings/_colours-organisations.scss index e55e851653..cf3193a7bc 100644 --- a/packages/govuk-frontend/src/govuk/settings/_colours-organisations.scss +++ b/packages/govuk-frontend/src/govuk/settings/_colours-organisations.scss @@ -59,7 +59,7 @@ $govuk-colours-organisations: ( colour-websafe: #005ea5 ), "department-for-levelling-up-housing-and-communities": ( - colour: #012169, + colour: #012169 ), "department-for-transport": ( colour: #006c56, @@ -85,7 +85,7 @@ $govuk-colours-organisations: ( colour-websafe: #406e97 ), "government-equalities-office": ( - colour: #9325b2 + colour: #9325b2 ), "hm-government": ( colour: #0076c0, diff --git a/packages/govuk-frontend/src/govuk/settings/_links.scss b/packages/govuk-frontend/src/govuk/settings/_links.scss index 3ea150679d..a35940c99e 100644 --- a/packages/govuk-frontend/src/govuk/settings/_links.scss +++ b/packages/govuk-frontend/src/govuk/settings/_links.scss @@ -28,7 +28,7 @@ $govuk-link-underline-thickness: unquote("max(1px, .0625rem)") !default; /// @type Number /// @access public -$govuk-link-underline-offset: .1578em !default; +$govuk-link-underline-offset: 0.1578em !default; /// Thickness of link underlines in hover state /// diff --git a/packages/govuk-frontend/src/govuk/settings/_measurements.scss b/packages/govuk-frontend/src/govuk/settings/_measurements.scss index 1440a3be97..5a8aad3614 100644 --- a/packages/govuk-frontend/src/govuk/settings/_measurements.scss +++ b/packages/govuk-frontend/src/govuk/settings/_measurements.scss @@ -19,11 +19,21 @@ $govuk-page-width: 960px !default; /// @access public $govuk-grid-widths: ( - one-quarter: (100% / 4), - one-third: (100% / 3), - one-half: (100% / 2), - two-thirds: (200% / 3), - three-quarters: (300% / 4), + one-quarter: ( + 100% / 4 + ), + one-third: ( + 100% / 3 + ), + one-half: ( + 100% / 2 + ), + two-thirds: ( + 200% / 3 + ), + three-quarters: ( + 300% / 4 + ), full: 100% ) !default; diff --git a/packages/govuk-frontend/src/govuk/settings/_media-queries.scss b/packages/govuk-frontend/src/govuk/settings/_media-queries.scss index 20ddca8606..45837bfad4 100644 --- a/packages/govuk-frontend/src/govuk/settings/_media-queries.scss +++ b/packages/govuk-frontend/src/govuk/settings/_media-queries.scss @@ -8,8 +8,8 @@ /// @access public $govuk-breakpoints: ( - mobile: 320px, - tablet: 641px, + mobile: 320px, + tablet: 641px, desktop: 769px ) !default; diff --git a/packages/govuk-frontend/src/govuk/settings/_warnings.scss b/packages/govuk-frontend/src/govuk/settings/_warnings.scss index 8d50a04a03..6a63fcf13b 100644 --- a/packages/govuk-frontend/src/govuk/settings/_warnings.scss +++ b/packages/govuk-frontend/src/govuk/settings/_warnings.scss @@ -67,6 +67,5 @@ $govuk-suppressed-warnings: () !default; /// @access private @function _warning-text($key, $message) { - @return $message + " To silence this warning, update $govuk-suppressed-warnings " + - "with key: \"#{$key}\""; + @return $message + " To silence this warning, update $govuk-suppressed-warnings " + 'with key: "#{$key}"'; } diff --git a/packages/govuk-frontend/src/govuk/tools/_font-url.scss b/packages/govuk-frontend/src/govuk/tools/_font-url.scss index 835dc69e53..c3294d1031 100644 --- a/packages/govuk-frontend/src/govuk/tools/_font-url.scss +++ b/packages/govuk-frontend/src/govuk/tools/_font-url.scss @@ -13,9 +13,8 @@ /// @access public @function govuk-font-url($filename) { - $use-custom-function: variable-exists("govuk-font-url-function") - and $govuk-font-url-function - and function-exists($govuk-font-url-function); + $use-custom-function: variable-exists("govuk-font-url-function") and $govuk-font-url-function and + function-exists($govuk-font-url-function); @if $use-custom-function { @return call(get-function($govuk-font-url-function), $filename); diff --git a/packages/govuk-frontend/src/govuk/tools/_image-url.scss b/packages/govuk-frontend/src/govuk/tools/_image-url.scss index 32bf9036a2..c82cb47a0a 100644 --- a/packages/govuk-frontend/src/govuk/tools/_image-url.scss +++ b/packages/govuk-frontend/src/govuk/tools/_image-url.scss @@ -13,9 +13,8 @@ /// @access public @function govuk-image-url($filename) { - $use-custom-function: variable-exists("govuk-image-url-function") - and $govuk-image-url-function - and function-exists($govuk-image-url-function); + $use-custom-function: variable-exists("govuk-image-url-function") and $govuk-image-url-function and + function-exists($govuk-image-url-function); @if $use-custom-function { @return call(get-function($govuk-image-url-function), $filename); From fdf38110216efd44aece2307baad237c28b08afc Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Thu, 15 Jun 2023 08:23:39 +0100 Subject: [PATCH 07/10] Adjust Stylelint disable comment to avoid Prettier reflow When formatting with Prettier the comment is moved to its own line making Stylelint disable a different one --- .../govuk-frontend/src/govuk/components/fieldset/_index.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/govuk-frontend/src/govuk/components/fieldset/_index.scss b/packages/govuk-frontend/src/govuk/components/fieldset/_index.scss index 0dae851446..02278648a2 100644 --- a/packages/govuk-frontend/src/govuk/components/fieldset/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/fieldset/_index.scss @@ -9,13 +9,14 @@ // Fix for Firefox < 53 // https://bugzilla.mozilla.org/show_bug.cgi?id=504622 + // stylelint-disable selector-type-no-unknown -- Ignore unknown 'x:-moz-any-link' @supports not (caret-color: auto) { .govuk-fieldset, x:-moz-any-link { - // stylelint-disable-line selector-type-no-unknown display: table-cell; } } + // stylelint-enable selector-type-no-unknown .govuk-fieldset__legend { @include govuk-font($size: 19); From 9bc8c33d637ea112ff4bfc944ecdf28249a3fd6d Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Fri, 4 Aug 2023 11:38:03 +0100 Subject: [PATCH 08/10] Adjust Sass lines manually to balance code style with line length We can add `// prettier-ignore` where we disagree with the default formatting --- .../src/govuk/components/back-link/_index.scss | 6 ++---- .../src/govuk/components/breadcrumbs/_index.scss | 6 ++---- .../src/govuk/components/checkboxes/_index.scss | 4 ++-- .../govuk-frontend/src/govuk/components/hint/_index.scss | 6 ++---- .../govuk-frontend/src/govuk/components/radios/_index.scss | 4 ++-- packages/govuk-frontend/src/govuk/tools/_font-url.scss | 6 ++++-- packages/govuk-frontend/src/govuk/tools/_image-url.scss | 6 ++++-- 7 files changed, 18 insertions(+), 20 deletions(-) diff --git a/packages/govuk-frontend/src/govuk/components/back-link/_index.scss b/packages/govuk-frontend/src/govuk/components/back-link/_index.scss index ff426947bc..3bef68cd76 100644 --- a/packages/govuk-frontend/src/govuk/components/back-link/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/back-link/_index.scss @@ -50,12 +50,10 @@ border-color: $chevron-border-colour; @supports (border-width: unquote("max(0px)")) { - border-width: unquote( - "max(#{$chevron-border-min-width}, #{$chevron-border-width}) max(#{$chevron-border-min-width}, #{$chevron-border-width})" - ) - 0 0; + $border-width-eval: "max(#{$chevron-border-min-width}, #{$chevron-border-width})"; // Ensure that the chevron never gets smaller than 16px + border-width: unquote($border-width-eval) unquote($border-width-eval) 0 0; font-size: unquote("max(#{$font-size * 1px}, 1em)"); } } diff --git a/packages/govuk-frontend/src/govuk/components/breadcrumbs/_index.scss b/packages/govuk-frontend/src/govuk/components/breadcrumbs/_index.scss index cac755cb26..8550b44b12 100644 --- a/packages/govuk-frontend/src/govuk/components/breadcrumbs/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/breadcrumbs/_index.scss @@ -72,12 +72,10 @@ border-color: $chevron-border-colour; @supports (border-width: unquote("max(0px)")) { - border-width: unquote( - "max(#{$chevron-border-min-width}, #{$chevron-border-width}) max(#{$chevron-border-min-width}, #{$chevron-border-width})" - ) - 0 0; + $border-width-eval: "max(#{$chevron-border-min-width}, #{$chevron-border-width})"; // Ensure that the chevron never gets smaller than 16px + border-width: unquote($border-width-eval) unquote($border-width-eval) 0 0; font-size: unquote("max(#{$font-size * 1px}, 1em)"); } } diff --git a/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss b/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss index 42f0ee85b8..dacfeb4e91 100644 --- a/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/checkboxes/_index.scss @@ -288,9 +288,9 @@ @media screen and (forced-colors: active), (-ms-high-contrast: active) { outline-color: Highlight; } + // prettier-ignore box-shadow: - 0 0 0 $govuk-focus-width $govuk-focus-colour, - // 1 + 0 0 0 $govuk-focus-width $govuk-focus-colour, // 1 0 0 0 $govuk-hover-width $govuk-hover-colour; // 2 } diff --git a/packages/govuk-frontend/src/govuk/components/hint/_index.scss b/packages/govuk-frontend/src/govuk/components/hint/_index.scss index e651aa7abe..03491d2f38 100644 --- a/packages/govuk-frontend/src/govuk/components/hint/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/hint/_index.scss @@ -31,10 +31,8 @@ // This adjustment will not work in browsers that do not support :not(). // Users with these browsers will see the default size margin (5px larger). - .govuk-fieldset__legend:not(.govuk-fieldset__legend--m):not(.govuk-fieldset__legend--l):not( - .govuk-fieldset__legend--xl - ) - + .govuk-hint { + // prettier-ignore + .govuk-fieldset__legend:not(.govuk-fieldset__legend--m):not(.govuk-fieldset__legend--l):not(.govuk-fieldset__legend--xl) + .govuk-hint { margin-bottom: govuk-spacing(2); } diff --git a/packages/govuk-frontend/src/govuk/components/radios/_index.scss b/packages/govuk-frontend/src/govuk/components/radios/_index.scss index 773d05211d..8e62e31d80 100644 --- a/packages/govuk-frontend/src/govuk/components/radios/_index.scss +++ b/packages/govuk-frontend/src/govuk/components/radios/_index.scss @@ -308,9 +308,9 @@ @media screen and (forced-colors: active), (-ms-high-contrast: active) { outline-color: Highlight; } + // prettier-ignore box-shadow: - 0 0 0 $govuk-radios-focus-width $govuk-focus-colour, - // 1 + 0 0 0 $govuk-radios-focus-width $govuk-focus-colour // 1, 0 0 0 $govuk-hover-width $govuk-hover-colour; // 2 } diff --git a/packages/govuk-frontend/src/govuk/tools/_font-url.scss b/packages/govuk-frontend/src/govuk/tools/_font-url.scss index c3294d1031..0bdf8d3df9 100644 --- a/packages/govuk-frontend/src/govuk/tools/_font-url.scss +++ b/packages/govuk-frontend/src/govuk/tools/_font-url.scss @@ -13,8 +13,10 @@ /// @access public @function govuk-font-url($filename) { - $use-custom-function: variable-exists("govuk-font-url-function") and $govuk-font-url-function and - function-exists($govuk-font-url-function); + // prettier-ignore + $use-custom-function: variable-exists("govuk-font-url-function") + and $govuk-font-url-function + and function-exists($govuk-font-url-function); @if $use-custom-function { @return call(get-function($govuk-font-url-function), $filename); diff --git a/packages/govuk-frontend/src/govuk/tools/_image-url.scss b/packages/govuk-frontend/src/govuk/tools/_image-url.scss index c82cb47a0a..4e008098f7 100644 --- a/packages/govuk-frontend/src/govuk/tools/_image-url.scss +++ b/packages/govuk-frontend/src/govuk/tools/_image-url.scss @@ -13,8 +13,10 @@ /// @access public @function govuk-image-url($filename) { - $use-custom-function: variable-exists("govuk-image-url-function") and $govuk-image-url-function and - function-exists($govuk-image-url-function); + // prettier-ignore + $use-custom-function: variable-exists("govuk-image-url-function") + and $govuk-image-url-function + and function-exists($govuk-image-url-function); @if $use-custom-function { @return call(get-function($govuk-image-url-function), $filename); From 0bb01c60d98810ee8966d2ff4b1a97547eb96c14 Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Fri, 4 Aug 2023 12:16:31 +0100 Subject: [PATCH 09/10] Update CSS linting documentation for Prettier --- docs/contributing/coding-standards/css.md | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/docs/contributing/coding-standards/css.md b/docs/contributing/coding-standards/css.md index 0b60ca2449..641188ed1f 100644 --- a/docs/contributing/coding-standards/css.md +++ b/docs/contributing/coding-standards/css.md @@ -113,6 +113,8 @@ This makes it easier to keep track of different contexts. To ensure code quality and consistency in our Sass files we check that certain rules are followed. These rules are based on [GDS Stylelint Config](https://github.com/alphagov/stylelint-config-gds/blob/main/scss.js), but we also add our own custom rules with a project [config file](/stylelint.config.js). +For consistent formatting we run [Prettier](https://prettier.io). + See [testing and linting](/docs/releasing/testing-and-linting.md) for more information. ## Running the lint task @@ -125,6 +127,16 @@ To automatically fix Stylelint issues, add the `--fix` flag: npm run lint:scss -- --fix ``` +## Running the formatting task + +You can run the formatter with `npm run lint:prettier`, or use formatting in [Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) and [other editors that support Prettier](https://prettier.io/docs/en/editors.html) + +To automatically fix Prettier issues in all supported files, add the `--write` flag: + +```shell +npm run lint:prettier -- --write +``` + ## Linting rules We use the following rules when linting files: From b44022f0ddb62268ee608c699670bc93529140fc Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Fri, 4 Aug 2023 12:12:21 +0100 Subject: [PATCH 10/10] Update Sass guidance for Prettier leading zeroes --- docs/contributing/coding-standards/css.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/contributing/coding-standards/css.md b/docs/contributing/coding-standards/css.md index 641188ed1f..c5f263e183 100644 --- a/docs/contributing/coding-standards/css.md +++ b/docs/contributing/coding-standards/css.md @@ -505,13 +505,13 @@ Good: $my-example-var: value; ``` -### Don't write leading or trailing zeroes for numeric values with a decimal point +### Write leading or trailing zeroes for numeric values with a decimal point Bad: ```scss .selector { - font-size: 0.50em; + font-size: .50em; } ``` @@ -519,7 +519,7 @@ Good: ```scss .selector { - font-size: .5em; + font-size: 0.5em; } ```