Include outline-color in default color properties to transition

tailwindlabs · Jan 21, 2023 · e793337 · e793337
1 parent c8e484c
commit e793337
Show file tree

Hide file tree

Showing 6 changed files with 19 additions and 16 deletions.
diff --git a/stubs/defaultConfig.stub.js b/stubs/defaultConfig.stub.js
@@ -878,8 +878,8 @@ module.exports = {
       none: 'none',
       all: 'all',
       DEFAULT:
-        'color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter',
-      colors: 'color, background-color, border-color, text-decoration-color, fill, stroke',
+        'color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter',
+      colors: 'color, background-color, border-color, outline-color, text-decoration-color, fill, stroke',
       opacity: 'opacity',
       shadow: 'box-shadow',
       transform: 'transform',

diff --git a/tests/basic-usage.oxide.test.css b/tests/basic-usage.oxide.test.css
@@ -1059,8 +1059,8 @@
   backdrop-filter: none;
 }
 .transition {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
-    opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-property: color, background-color, border-color, outline-color, text-decoration-color,
+    fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }

diff --git a/tests/basic-usage.test.css b/tests/basic-usage.test.css
@@ -1059,8 +1059,8 @@
   backdrop-filter: none;
 }
 .transition {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
-    opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-property: color, background-color, border-color, outline-color, text-decoration-color,
+    fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }

diff --git a/tests/kitchen-sink.test.js b/tests/kitchen-sink.test.js
@@ -750,8 +750,9 @@ crosscheck(() => {
         }
         @media (prefers-reduced-motion: no-preference) {
           .motion-safe\:transition {
-            transition-property: color, background-color, border-color, text-decoration-color, fill,
-              stroke, opacity, box-shadow, transform, filter, backdrop-filter;
+            transition-property: color, background-color, border-color, outline-color,
+              text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
+              backdrop-filter;
             transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
             transition-duration: 150ms;
           }
@@ -761,8 +762,9 @@ crosscheck(() => {
         }
         @media (prefers-reduced-motion: reduce) {
           .motion-reduce\:transition {
-            transition-property: color, background-color, border-color, text-decoration-color, fill,
-              stroke, opacity, box-shadow, transform, filter, backdrop-filter;
+            transition-property: color, background-color, border-color, outline-color,
+              text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
+              backdrop-filter;
             transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
             transition-duration: 150ms;
           }
@@ -865,8 +867,9 @@ crosscheck(() => {
           }
           @media (prefers-reduced-motion: no-preference) {
             .md\:motion-safe\:hover\:transition:hover {
-              transition-property: color, background-color, border-color, text-decoration-color,
-                fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
+              transition-property: color, background-color, border-color, outline-color,
+                text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
+                backdrop-filter;
               transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
               transition-duration: 150ms;
             }

diff --git a/tests/raw-content.oxide.test.css b/tests/raw-content.oxide.test.css
@@ -757,8 +757,8 @@
   backdrop-filter: none;
 }
 .transition {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
-    opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-property: color, background-color, border-color, outline-color, text-decoration-color,
+    fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }

diff --git a/tests/raw-content.test.css b/tests/raw-content.test.css
@@ -757,8 +757,8 @@
   backdrop-filter: none;
 }
 .transition {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
-    opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-property: color, background-color, border-color, outline-color, text-decoration-color,
+    fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }