Newer
Older
pre-www / src / assets / css / blocks / grid-list.css
.block-grid-list{
    container-type: inline-size;
    &__inner{
        @apply grid lg:grid-cols-2 xl:grid-cols-4 gap-x-[calc(var(--grid-gutter)*2)] gap-y-base;
        > div{
            @apply border-t border-grey-200 pt-2;
            p{
                @apply text-size-base mb-0;
                &:first-child{
                    @apply text-grey-300;
                }
            }
        }
    }
}

@container (min-width: 35rem){
    .block-grid-list__inner{
        @apply md:grid-cols-2;
    }
}

@container (min-width: 56rem) {
    .block-grid-list__inner{
        @apply lg:grid-cols-3;
    }
}

@container (min-width: 62rem) {
    .block-grid-list__inner{
        @apply xl:grid-cols-4;
    }
}