desert oasis
Tailwind's parser isn't able to detect the sm:grid-cols- because it is not a valid class name without the number. There is some guidance about dynamic class names in the tailwind docs. https://tailwindcss.com/docs/content-configuration#dynamic-class-names
Probably the easiest thing is just to make CardCols be the class name instead of a number. var cardCols = cardsResponse.cards.length % 3 == 0 ? 'sm:grid-cols-6' : sm:grid-cols-3;. Tailwind should be able to parse that.
Alternatively, you could add the classes to the safelist so they won't ever be purged. https://tailwindcss.com/docs/content-configuration#safelisting-classes but this seems more brittle to me in the long term.
tepid wasp
Thanks, that worked :). Is there a better way within qwik to have logic in the classes rather than just doing the string concat? Also as I mentioned I am very new to qwik. I wanted to do something like this but it wouldn't work... class="grid gap-2 lg:gap-4 grid-cols-1 {dynamicClass}", in Vue you can have a class="..." then :class="{expression}" and it will concat them together. This seems a nicer way than I am using above.
desert oasis
You can still do that in Qwik. 👍 The problem isn't with Qwik, it's with Tailwind not being able to correctly determine the class names. It needs to see full class names to work correctly.
tepid wasp
You can do which bit in Qwik? I have it working now with your suggestion of the logic having the full class name so thanks for that. I am just not a fan of how it is implemented and wondered if there was a nicer syntax in Qwik in order to concatenate some static classes with a dynamic one in the actual class definition rather than outside.