diff --git a/package-lock.json b/package-lock.json index 6a6eb4b94783..f75e3068b85d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -43,6 +43,7 @@ "pdfobject": "2.3.0", "postcss": "8.4.35", "postcss-loader": "8.1.1", + "postcss-nesting": "12.1.0", "pretty-ms": "9.0.0", "sortablejs": "1.15.2", "swagger-ui-dist": "5.11.8", @@ -528,11 +529,31 @@ "@csstools/css-tokenizer": "^2.2.3" } }, + "node_modules/@csstools/selector-resolve-nested": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@csstools/selector-resolve-nested/-/selector-resolve-nested-1.1.0.tgz", + "integrity": "sha512-uWvSaeRcHyeNenKg8tp17EVDRkpflmdyvbE0DHo6D/GdBb6PDnCYYU6gRpXhtICMGMcahQmj2zGxwFM/WC8hCg==", + "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.13" + } + }, "node_modules/@csstools/selector-specificity": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-3.0.2.tgz", "integrity": "sha512-RpHaZ1h9LE7aALeQXmXrJkRG84ZxIsctEN2biEUmFyKpzFM3zZ35eUMcIzZFsw/2olQE6v69+esEqU2f1MKycg==", - "dev": true, "funding": [ { "type": "github", @@ -9816,6 +9837,32 @@ "postcss": "^8.2.14" } }, + "node_modules/postcss-nesting": { + "version": "12.1.0", + "resolved": "https://registry.npmjs.org/postcss-nesting/-/postcss-nesting-12.1.0.tgz", + "integrity": "sha512-QOYnosaZ+mlP6plQrAxFw09UUp2Sgtxj1BVHN+rSVbtV0Yx48zRt9/9F/ZOoxOKBBEsaJk2MYhhVRjeRRw5yuw==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/csstools" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/csstools" + } + ], + "dependencies": { + "@csstools/selector-resolve-nested": "^1.1.0", + "@csstools/selector-specificity": "^3.0.2", + "postcss-selector-parser": "^6.0.13" + }, + "engines": { + "node": "^14 || ^16 || >=18" + }, + "peerDependencies": { + "postcss": "^8.4" + } + }, "node_modules/postcss-resolve-nested-selector": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz", diff --git a/package.json b/package.json index d5e8170228c8..26632480e88f 100644 --- a/package.json +++ b/package.json @@ -42,6 +42,7 @@ "pdfobject": "2.3.0", "postcss": "8.4.35", "postcss-loader": "8.1.1", + "postcss-nesting": "12.1.0", "pretty-ms": "9.0.0", "sortablejs": "1.15.2", "swagger-ui-dist": "5.11.8", diff --git a/webpack.config.js b/webpack.config.js index 3973d85344e6..d073a3e9f180 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -13,6 +13,8 @@ import {readFileSync} from 'node:fs'; import {env} from 'node:process'; import tailwindcss from 'tailwindcss'; import tailwindConfig from './tailwind.config.js'; +import tailwindcssNesting from 'tailwindcss/nesting/index.js'; +import postcssNesting from 'postcss-nesting'; const {EsbuildPlugin} = EsBuildLoader; const {SourceMapDevToolPlugin, DefinePlugin} = webpack; @@ -145,6 +147,7 @@ export default { sourceMap: sourceMaps === 'true', url: {filter: filterCssImport}, import: {filter: filterCssImport}, + importLoaders: 1, }, }, { @@ -152,7 +155,10 @@ export default { options: { postcssOptions: { map: false, // https://github.com/postcss/postcss/issues/1914 - plugins: [tailwindcss(tailwindConfig)], + plugins: [ + tailwindcssNesting(postcssNesting({edition: '2024-02'})), + tailwindcss(tailwindConfig), + ], }, }, }