Skip to content

Commit

Permalink
Properly support colors as closures with ring utilities
Browse files Browse the repository at this point in the history
  • Loading branch information
@adamwathan
adamwathan committed Nov 14, 2020
1 parent b3ed724 commit 62a47f9
Show file tree
Hide file tree
Showing 8 changed files with 143 additions and 163 deletions.
54 changes: 18 additions & 36 deletions __tests__/fixtures/tailwind-output-flagged.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20972,8 +20972,7 @@ video {
}

.ring-transparent {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.ring-current {
Expand Down Expand Up @@ -21391,8 +21390,7 @@ video {
}

.focus-within\:ring-transparent:focus-within {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -21810,8 +21808,7 @@ video {
}

.focus\:ring-transparent:focus {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.focus\:ring-current:focus {
Expand Down Expand Up @@ -49785,8 +49782,7 @@ video {
}

.sm\:ring-transparent {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.sm\:ring-current {
Expand Down Expand Up @@ -50204,8 +50200,7 @@ video {
}

.sm\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.sm\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -50623,8 +50618,7 @@ video {
}

.sm\:focus\:ring-transparent:focus {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.sm\:focus\:ring-current:focus {
Expand Down Expand Up @@ -78568,8 +78562,7 @@ video {
}

.md\:ring-transparent {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.md\:ring-current {
Expand Down Expand Up @@ -78987,8 +78980,7 @@ video {
}

.md\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.md\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -79406,8 +79398,7 @@ video {
}

.md\:focus\:ring-transparent:focus {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.md\:focus\:ring-current:focus {
Expand Down Expand Up @@ -107351,8 +107342,7 @@ video {
}

.lg\:ring-transparent {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.lg\:ring-current {
Expand Down Expand Up @@ -107770,8 +107760,7 @@ video {
}

.lg\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.lg\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -108189,8 +108178,7 @@ video {
}

.lg\:focus\:ring-transparent:focus {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.lg\:focus\:ring-current:focus {
Expand Down Expand Up @@ -136134,8 +136122,7 @@ video {
}

.xl\:ring-transparent {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.xl\:ring-current {
Expand Down Expand Up @@ -136553,8 +136540,7 @@ video {
}

.xl\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.xl\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -136972,8 +136958,7 @@ video {
}

.xl\:focus\:ring-transparent:focus {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.xl\:focus\:ring-current:focus {
Expand Down Expand Up @@ -164917,8 +164902,7 @@ video {
}

.\32xl\:ring-transparent {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.\32xl\:ring-current {
Expand Down Expand Up @@ -165336,8 +165320,7 @@ video {
}

.\32xl\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.\32xl\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -165755,8 +165738,7 @@ video {
}

.\32xl\:focus\:ring-transparent:focus {
--ring-opacity: 0;
--ring-color: rgba(0, 0, 0, var(--ring-opacity));
--ring-color: transparent;
}

.\32xl\:focus\:ring-current:focus {
Expand Down
54 changes: 18 additions & 36 deletions __tests__/fixtures/tailwind-output-important.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20972,8 +20972,7 @@ video {
}

.ring-transparent {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.ring-current {
Expand Down Expand Up @@ -21391,8 +21390,7 @@ video {
}

.focus-within\:ring-transparent:focus-within {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -21810,8 +21808,7 @@ video {
}

.focus\:ring-transparent:focus {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.focus\:ring-current:focus {
Expand Down Expand Up @@ -49785,8 +49782,7 @@ video {
}

.sm\:ring-transparent {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.sm\:ring-current {
Expand Down Expand Up @@ -50204,8 +50200,7 @@ video {
}

.sm\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.sm\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -50623,8 +50618,7 @@ video {
}

.sm\:focus\:ring-transparent:focus {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.sm\:focus\:ring-current:focus {
Expand Down Expand Up @@ -78568,8 +78562,7 @@ video {
}

.md\:ring-transparent {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.md\:ring-current {
Expand Down Expand Up @@ -78987,8 +78980,7 @@ video {
}

.md\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.md\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -79406,8 +79398,7 @@ video {
}

.md\:focus\:ring-transparent:focus {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.md\:focus\:ring-current:focus {
Expand Down Expand Up @@ -107351,8 +107342,7 @@ video {
}

.lg\:ring-transparent {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.lg\:ring-current {
Expand Down Expand Up @@ -107770,8 +107760,7 @@ video {
}

.lg\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.lg\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -108189,8 +108178,7 @@ video {
}

.lg\:focus\:ring-transparent:focus {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.lg\:focus\:ring-current:focus {
Expand Down Expand Up @@ -136134,8 +136122,7 @@ video {
}

.xl\:ring-transparent {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.xl\:ring-current {
Expand Down Expand Up @@ -136553,8 +136540,7 @@ video {
}

.xl\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.xl\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -136972,8 +136958,7 @@ video {
}

.xl\:focus\:ring-transparent:focus {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.xl\:focus\:ring-current:focus {
Expand Down Expand Up @@ -164917,8 +164902,7 @@ video {
}

.\32xl\:ring-transparent {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.\32xl\:ring-current {
Expand Down Expand Up @@ -165336,8 +165320,7 @@ video {
}

.\32xl\:focus-within\:ring-transparent:focus-within {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.\32xl\:focus-within\:ring-current:focus-within {
Expand Down Expand Up @@ -165755,8 +165738,7 @@ video {
}

.\32xl\:focus\:ring-transparent:focus {
--ring-opacity: 0 !important;
--ring-color: rgba(0, 0, 0, var(--ring-opacity)) !important;
--ring-color: transparent !important;
}

.\32xl\:focus\:ring-current:focus {
Expand Down
Loading

0 comments on commit 62a47f9

Please sign in to comment.