Logo Windi CSS

Recent changes (v3.0.0-v3.0.5)

Windi CLI

Recently we have added some new features and bug fixes in windi cli, the documentation has been changed, please check it out.

  • Attributify mode support
  • Dev mode
  • Fuzzy match
  • Style block support
  • Support extractors in config
  • bug fixes and performance improvements

Color Callback function

We now support color callback, which allows you to specify variables with support for opacity.

module.exports = {
  theme: {
    colors: {
      primary: ({ opacityVariable, opacityValue }) => {
        if (opacityValue !== undefined)
          return `rgba(var(--color-primary), ${opacityValue})`

        if (opacityVariable !== undefined)
          return `rgba(var(--color-primary), var(${opacityVariable}, 1))`

        return 'rgb(var(--color-primary))'
      },
    },
  },
  // ...
}

Handlers Config

Added a handlers config. If you want to turn off auto-infer completely, you can configure

windi.config.js
module.exports = {
  theme: {
    // …
  },
  handlers: {
    static: true,
  },
}

Default Value

module.exports = {
  handlers: {
    static: true,
    number: true,
    bracket: true,
    hex: true,
    nxl: true,
    fraction: true,
    size: true,
    variable: true,
    negative: true,
  },
}

Bug Fixes

#287 #75 #256 #270 #242 #226 #274 #266 #197 #179 #219 #246 #262 #245