@tailwindcss/@container-queries support

[zslabs]

Hi there! It looks like the @tailwindcss/container-queries https://github.com/tailwindlabs/tailwindcss-container-queries plugin may not be supported due to a compilation error with the types. I tried using the Vite example https://typewind.vercel.app/docs/examples/vite

SyntaxError: CssSyntaxError: Unknown word (1:43)
> 1 | .\@container {container-type: inline-size;container-name}

[Mokshit06]

Container queries plugin isn't working right now because typewind doesn't have a syntax for classes that start with @. Once I've decided on a syntax for that, it will work. For now I can maybe make it ignore this and generate the types for rest if that makes it easier to use

[Mokshit06]

This has been fixed in v0.0.7 https://github.com/Mokshit06/typewind/commit/3d1472f4acc8b563f60e2c1b4c79679b17503bbb. The syntax is:

<div className={tw.$container}>
    <div className={tw.block.$lg(tw.flex)}>
    </div>
</div>

Just replaces @ with $

[zslabs]

Very cool, thank you!

[kavinvalli]

Added to the docs @zslabs!