Skip to content

Add safelist-like option for variables from the preset wind4 #4694

@onmax

Description

@onmax

Clear and concise description of the problem

I have multiple CSS files that I process and add them to UnoCSS via rules or preflights.

I am finalizing migrating the content to the new colors structure. Some of the colors are defined in the CSS files only and added via preflights so the theme is not aware of those keys and does not generate the CSS variables.

Suggested solution

import { createRemToPxProcessor } from '@unocss/preset-wind4/utils'
import { defineConfig, presetWind4 } from 'unocss'

export default defineConfig({
  presets: [
    presetWind4({
      preflights: { 
        theme: { 
          safelist: ['colors:blue-500'], // will add --colors-blue-500 to :root
        } 
      }, 
    }),
  ],
})

Alternative

I am not really sure how to solve this in a clean way... I am trying something, but it is not working. See playground

  • Setting mode:true

Additional context

No response

Validations

  • Read the Contributing Guidelines.
  • Read the README.md of using the package.
  • Already used the Interactive Docs.
  • Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions