tailwind-children/tests/test.css

Tailwind plugin which enables setting CSS rules for all children in parent

.bg-teal-800 {
  --tw-bg-opacity: 1;
  background-color: rgb(17 94 89 / var(--tw-bg-opacity))
}

.bg-red-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(254 202 202 / var(--tw-bg-opacity))
}

.p-2 {
  padding: 0.5rem
}

.italic {
  font-style: italic
}

:where(.child\:bg-teal-200) > :where(:not(.not-child)) {
  --tw-bg-opacity: 1;
  background-color: rgb(153 246 228 / var(--tw-bg-opacity))
}

:where(.hover\:child\:border) > :where(:not(.not-child)):hover {
  border-width: 1px
}

:where(.sibling\:bg-red-200) ~ :where(:not(.not-sibling)) {
  --tw-bg-opacity: 1;
  background-color: rgb(254 202 202 / var(--tw-bg-opacity))
}

:where(.sibling\:bg-red-200:not(.not-sibling)) {
  --tw-bg-opacity: 1;
  background-color: rgb(254 202 202 / var(--tw-bg-opacity))
}

:where(.child-p\:bg-teal-200) > p:where(:not(.not-child-p)) {
  --tw-bg-opacity: 1;
  background-color: rgb(153 246 228 / var(--tw-bg-opacity))
}

:where(.hover\:child-p\:border) > p:where(:not(.not-child-p)):hover {
  border-width: 1px
}

:where(.heir-p\:bg-teal-200) p:where(:not(.not-heir-p)) {
  --tw-bg-opacity: 1;
  background-color: rgb(153 246 228 / var(--tw-bg-opacity))
}

:where(.hover\:heir-p\:border) p:where(:not(.not-heir-p)):hover {
  border-width: 1px
}

:where(.heir-p\:bg-teal-200) :where(:not(.not-heir-p)) p {
  --tw-bg-opacity: 1;
  background-color: rgb(153 246 228 / var(--tw-bg-opacity))
}

:where(.hover\:heir-p\:border) :where(:not(.not-heir-p)) p:hover {
  border-width: 1px
}

:where(.sibling-p\:bg-teal-200) ~ p:where(:not(.not-sibling-p)) {
  --tw-bg-opacity: 1;
  background-color: rgb(153 246 228 / var(--tw-bg-opacity))
}

:where(.hover\:sibling-p\:border) ~ p:where(:not(.not-sibling-p)):hover {
  border-width: 1px
}

:where(.sibling-p\:bg-teal-200:not(.not-sibling-p)) {
  --tw-bg-opacity: 1;
  background-color: rgb(153 246 228 / var(--tw-bg-opacity))
}

:where(.hover\:sibling-p\:border:not(.not-sibling-p)):hover {
  border-width: 1px
}