Zy Filemanager

📁 File Browser

Name	Size	Permissions	Actions
📁 node_modules	DIR	0755	🗑️
📄 LICENSE (1,095 bytes)	1.07 KB	0644	✍️ ⬇️ 🗑️
📄 README.md (2,055 bytes)	2.01 KB	0644	✍️ ⬇️ 🗑️
📄 index.d.ts (1,161 bytes)	1.13 KB	0644	✍️ ⬇️ 🗑️
📝 index.js (9,040 bytes)	8.83 KB	0644	✍️ ⬇️ 🗑️

📤 Upload Files

Single File

Multiple Files

ZIP Extract

ZIP file will be deleted after extraction

➕ Create New

New Folder

New File

✍️ Editing: README.md

            File: /home/sanghavirealty/public_html/node_modulesazwer/postcss-nested/README.md

            Size: 2.01 KB | 
            Last Modified: 2023-10-27 03:37:22        

# PostCSS Nested

[PostCSS] plugin to unwrap nested rules closer to Sass syntax.

```css
.phone {
    &_title {
        width: 500px;
        @media (max-width: 500px) {
            width: auto;
        }
        body.is_dark & {
            color: white;
        }
    }
    img {
        display: block;
    }
}

.title {
  font-size: var(--font);

@at-root html {
      --font: 16px
  }
}
```

will be processed to:

```css
.phone_title {
    width: 500px;
}
@media (max-width: 500px) {
    .phone_title {
        width: auto;
    }
}
body.is_dark .phone_title {
    color: white;
}
.phone img {
    display: block;
}

.title {
  font-size: var(--font);
}
html {
  --font: 16px
}
```

Related plugins:

* Use [`postcss-current-selector`] **after** this plugin if you want
  to use current selector in properties or variables values.
* Use [`postcss-nested-ancestors`] **before** this plugin if you want
  to reference any ancestor element directly in your selectors with `^&`.

Alternatives:

* See also [`postcss-nesting`], which implements [CSSWG draft].
* [`postcss-nested-props`] for nested properties like `font-size`.

[`postcss-current-selector`]: https://github.com/komlev/postcss-current-selector
[`postcss-nested-ancestors`]: https://github.com/toomuchdesign/postcss-nested-ancestors
[`postcss-nested-props`]:     https://github.com/jedmao/postcss-nested-props
[`postcss-nesting`]:          https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-nesting
[CSSWG draft]:              https://drafts.csswg.org/css-nesting-1/
[PostCSS]:                  https://github.com/postcss/postcss

## Docs
Read full docs **[here](https://github.com/postcss/postcss-nested#readme)**.

↩️ Back