6.0.1 • Published 1 year ago

postcss-nested v6.0.1

Weekly downloads
1,081,448
License
MIT
Repository
github
Last release
1 year ago

PostCSS Nested

PostCSS plugin to unwrap nested rules closer to Sass syntax.

.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:

.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:

Docs

Read full docs here.

arcade-ui@novicell/styles-breadcrumbnujekgloballistings-test-componentslipemat-postcss-boilerplate@rock-kit/ui-postcss-configlipemat-js-boilerplate@n-works/assets-builderapp-campussingle-page-appgintonicpostcss-config-packce-webpack-tempreact-nt-modal@spheric/operandidstack-reactgatsby-fassetreactor-vue-components@dubb/mickeyrm-react-scripts@splurtcake/shared-component-librarydsavelyev@kundinos/ssr-builder@nghiepuit/sdk-builderbase-sdk-buildernghiepuit-build-tools@nghiepuit/react-build-tool@slaty/compilermfp-react-componentsvideo-clip-ljsbrowcompmk-beter-cli@dnb-hugo/postcss-configtq-mui@fspo/design-system@temporg/ui-postcss-configbukazu.react-portaltorch-csswenchao-vue@kununu/react-universal-scripts@gatsbyonfire/tailwind@olivervorasai/slidervuepress-theme-tsed2@eaze/eaze-web-scriptspluggable-postcss-nestedreact-storybook-scripts@donutteam/internal-build-scriptswidget-engine@infinitebrahmanuniverse/nolb-postcss-n@saaspe/componentstailwindcss-with-commentstailwindcss-wo-normalizelit-tailwind-poc-2tailwindcsssklif-ui-kitsklif-api@everything-registry/sub-chunk-2461@314oner_npm/universal-components-library@yme/postcss-preset@yme/postcss-preset-ymesphereuisklif-uimachinebeemrcapslikec4lincd-clilincd-serverliminoid-reactk2-redux-react-scriptsk2-tailwind-react-scriptsk2-curated-react-scriptskadrekrondolekzas-dsletherego932letsgoobradervitalizerlib-theme-contructorlitepie-datepicker-gabelevel4letterpadli-react-scriptslms-react-sdkhipster-csshiqhoteakirei-csskanopisidebarkarvickytea93klosokk-scriptskintilidin15kr5ftcstlaravel-mix-react-css-moduleslembah1leonardsinggihtea46leet-speak-converterlearning_lockerigniteikuncss
6.0.1

1 year ago

6.0.0

1 year ago

5.0.6

3 years ago

5.0.5

3 years ago

5.0.4

3 years ago

5.0.3

3 years ago

5.0.2

3 years ago

5.0.1

4 years ago

5.0.0

4 years ago

4.2.3

4 years ago

4.2.2

4 years ago

4.2.1

4 years ago

4.2.0

4 years ago

4.1.2

5 years ago

4.1.1

5 years ago

4.1.0

6 years ago

4.0.0

6 years ago

3.0.0

6 years ago

2.1.2

7 years ago

2.1.1

7 years ago

2.1.0

7 years ago

2.0.4

7 years ago

2.0.3

7 years ago

2.0.2

7 years ago

2.0.1

7 years ago

2.0.0

7 years ago

1.0.1

7 years ago

1.0.0

9 years ago

0.3.2

9 years ago

0.3.1

9 years ago

0.3.0

9 years ago

0.2.2

9 years ago

0.2.1

9 years ago

0.2.0

9 years ago

0.1.0

9 years ago