feat: add mso-shadow-color utility

maizzle · Dec 30, 2023 · f5f3a23 · f5f3a23
1 parent e054f1b
commit f5f3a23
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 0 deletions.
diff --git a/src/index.js b/src/index.js
@@ -602,6 +602,23 @@ const tailwindCssMsoPlugin = plugin.withOptions(
         }
       )
 
+      // mso-shadow-color
+      matchUtilities(
+        {
+          'mso-shadow-color': value => ({
+            'mso-shadow-color': value
+          }),
+        },
+        {
+          values: {
+            auto: 'auto',
+            windowtext: 'windowtext',
+            ...flattenColorPalette(theme('colors')),
+          },
+          respectImportant,
+        }
+      )
+
       // mso-element-frame-vspace, mso-element-frame-hspace
       matchUtilities(
         {

diff --git a/src/index.test.js b/src/index.test.js
@@ -869,6 +869,32 @@ test('mso-shading', () => {
   })
 })
 
+test('mso-shadow-color', () => {
+  const config = {
+    content: [{
+      raw: String.raw`
+        <div class="mso-shadow-color-auto"></div>
+        <div class="mso-shadow-color-red-200"></div>
+        <div class="mso-shadow-color-[#ffcc00]"></div>
+      `
+    }],
+  }
+
+  return run(config).then(result => {
+    expect(result.css).toMatchCss(String.raw`
+      .mso-shadow-color-\[\#ffcc00\] {
+        mso-shadow-color: #ffcc00
+      }
+      .mso-shadow-color-auto {
+        mso-shadow-color: auto
+      }
+      .mso-shadow-color-red-200 {
+        mso-shadow-color: #fecaca
+      }
+    `)
+  })
+})
+
 test('mso-element-frame-{v|h}space', () => {
   const config = {
     content: [{