From cc4b6a44686508ce2ee159a266c18357f5ddb68c Mon Sep 17 00:00:00 2001 From: Oscar Otero Date: Thu, 9 May 2024 19:33:12 +0200 Subject: [PATCH] removed nesting plugin --- CHANGELOG.md | 3 +++ deps/postcss.ts | 1 - plugins/postcss.ts | 10 ++-------- tests/__snapshots__/postcss.test.ts.snap | 18 ++++++++++-------- 4 files changed, 15 insertions(+), 17 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 4b128840..c0471e78 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -22,6 +22,9 @@ Go to the `v1` branch to see the changelog of Lume 1. ### Deprecated - `liquid` plugin. It never worked well with `search.pages()` [#600]. +### Deleted +- PostCSS plugin: Don't use nesting plugin by default since CSS nesting feature works across the latest devices and browser versions. + ### Fixed - Updated dependencies: `unocss`, `liquid`, `postcss-nesting`, `terser`, `xml`, `react`, `std`, `sass`, `preact`, `esbuild`, `svgo`, `cms`, `sheetjs`. - FFF plugin: fix `getGitDate` priority [#603]. diff --git a/deps/postcss.ts b/deps/postcss.ts index 7dcc794b..178f1a0f 100644 --- a/deps/postcss.ts +++ b/deps/postcss.ts @@ -1,4 +1,3 @@ export { default as postcss } from "npm:postcss@8.4.38"; export { default as postcssImport } from "npm:postcss-import@16.1.0"; -export { default as postcssNesting } from "npm:postcss-nesting@12.1.2"; export { default as autoprefixer } from "npm:autoprefixer@10.4.19"; diff --git a/plugins/postcss.ts b/plugins/postcss.ts index c979a92b..eb28c24b 100644 --- a/plugins/postcss.ts +++ b/plugins/postcss.ts @@ -1,9 +1,4 @@ -import { - autoprefixer, - postcss, - postcssImport, - postcssNesting, -} from "../deps/postcss.ts"; +import { autoprefixer, postcss, postcssImport } from "../deps/postcss.ts"; import { merge } from "../core/utils/object.ts"; import { concurrent } from "../core/utils/concurrent.ts"; import { resolveInclude } from "../core/utils/path.ts"; @@ -26,7 +21,7 @@ export interface Options { /** * Plugins to use by postcss - * @default `[postcssNesting(), autoprefixer()]` + * @default `[autoprefixer()]` */ plugins?: unknown[]; @@ -45,7 +40,6 @@ export const defaults: Options = { }; const defaultPlugins = [ - postcssNesting(), autoprefixer(), ]; diff --git a/tests/__snapshots__/postcss.test.ts.snap b/tests/__snapshots__/postcss.test.ts.snap index 453f7d50..dd29f669 100644 --- a/tests/__snapshots__/postcss.test.ts.snap +++ b/tests/__snapshots__/postcss.test.ts.snap @@ -137,14 +137,14 @@ snapshot[`postcss plugin 3`] = ` .text { font-family: var(--font-family); -} -.text p { + & p { color: var(--color); box-shadow: 0 0 0.5em var(--background); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); } +} ", data: { basename: "index.min", @@ -174,13 +174,14 @@ snapshot[`postcss plugin 3`] = ` { content: ".text { font-family: var(--font-family); -} -.text p { + + & p { color: var(--color); box-shadow: 0 0 0.5em var(--background); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); } +} ", data: { basename: "text", @@ -373,13 +374,14 @@ snapshot[`postcss plugin without includes 3`] = ` { content: ".text { font-family: var(--font-family); -} -.text p { + + & p { color: var(--color); box-shadow: 0 0 0.5em var(--background); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); } +} ", data: { basename: "text", @@ -541,7 +543,7 @@ snapshot[`postcss plugin with hooks 2`] = `[]`; snapshot[`postcss plugin with hooks 3`] = ` [ { - content: ".foo{color:red}::root{--color:#333;--background:#fff;--font-family:sans-serif}.text{font-family:var(--font-family)}.text p{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);box-shadow:0 0 .5em var(--background);color:var(--color)}", + content: ".foo{color:red}::root{--color:#333;--background:#fff;--font-family:sans-serif}.text{font-family:var(--font-family);& p{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);box-shadow:0 0 .5em var(--background);color:var(--color)}}", data: { basename: "index.min", content: '@import "variables.css"; @@ -568,7 +570,7 @@ snapshot[`postcss plugin with hooks 3`] = ` }, }, { - content: ".text{font-family:var(--font-family)}.text p{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);box-shadow:0 0 .5em var(--background);color:var(--color)}", + content: ".text{font-family:var(--font-family);& p{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);box-shadow:0 0 .5em var(--background);color:var(--color)}}", data: { basename: "text", content: ".text {