Do atrocious things to sneak past minifiers for font-variant-numeric …

…utilities
tailwindlabs · Sep 5, 2020 · f3660ce · f3660ce
1 parent b26746a
commit f3660ce
Show file tree

Hide file tree

Showing 5 changed files with 105 additions and 105 deletions.
diff --git a/__tests__/fixtures/tailwind-output-flagged.css b/__tests__/fixtures/tailwind-output-flagged.css
@@ -36402,11 +36402,11 @@ video {
 }
 
 .ordinal, .slashed-zero, .lining-nums, .oldstyle-nums, .proportional-nums, .tabular-nums, .diagonal-fractions, .stacked-fractions {
-  --font-variant-numeric-ordinal: /*!*/;
-  --font-variant-numeric-slashed-zero: /*!*/;
-  --font-variant-numeric-figure: /*!*/;
-  --font-variant-numeric-spacing: /*!*/;
-  --font-variant-numeric-fraction: /*!*/;
+  --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+  --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+  --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+  --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+  --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
   font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
 }
 
@@ -77900,11 +77900,11 @@ video {
   }
 
   .sm\:ordinal, .sm\:slashed-zero, .sm\:lining-nums, .sm\:oldstyle-nums, .sm\:proportional-nums, .sm\:tabular-nums, .sm\:diagonal-fractions, .sm\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/;
-    --font-variant-numeric-slashed-zero: /*!*/;
-    --font-variant-numeric-figure: /*!*/;
-    --font-variant-numeric-spacing: /*!*/;
-    --font-variant-numeric-fraction: /*!*/;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
   }
 
@@ -119368,11 +119368,11 @@ video {
   }
 
   .md\:ordinal, .md\:slashed-zero, .md\:lining-nums, .md\:oldstyle-nums, .md\:proportional-nums, .md\:tabular-nums, .md\:diagonal-fractions, .md\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/;
-    --font-variant-numeric-slashed-zero: /*!*/;
-    --font-variant-numeric-figure: /*!*/;
-    --font-variant-numeric-spacing: /*!*/;
-    --font-variant-numeric-fraction: /*!*/;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
   }
 
@@ -160836,11 +160836,11 @@ video {
   }
 
   .lg\:ordinal, .lg\:slashed-zero, .lg\:lining-nums, .lg\:oldstyle-nums, .lg\:proportional-nums, .lg\:tabular-nums, .lg\:diagonal-fractions, .lg\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/;
-    --font-variant-numeric-slashed-zero: /*!*/;
-    --font-variant-numeric-figure: /*!*/;
-    --font-variant-numeric-spacing: /*!*/;
-    --font-variant-numeric-fraction: /*!*/;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
   }
 
@@ -202304,11 +202304,11 @@ video {
   }
 
   .xl\:ordinal, .xl\:slashed-zero, .xl\:lining-nums, .xl\:oldstyle-nums, .xl\:proportional-nums, .xl\:tabular-nums, .xl\:diagonal-fractions, .xl\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/;
-    --font-variant-numeric-slashed-zero: /*!*/;
-    --font-variant-numeric-figure: /*!*/;
-    --font-variant-numeric-spacing: /*!*/;
-    --font-variant-numeric-fraction: /*!*/;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
   }
 

diff --git a/__tests__/fixtures/tailwind-output-important.css b/__tests__/fixtures/tailwind-output-important.css
@@ -15756,11 +15756,11 @@ video {
 }
 
 .ordinal, .slashed-zero, .lining-nums, .oldstyle-nums, .proportional-nums, .tabular-nums, .diagonal-fractions, .stacked-fractions {
-  --font-variant-numeric-ordinal: /*!*/ !important;
-  --font-variant-numeric-slashed-zero: /*!*/ !important;
-  --font-variant-numeric-figure: /*!*/ !important;
-  --font-variant-numeric-spacing: /*!*/ !important;
-  --font-variant-numeric-fraction: /*!*/ !important;
+  --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/) !important;
+  --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/) !important;
+  --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/) !important;
+  --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/) !important;
+  --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/) !important;
   font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction) !important;
 }
 
@@ -33979,11 +33979,11 @@ video {
   }
 
   .sm\:ordinal, .sm\:slashed-zero, .sm\:lining-nums, .sm\:oldstyle-nums, .sm\:proportional-nums, .sm\:tabular-nums, .sm\:diagonal-fractions, .sm\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/ !important;
-    --font-variant-numeric-slashed-zero: /*!*/ !important;
-    --font-variant-numeric-figure: /*!*/ !important;
-    --font-variant-numeric-spacing: /*!*/ !important;
-    --font-variant-numeric-fraction: /*!*/ !important;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/) !important;
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction) !important;
   }
 
@@ -52172,11 +52172,11 @@ video {
   }
 
   .md\:ordinal, .md\:slashed-zero, .md\:lining-nums, .md\:oldstyle-nums, .md\:proportional-nums, .md\:tabular-nums, .md\:diagonal-fractions, .md\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/ !important;
