feat(style): translucentPlugin

Alwatr · Sep 23, 2023 · ff9588f · ff9588f
1 parent e35bb1a
commit ff9588f
Showing 1 changed file with 12 additions and 0 deletions.
diff --git a/packages/style/lib/translucent.ts b/packages/style/lib/translucent.ts
@@ -0,0 +1,12 @@
+import plugin from 'tailwindcss/plugin.js';
+
+export const translucentPlugin = plugin(({addUtilities}) => {
+  addUtilities({
+    '@supports (backdrop-filter: blur(20px))': {
+      '.translucent': {
+        '--tw-bg-opacity': '0.8 !important',
+        'backdrop-filter': 'saturate(180%) blur(20px)',
+      },
+    },
+  });
+});