Merge pull request #200 from soilSpoon/feature/transform

Add transform-gpu and transform-none
ben-rogerson · Nov 25, 2020 · 917524d · 917524d
2 parents b66d3e9 + 846283c
commit 917524d
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 7 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/__snapshots__/plugin.test.js.snap b/__snapshots__/plugin.test.js.snap
@@ -16012,8 +16012,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\`
@@ -16284,9 +16284,21 @@ tw\`-skew-y-1\`
   '--tw-scale-y': '1',
   transform:
     'translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))',
-}) // tw\`transform-gpu\`
-// tw\`transform-none\`
-// https://tailwindcss.com/docs/transform-origin
+})
+;({
+  '--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))',
+})
+;({
+  transform: 'none',
+}) // https://tailwindcss.com/docs/transform-origin
 
 ;({
   transformOrigin: 'center',

diff --git a/src/config/staticStyles.js b/src/config/staticStyles.js
@@ -701,6 +701,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