-    --font-variant-numeric-slashed-zero: /*!*/ !important;
-    --font-variant-numeric-figure: /*!*/ !important;
-    --font-variant-numeric-spacing: /*!*/ !important;
-    --font-variant-numeric-fraction: /*!*/ !important;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/) !important;
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction) !important;
   }
 
@@ -70365,11 +70365,11 @@ video {
   }
 
   .lg\:ordinal, .lg\:slashed-zero, .lg\:lining-nums, .lg\:oldstyle-nums, .lg\:proportional-nums, .lg\:tabular-nums, .lg\:diagonal-fractions, .lg\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/ !important;
-    --font-variant-numeric-slashed-zero: /*!*/ !important;
-    --font-variant-numeric-figure: /*!*/ !important;
-    --font-variant-numeric-spacing: /*!*/ !important;
-    --font-variant-numeric-fraction: /*!*/ !important;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/) !important;
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction) !important;
   }
 
@@ -88558,11 +88558,11 @@ video {
   }
 
   .xl\:ordinal, .xl\:slashed-zero, .xl\:lining-nums, .xl\:oldstyle-nums, .xl\:proportional-nums, .xl\:tabular-nums, .xl\:diagonal-fractions, .xl\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/ !important;
-    --font-variant-numeric-slashed-zero: /*!*/ !important;
-    --font-variant-numeric-figure: /*!*/ !important;
-    --font-variant-numeric-spacing: /*!*/ !important;
-    --font-variant-numeric-fraction: /*!*/ !important;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/) !important;
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/) !important;
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction) !important;
   }
 

diff --git a/__tests__/fixtures/tailwind-output-no-color-opacity.css b/__tests__/fixtures/tailwind-output-no-color-opacity.css
@@ -13308,11 +13308,11 @@ video {
 }
 
 .ordinal, .slashed-zero, .lining-nums, .oldstyle-nums, .proportional-nums, .tabular-nums, .diagonal-fractions, .stacked-fractions {
-  --font-variant-numeric-ordinal: /*!*/;
-  --font-variant-numeric-slashed-zero: /*!*/;
-  --font-variant-numeric-figure: /*!*/;
-  --font-variant-numeric-spacing: /*!*/;
-  --font-variant-numeric-fraction: /*!*/;
+  --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+  --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+  --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+  --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+  --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
   font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
 }
 
@@ -29083,11 +29083,11 @@ video {
   }
 
   .sm\:ordinal, .sm\:slashed-zero, .sm\:lining-nums, .sm\:oldstyle-nums, .sm\:proportional-nums, .sm\:tabular-nums, .sm\:diagonal-fractions, .sm\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/;
-    --font-variant-numeric-slashed-zero: /*!*/;
-    --font-variant-numeric-figure: /*!*/;
-    --font-variant-numeric-spacing: /*!*/;
-    --font-variant-numeric-fraction: /*!*/;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
   }
 
@@ -44828,11 +44828,11 @@ video {
   }
 
   .md\:ordinal, .md\:slashed-zero, .md\:lining-nums, .md\:oldstyle-nums, .md\:proportional-nums, .md\:tabular-nums, .md\:diagonal-fractions, .md\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/;
-    --font-variant-numeric-slashed-zero: /*!*/;
-    --font-variant-numeric-figure: /*!*/;
-    --font-variant-numeric-spacing: /*!*/;
-    --font-variant-numeric-fraction: /*!*/;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
   }
 
@@ -60573,11 +60573,11 @@ video {
   }
 
   .lg\:ordinal, .lg\:slashed-zero, .lg\:lining-nums, .lg\:oldstyle-nums, .lg\:proportional-nums, .lg\:tabular-nums, .lg\:diagonal-fractions, .lg\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/;
-    --font-variant-numeric-slashed-zero: /*!*/;
-    --font-variant-numeric-figure: /*!*/;
-    --font-variant-numeric-spacing: /*!*/;
-    --font-variant-numeric-fraction: /*!*/;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
   }
 
@@ -76318,11 +76318,11 @@ video {
   }
 
   .xl\:ordinal, .xl\:slashed-zero, .xl\:lining-nums, .xl\:oldstyle-nums, .xl\:proportional-nums, .xl\:tabular-nums, .xl\:diagonal-fractions, .xl\:stacked-fractions {
-    --font-variant-numeric-ordinal: /*!*/;
-    --font-variant-numeric-slashed-zero: /*!*/;
-    --font-variant-numeric-figure: /*!*/;
-    --font-variant-numeric-spacing: /*!*/;
-    --font-variant-numeric-fraction: /*!*/;
+    --font-variant-numeric-ordinal: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-slashed-zero: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-figure: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-spacing: var(--tailwind-empty,/*!*/ /*!*/);
+    --font-variant-numeric-fraction: var(--tailwind-empty,/*!*/ /*!*/);
     font-variant-numeric: var(--font-variant-numeric-ordinal) var(--font-variant-numeric-slashed-zero) var(--font-variant-numeric-figure) var(--font-variant-numeric-spacing) var(--font-variant-numeric-fraction);
   }