PostCSS Scope Pseudo Class

npm install @csstools/postcss-scope-pseudo-class --save-dev

PostCSS Scope Pseudo Class lets you use the :scope Pseudo-class following the Selectors 4 specification.

:scope {
	color: green;
}

/* becomes */

:root {
	color: green;
}

Usage

Add PostCSS Scope Pseudo Class to your project:

npm install postcss @csstools/postcss-scope-pseudo-class --save-dev

Use it as a PostCSS plugin:

const postcss = require('postcss');
const postcssScopePseudoClass = require('@csstools/postcss-scope-pseudo-class');

postcss([
	postcssScopePseudoClass(/* pluginOptions */)
]).process(YOUR_CSS /*, processOptions */);

Options

preserve

The preserve option determines whether the original notation is preserved. By default, it is not preserved.

postcssScopePseudoClass({ preserve: true })

:scope {
	color: green;
}

/* becomes */

:root {
	color: green;
}
:scope {
	color: green;
}

Current Tags

• 5.0.0                                ...           latest (3 months ago)

9 Versions

• 5.0.0                                ...           3 months ago
• 4.0.1                                ...           a year ago
• 4.0.0                                ...           2 years ago
• 3.0.1                                ...           2 years ago
• 3.0.0                                ...           3 years ago
• 2.0.2                                ...           3 years ago
• 2.0.1                                ...           3 years ago
• 2.0.0                                ...           3 years ago
• 1.0.0                                ...           3 years ago