unocss / unocss

The instant on-demand atomic CSS engine.
https://unocss.dev
MIT License
16.57k stars 833 forks source link

Feature proposal: replace `screen-<unit>` strings in arbitrary values with their actual pixel value #4126

Closed UltraCakeBakery closed 1 month ago

UltraCakeBakery commented 1 month ago

Clear and concise description of the problem

I want to be able to do this: px-[calc(screen-xl/2)] to easily create padding that centers the content of an scrollable to emulates mx-auto centration of content.

Now I have to manually convert the pixel value of screen-xl like so px-[calc(1280px/2]

Suggested solution

UnoCSS should replace screen-xl in the [] arbitrary value with its actual value which also gets used in utilities such as w-screen-xl

Alternative

No response

Additional context

No response

Validations

henrikvilhelmberglund commented 1 month ago

Use https://unocss.dev/transformers/directives and theme().

px-[calc(theme(breakpoints.xl)/2)]

play

UltraCakeBakery commented 1 month ago

Pff, I forgot about that directive! Thanks for making me aware. I think that using the directive is a sufficient, so I'll close this issue as not planned.