Latihan Tailwind menggunakan kelas tersuai sebagai syarat

Question

Bolehkah saya menetapkan syarat dalam angin ekor? Jika elemen induk mempunyai kelas, seperti "kecil", maka elemen ini akan menggunakan atribut "p-0". Adakah mungkin untuk mencapai ini tanpa menulis semua pilihan, tetapi menggunakan sesuatu seperti "ibu bapa-kecil: p-0"?

Saya cuba menambah hanya kelas yang diperlukan pada fail gaya, tetapi ini menghasilkan banyak kelas pendua dan saya tertanya-tanya sama ada saya boleh menggunakan tailwind untuk mencapai ini.

Answer 1

Ya! Anda boleh mempertimbangkan untuk menggunakan varian group seperti yang ditunjukkan di bawah:

<script src="https://cdn.tailwindcss.com/3.3.2"></script>

<div class="group">
  <div class="p-10 bg-red-200 group-[.small]:p-0">
    Foo
  </div>
</div>

<div class="group small">
  <div class="p-10 bg-green-200 group-[.small]:p-0">
    Bar
  </div>
</div>