🚀 DAY 5 OF LAUNCH WEEK:Introducing Webhook Events for Alert Changes.Learn more →
Socket
Book a DemoInstallSign in
Socket

@oat-sa/postcss-global-nested

Package Overview
Dependencies
Maintainers
21
Versions
2
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@oat-sa/postcss-global-nested

PostCSS plugin to support nesting of Svelte's :global

latest
Source
npmnpm
Version
0.1.1
Version published
Weekly downloads
249
38.33%
Maintainers
21
Weekly downloads
 
Created
Source

postcss-global-nested

PostCSS plugin to better support Svelte's :global in nesting [context]

button {
    & > :global-nested(.foo) {
        &:focus {
            outline: #f66 dashed;
        }
    }
}
button > :global(.foo:focus) {
    outline: #f66 dashed;
}

Limitations

When :global-nested is the first selector, it is just replaced by :global without wrapping the nested selectors. A warning will be shown.

Usage

Step 1: Install plugin:

npm install --save-dev @oat-sa/postcss-global-nested

Step 2: Configure it

For example with postcss-preset-env:

module.exports = {
  plugins: [
    require('postcss-preset-env')({
        stage: 1,
        features: {
            'nesting-rules': {
                noIsPseudoSelector: true
            }
        },
        insertAfter: {
            'nesting-rules': require('postcss-global-nested')
        }
    })
    require('autoprefixer')
  ]
}

Options

  • globalNestedPseudo : the pattern to search for, :global-nested by default
  • globalPseudo : the replacement pseudo for the wrapper, :global by default

License

Copyright (c) 2022 Open Assessment Technologies SA

Licensed under the terms of the GNU GPL v2

Keywords

postcss

FAQs

Package last updated on 11 May 2023

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts