postcss-global-theme

PostCSS plugin to support theming using global class

Usage no npm install needed!

<script type="module">
  import postcssGlobalTheme from 'https://cdn.skypack.dev/postcss-global-theme';
</script>

README

PostCSS Global Theme Build Status

PostCSS plugin to support theming using global class.

/* Input example */
@theme {
    .text {
        border: solid $accent 1px;
    }
}
/* Output example */
.text {
    border: solid $accent 1px;
}

:global(.dark) .text {
    border: solid $dark-accent 1px;
}

:global(.light) .text {
    border: solid $light-accent 1px;
}

Usage

postcss([
    require('postcss-global-theme')({
        theme: ['dark', 'light']
    })
])

See PostCSS docs for examples for your environment.