Website Structure

This commit is contained in:
supalerk-ar66 2026-01-13 10:46:40 +07:00
parent 62812f2090
commit 71f0676a62
22365 changed files with 4265753 additions and 791 deletions

View file

@ -0,0 +1,9 @@
# Changes to PostCSS Nesting
### 13.0.2
_June 10, 2025_
- Updated [`@csstools/selector-resolve-nested`](https://github.com/csstools/postcss-plugins/tree/main/packages/selector-resolve-nested) to [`3.1.0`](https://github.com/csstools/postcss-plugins/tree/main/packages/selector-resolve-nested/CHANGELOG.md#310) (minor)
[Full CHANGELOG](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting/CHANGELOG.md)

View file

@ -0,0 +1,18 @@
MIT No Attribution (MIT-0)
Copyright © CSSTools Contributors
Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the “Software”), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
of the Software, and to permit persons to whom the Software is furnished to do
so.
THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

255
Frontend-Learner/node_modules/postcss-nesting/README.md generated vendored Normal file
View file

@ -0,0 +1,255 @@
# PostCSS Nesting [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][PostCSS]
`npm install postcss-nesting --save-dev`
[PostCSS Nesting] lets you nest style rules inside each other, following the [CSS Nesting specification].
If you want nested rules the same way [Sass] works
you might want to use [PostCSS Nested] instead.
```css
.foo {
color: red;
&:hover {
color: green;
}
> .bar {
color: blue;
}
@media (prefers-color-scheme: dark) {
color: cyan;
}
color: pink;
}
/* becomes */
.foo {
color: red;
}
.foo:hover {
color: green;
}
.foo > .bar {
color: blue;
}
@media (prefers-color-scheme: dark) {
.foo {
color: cyan;
}
}
.foo {
color: pink;
}
```
## Usage
Add [PostCSS Nesting] to your project:
```bash
npm install postcss postcss-nesting --save-dev
```
Use it as a [PostCSS] plugin:
```js
const postcss = require('postcss');
const postcssNesting = require('postcss-nesting');
postcss([
postcssNesting(/* pluginOptions */)
]).process(YOUR_CSS /*, processOptions */);
```
## Options
### edition
The CSS nesting feature has gone through several iterations and what is currently implemented in browsers is not the same as what was originally proposed. This plugin dates back to the original proposal and you might have written your CSS expecting this older behavior.
You can pick the older behavior by setting the `edition` option.
The `edition` values correspond with rough dates when of a particular version of the specification:
- `2024-02` (default)
- `2021`
> [!TIP]
> If you wrote nested rules with `@nest` you definitely want to set the `edition` to `2021`.
> If you are unsure than you should try to omit the `edition` option and use the default.
Eventually we will remove support for the older edition, and this plugin option, so it is strongly advised to update your CSS to the latest edition.
```js
postcssNesting({
edition: '2024-02'
})
```
#### `2024-02` (default)
- usage of `:is()` pseudo-class in the generated CSS is no longer optional. However you can add [`postcss-is-pseudo-class`](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-is-pseudo-class) to transpile further
- at rules are not combined with the `and` keyword
- `@nest` is removed from the specification
- declarations and nested rules/at-rules are no longer re-ordered
#### `2021`
This version is a continuation of what existed before CSS nesting was implemented in browsers.
It made a few non-invasive changes to keep up with implementations but it is falling behind.
```css
.foo {
color: red;
&:hover {
color: green;
}
> .bar {
color: blue;
}
@media (prefers-color-scheme: dark) {
color: cyan;
}
color: pink;
}
/* becomes */
.foo {
color: red;
color: pink;
}
.foo:hover {
color: green;
}
.foo > .bar {
color: blue;
}
@media (prefers-color-scheme: dark) {
.foo {
color: cyan;
}
}
```
### noIsPseudoSelector (edition: `2021`)
#### Specificity
Before :
```css
#alpha,
.beta {
&:hover {
order: 1;
}
}
```
After **without** the option :
```js
postcssNesting()
```
```css
:is(#alpha,.beta):hover {
order: 1;
}
```
_`.beta:hover` has specificity as if `.beta` where an id selector, matching the specification._
[specificity: 1, 1, 0](https://polypane.app/css-specificity-calculator/#selector=%3Ais(%23alpha%2C.beta)%3Ahover)
After **with** the option :
```js
postcssNesting({
noIsPseudoSelector: true
})
```
```css
#alpha:hover, .beta:hover {
order: 1;
}
```
_`.beta:hover` has specificity as if `.beta` where a class selector, conflicting with the specification._
[specificity: 0, 2, 0](https://polypane.app/css-specificity-calculator/#selector=.beta%3Ahover)
#### Complex selectors
Before :
```css
.alpha > .beta {
& + & {
order: 2;
}
}
```
After **without** the option :
```js
postcssNesting()
```
```css
:is(.alpha > .beta) + :is(.alpha > .beta) {
order: 2;
}
```
After **with** the option :
```js
postcssNesting({
noIsPseudoSelector: true
})
```
```css
.alpha > .beta + .alpha > .beta {
order: 2;
}
```
_this is a different selector than expected as `.beta + .alpha` matches `.beta` followed by `.alpha`._<br>
_avoid these cases when you disable `:is()`_<br>
_writing the selector without nesting is advised here_
```css
/* without nesting */
.alpha > .beta + .beta {
order: 2;
}
```
[cli-url]: https://github.com/csstools/postcss-plugins/actions/workflows/test.yml?query=workflow/test
[css-url]: https://cssdb.org/#nesting-rules
[discord]: https://discord.gg/bUadyRwkJS
[npm-url]: https://www.npmjs.com/package/postcss-nesting
[PostCSS]: https://github.com/postcss/postcss
[PostCSS Nesting]: https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting
[PostCSS Nested]: https://github.com/postcss/postcss-nested
[Sass]: https://sass-lang.com/
[CSS Nesting specification]: https://www.w3.org/TR/css-nesting-1/

File diff suppressed because one or more lines are too long

View file

@ -0,0 +1,26 @@
import type { PluginCreator } from 'postcss';
declare const creator: PluginCreator<pluginOptions>;
export default creator;
/** postcss-nesting plugin options */
export declare type pluginOptions = {
/** The implementation edition for CSS Nesting, default to '2024-02' */
edition?: '2021' | '2024-02';
} & pluginOptions2021 & pluginOptions2024_02;
/** postcss-nesting plugin options */
export declare type pluginOptions2021 = {
/** Avoid the `:is()` pseudo class as much as possible. default: false */
noIsPseudoSelector?: boolean;
/** Silence the `@nest` warning. */
silenceAtNestWarning?: boolean;
};
/** postcss-nesting plugin options */
export declare type pluginOptions2024_02 = {
/** @deprecated This option was removed. You must migrate your CSS to the latest speciation to continue using this plugin. */
noIsPseudoSelector?: boolean;
};
export { }

File diff suppressed because one or more lines are too long

View file

@ -0,0 +1,90 @@
{
"name": "postcss-nesting",
"description": "Nest rules inside each other in CSS",
"version": "13.0.2",
"contributors": [
{
"name": "Antonio Laguna",
"email": "antonio@laguna.es",
"url": "https://antonio.laguna.es"
},
{
"name": "Jonathan Neal",
"email": "jonathantneal@hotmail.com"
},
{
"name": "Romain Menke",
"email": "romainmenke@gmail.com"
}
],
"license": "MIT-0",
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/csstools"
},
{
"type": "opencollective",
"url": "https://opencollective.com/csstools"
}
],
"engines": {
"node": ">=18"
},
"type": "module",
"main": "dist/index.cjs",
"module": "dist/index.mjs",
"jsdelivr": "dist/index.mjs",
"unpkg": "dist/index.mjs",
"exports": {
".": {
"import": {
"types": "./dist/index.d.ts",
"default": "./dist/index.mjs"
},
"require": {
"default": "./dist/index.cjs"
}
}
},
"files": [
"CHANGELOG.md",
"LICENSE.md",
"README.md",
"dist"
],
"dependencies": {
"@csstools/selector-resolve-nested": "^3.1.0",
"@csstools/selector-specificity": "^5.0.0",
"postcss-selector-parser": "^7.0.0"
},
"peerDependencies": {
"postcss": "^8.4"
},
"scripts": {},
"homepage": "https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting#readme",
"repository": {
"type": "git",
"url": "git+https://github.com/csstools/postcss-plugins.git",
"directory": "plugins/postcss-nesting"
},
"bugs": "https://github.com/csstools/postcss-plugins/issues",
"keywords": [
"atrules",
"child",
"children",
"css",
"cssnext",
"csswg",
"nested",
"nestings",
"postcss",
"postcss-plugin",
"rules",
"selectors",
"specifications",
"specs",
"syntax",
"w3c"
]
}