Строка вместе адаптивных классов в TailwindCSS

Question

Я пытался Google это, но я либо не использую правильные термины, либо никто еще не задал мой вопрос.

Вопрос: Есть ли способ сложить адаптивные занятия в попутном ветре CSS? Что я хотел бы сделать, это изменить что-то вроде:

class="grid gap-12 md:grid-cols-2 md:col-gap-12 md:py-16 lg:grid-cols-3 lg:py-12"

На что-то более похожее на:

class="grid gap-12 md:grid-cols-2:col-gap-12:py-16 lg:grid-cols-3:py-12"

Я понимаю, что он не так сильно сокращает длину строки, но мне кажется, что группировка адаптивных классов немного более разумно. Я новичок в Tailwind CSS и просто хотел спросить, возможно ли это.

Answer 1

Простой короткий ответ - нет, это невозможно в Tailwind.css.

Единственный способ сделать это - создать классы самостоятельно или предложить его на их GitHub .

Answer 2

Чтобы это работало, файл CSS попутного ветра должен был бы определить класс md:grid-cols-2:col-gap-12:py-1. Это также должно было бы генерировать классы всех других возможных перестановок для каждой точки останова (до некоторого произвольного максимального количества объединенных утилит). Для md уже существует 2877 классов, поэтому, как только вы начнете их комбинировать, они очень быстро станут большими. Если учесть, что у вас есть до 3 утилит, то вы получите около 24 миллионов перестановок для md и то же самое для каждой точки останова, поэтому я не думаю, что это будет практично.