Merge pull request #651 from ben-rogerson/feature/text-decoration-line

Use `text-decoration-line` instead of `text-decoration`
ben-rogerson · Mar 27, 2022 · d6a5796 · d6a5796
2 parents 0d640f8 + 11c1d8f
commit d6a5796
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 11 deletions.
diff --git a/__fixtures__/utiltiesTypography/textDecoration.js b/__fixtures__/utiltiesTypography/textDecoration.js
@@ -2,6 +2,6 @@ import tw from './macro'
 
 // https://tailwindcss.com/docs/text-decoration
 tw`underline`
-// tw`overline`
+tw`overline`
 tw`line-through`
 tw`no-underline`
diff --git a/__snapshots__/plugin.test.js.snap b/__snapshots__/plugin.test.js.snap
@@ -1089,7 +1089,7 @@ const multipleClasses = {
     backgroundColor: 'rgb(0 0 0 / var(--tw-bg-opacity))',
     '--tw-text-opacity': '1',
     color: 'rgb(255 255 255 / var(--tw-text-opacity))',
-    textDecoration: 'underline',
+    textDecorationLine: 'underline',
   },
 }
 const pseudoElement = {
@@ -51867,22 +51867,24 @@ import tw from './macro'
 
 // https://tailwindcss.com/docs/text-decoration
 tw\`underline\`
-// tw\`overline\`
+tw\`overline\`
 tw\`line-through\`
 tw\`no-underline\`
 
       ↓ ↓ ↓ ↓ ↓ ↓
 
 // https://tailwindcss.com/docs/text-decoration
 ;({
-  textDecoration: 'underline',
-}) // tw\`overline\`
-
+  textDecorationLine: 'underline',
+})
+;({
+  textDecorationLine: 'overline',
+})
 ;({
-  textDecoration: 'line-through',
+  textDecorationLine: 'line-through',
 })
 ;({
-  textDecoration: 'none',
+  textDecorationLine: 'none',
 })
 
 

diff --git a/src/config/staticStyles.js b/src/config/staticStyles.js
@@ -441,9 +441,10 @@ export default {
   // See dynamicStyles.js
 
   // https://tailwindcss.com/docs/text-decoration
-  underline: { output: { textDecoration: 'underline' } },
-  'line-through': { output: { textDecoration: 'line-through' } },
-  'no-underline': { output: { textDecoration: 'none' } },
+  underline: { output: { textDecorationLine: 'underline' } },
+  overline: { output: { textDecorationLine: 'overline' } },
+  'line-through': { output: { textDecorationLine: 'line-through' } },
+  'no-underline': { output: { textDecorationLine: 'none' } },
 
   // https://tailwindcss.com/docs/text-transform
   uppercase: { output: { textTransform: 'uppercase' } },