Grid columns and media queries

[puzzle-it-nu]

First of all: great work 👍

But I seemed to have run into a problem.
I would like to have a 4 column layout in a ::card-group but it looks like the class="grid grid-cols-4" is overridden in the card-group component. (

shadcn-docs-nuxt/components/content/CardGroup.vue

Line 2 in aa0db3e

<div class="group grid gap-4 md:grid-cols-2 [&:not(:first-child)]:mt-5">

)

I'm I missing something? besides overwriting CardGroup.vue

::card-group{class="grid grid-cols-4"}
    ::card
    ---
    title: GB WegBeheer
    to: /wegbeheer
    target: _self
    ---

    ![](/images/software/gb_wegbeheer.jpg){class="size-full"}

    #footer
    Voor het beheren van wegen en verhardingen
    ::
// repeat the above card 3 more times and don't get a 4 column layout but a 2 column layout
::

Regards,

Joop

[ZTL-UwU]

Adding md:grid-cols-4 will fix it.

::card-group{class="grid-cols-4 md:grid-cols-4"}
  // ...
::

[puzzle-it-nu]

Thanks, that works indeed. I don't know how many things I've tried, thanks.

Joop