Add transform-gpu and transform-none

ben-rogerson · Nov 21, 2020 · 480dd7a · 480dd7a
1 parent 8d14eb4
commit 480dd7a
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 2 deletions.
diff --git a/__fixtures__/transforms.js b/__fixtures__/transforms.js
@@ -2,8 +2,8 @@ import tw from './macro'
 
 // https://tailwindcss.com/docs/transform
 tw`transform`
-// tw`transform-gpu`
-// tw`transform-none`
+tw`transform-gpu`
+tw`transform-none`
 
 // https://tailwindcss.com/docs/transform-origin
 tw`origin-center`

diff --git a/src/config/staticStyles.js b/src/config/staticStyles.js
@@ -713,6 +713,28 @@ export default {
     config: false,
   },
 
+  'transform-gpu': {
+    output: {
+      '--transform-translate-x': '0',
+      '--transform-translate-y': '0',
+      '--transform-rotate': '0',
+      '--transform-skew-x': '0',
+      '--transform-skew-y': '0',
+      '--transform-scale-x': '1',
+      '--transform-scale-y': '1',
+      transform:
+        'translate3d(var(--transform-translate-x), var(--transform-translate-y), 0) rotate(var(--transform-rotate)) skewX(var(--transform-skew-x)) skewY(var(--transform-skew-y)) scaleX(var(--transform-scale-x)) scaleY(var(--transform-scale-y))',
+    },
+    config: false,
+  },
+
+  'transform-none': {
+    output: {
+      transform: 'none',
+    },
+    config: false,
+  },
+
   /**
    * ===========================================
    * Extras