use text-decoration-line instead of text-decoration (#6378)

* use text-decoration-line instead of text-decoration * fix tests Co-authored-by: Oliver Williams <oliver@Olivers-MacBook-Pro.local>
tailwindlabs · Dec 13, 2021 · 95dd82b · 95dd82b
1 parent 27c2c72
commit 95dd82b
Show file tree

Hide file tree

Showing 7 changed files with 12 additions and 12 deletions.
diff --git a/src/corePlugins.js b/src/corePlugins.js
@@ -1660,10 +1660,10 @@ export let corePlugins = {
 
   textDecoration: ({ addUtilities }) => {
     addUtilities({
-      '.underline': { 'text-decoration': 'underline' },
-      '.overline': { 'text-decoration': 'overline' },
-      '.line-through': { 'text-decoration': 'line-through' },
-      '.no-underline': { 'text-decoration': 'none' },
+      '.underline': { 'text-decoration-line': 'underline' },
+      '.overline': { 'text-decoration-line': 'overline' },
+      '.line-through': { 'text-decoration-line': 'line-through' },
+      '.no-underline': { 'text-decoration-line': 'none' },
     })
   },
 

diff --git a/tests/apply.test.js b/tests/apply.test.js
@@ -303,7 +303,7 @@ test('@apply classes from outside a @layer', async () => {
       }
 
       .baz {
-        text-decoration: underline;
+        text-decoration-line: underline;
         --tw-text-opacity: 1;
         color: rgb(239 68 68 / var(--tw-text-opacity));
         font-weight: 700;
@@ -351,7 +351,7 @@ test('@applying classes from outside a @layer respects the source order', async
   await run(input, config).then((result) => {
     return expect(result.css).toMatchFormattedCss(css`
       .baz {
-        text-decoration: none;
+        text-decoration-line: none;
       }
 
       .container {
@@ -396,7 +396,7 @@ test('@applying classes from outside a @layer respects the source order', async
       }
 
       .bar {
-        text-decoration: none;
+        text-decoration-line: none;
       }
     `)
   })

diff --git a/tests/basic-usage.test.css b/tests/basic-usage.test.css
@@ -805,7 +805,7 @@
   --tw-text-opacity: 0.1;
 }
 .underline {
-  text-decoration: underline;
+  text-decoration-line: underline;
 }
 .decoration-red-600 {
   text-decoration-color: #dc2626;

diff --git a/tests/raw-content.test.css b/tests/raw-content.test.css
@@ -552,7 +552,7 @@
   --tw-text-opacity: 0.1;
 }
 .underline {
-  text-decoration: underline;
+  text-decoration-line: underline;
 }
 .antialiased {
   -webkit-font-smoothing: antialiased;

diff --git a/tests/safelist.test.js b/tests/safelist.test.js
@@ -40,7 +40,7 @@ it('should safelist strings', () => {
       }
 
       .hover\:underline:hover {
-        text-decoration: underline;
+        text-decoration-line: underline;
       }
     `)
   })

diff --git a/tests/variants.test.css b/tests/variants.test.css
@@ -123,7 +123,7 @@
   background-color: rgb(253 224 71 / var(--tw-bg-opacity));
 }
 .first-line\:underline::first-line {
-  text-decoration: underline;
+  text-decoration-line: underline;
 }
 .marker\:text-lg *::marker {
   font-size: 1.125rem;

diff --git a/tests/variants.test.js b/tests/variants.test.js
@@ -200,7 +200,7 @@ describe('custom advanced variants', () => {
         }
 
         .my-variant\:underline:where(.one, .two, .three) {
-          text-decoration: underline;
+          text-decoration-line: underline;
         }
       `)
     })