Revert including outline-color in transition and `transition-colo…

…rs` by default (#10604) * Remove `outline-color` from default color properties to transition (Reverts #10385) * Update changelog
tailwindlabs · Feb 16, 2023 · 04c5cac · 04c5cac
1 parent 742c699
commit 04c5cac
Show file tree

Hide file tree

Showing 7 changed files with 17 additions and 19 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - Fix use of `:where(.btn)` when matching `!btn` ([#10601](https://github.com/tailwindlabs/tailwindcss/pull/10601))
+- Revert including `outline-color` in `transition` and `transition-colors` by default ([#10604](https://github.com/tailwindlabs/tailwindcss/pull/10604))
 
 ## [3.2.6] - 2023-02-08
 

diff --git a/stubs/defaultConfig.stub.js b/stubs/defaultConfig.stub.js
@@ -877,8 +877,8 @@ module.exports = {
       none: 'none',
       all: 'all',
       DEFAULT:
-        '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',
+        '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',
       opacity: 'opacity',
       shadow: 'box-shadow',
       transform: 'transform',

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

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

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

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

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