remove any data type for decoration color plugin

The main reason for the `any` type is so that we don't have to parse the
value and can assume that this plugin handles "any" value you give it.

This is useful because `decoration-[var(--something)]` would be
correctly translated to the correct decoration property. However, we
introduce another plugin with the same `decoration` prefix.

This means that now both `textDecorationColor` and
`textDecorationThickness` have the same base utility name: `decoration`.

- `textDecorationColor` had ['color', 'any']
- `textDecorationThickness` had ['length', 'percentage']

This means that `3px` fit both in the `length` data type of the
`textDecorationThickness` plugin and in the `any` data type of the
`textDecorationColor` plugin.

Removing the `any` fixes this.

TL;DR: Only have `any` when there are no conflicting utility names.

src/corePlugins.js

@@ -1670,7 +1670,7 @@ export let corePlugins = {
           return { 'text-decoration-color': toColorValue(value) }
         },
       },
-      { values: flattenColorPalette(theme('textDecorationColor')), type: ['color', 'any'] }
+      { values: flattenColorPalette(theme('textDecorationColor')), type: ['color'] }
     )
   },
 

tests/arbitrary-values.test.js

@@ -16,6 +16,28 @@ test('arbitrary values', () => {
   })
 })
 
+it('should be possible to differentiate between decoration utilities', () => {
+  let config = {
+    content: [
+      {
+        raw: html` <div class="decoration-[3px] decoration-[#ccc]"></div> `,
+      },
+    ],
+  }
+
+  return run('@tailwind utilities', config).then((result) => {
+    return expect(result.css).toMatchFormattedCss(css`
+      .decoration-\[\#ccc\] {
+        text-decoration-color: #ccc;
+      }
+
+      .decoration-\[3px\] {
+        text-decoration-thickness: 3px;
+      }
+    `)
+  })
+})
+
 it('should support modifiers for arbitrary values that contain the separator', () => {
   let config = {
     content: [