Finish resolving merge conflicts, fix tests

tailwindlabs · Apr 30, 2021 · 33df925 · 33df925
1 parent 90979a1
commit 33df925
Show file tree

Hide file tree

Showing 12 changed files with 47 additions and 166 deletions.
diff --git a/src/jit/corePlugins/backgroundColor.js b/src/jit/corePlugins/backgroundColor.js
diff --git a/src/jit/corePlugins/borderColor.js b/src/jit/corePlugins/borderColor.js
diff --git a/src/jit/corePlugins/divideColor.js b/src/jit/corePlugins/divideColor.js
diff --git a/src/jit/corePlugins/placeholderColor.js b/src/jit/corePlugins/placeholderColor.js
diff --git a/src/jit/corePlugins/textColor.js b/src/jit/corePlugins/textColor.js
diff --git a/src/plugins/backgroundColor.js b/src/plugins/backgroundColor.js
@@ -18,6 +18,14 @@ export default function () {
             return []
           }
 
+          if (!corePlugins('backgroundOpacity')) {
+            return {
+              [nameClass('bg', modifier)]: {
+                'background-color': value,
+              },
+            }
+          }
+
           return {
             [nameClass('bg', modifier)]: withAlphaVariable({
               color: value,

diff --git a/src/plugins/borderColor.js b/src/plugins/borderColor.js
@@ -22,6 +22,14 @@ export default function () {
             return []
           }
 
+          if (!corePlugins('borderOpacity')) {
+            return {
+              [nameClass('border', modifier)]: {
+                'border-color': value,
+              },
+            }
+          }
+
           return {
             [nameClass('border', modifier)]: withAlphaVariable({
               color: value,

diff --git a/src/plugins/divideColor.js b/src/plugins/divideColor.js
@@ -22,6 +22,14 @@ export default function () {
             return []
           }
 
+          if (!corePlugins('divideOpacity')) {
+            return {
+              [`${nameClass('divide', modifier)} > :not([hidden]) ~ :not([hidden])`]: {
+                'border-color': value,
+              },
+            }
+          }
+
           return {
             [`${nameClass(
               'divide',

diff --git a/src/plugins/placeholderColor.js b/src/plugins/placeholderColor.js
@@ -18,6 +18,14 @@ export default function () {
             return []
           }
 
+          if (!corePlugins('placeholderOpacity')) {
+            return {
+              [`${nameClass('placeholder', modifier)}::placeholder`]: {
+                color: value,
+              },
+            }
+          }
+
           return {
             [`${nameClass('placeholder', modifier)}::placeholder`]: withAlphaVariable({
               color: value,

diff --git a/src/plugins/textColor.js b/src/plugins/textColor.js
@@ -18,6 +18,14 @@ export default function () {
             return []
           }
 
+          if (!corePlugins('textOpacity')) {
+            return {
+              [nameClass('text', modifier)]: {
+                color: value,
+              },
+            }
+          }
+
           return {
             [nameClass('text', modifier)]: withAlphaVariable({
               color: value,

diff --git a/tests/jit/arbitrary-values.test.css b/tests/jit/arbitrary-values.test.css
@@ -212,7 +212,7 @@
 }
 .bg-\[hsl\(0\2c 100\%\2c 50\%\)\] {
   --tw-bg-opacity: 1;
-  background-color: rgba(255, 0, 0, var(--tw-bg-opacity));
+  background-color: hsla(0, 100%, 50%, var(--tw-bg-opacity));
 }
 .bg-\[hsla\(0\2c 100\%\2c 50\%\2c 0\.3\)\] {
   background-color: hsla(0, 100%, 50%, 0.3);

diff --git a/tests/jit/opacity.test.js b/tests/jit/opacity.test.js
@@ -1,22 +1,23 @@
-const postcss = require('postcss')
-const tailwind = require('../index.js')
-const fs = require('fs')
-const path = require('path')
+import postcss from 'postcss'
+import fs from 'fs'
+import path from 'path'
+import tailwind from '../../src/jit/index.js'
 
 function run(input, config = {}) {
   return postcss(tailwind(config)).process(input, { from: path.resolve(__filename) })
 }
 
 test('opacity', () => {
   let config = {
+    mode: 'jit',
     darkMode: 'class',
     purge: [path.resolve(__dirname, './opacity.test.html')],
     corePlugins: {
+      preflight: false,
       backgroundOpacity: false,
       borderOpacity: false,
       divideOpacity: false,
       placeholderOpacity: false,
-      preflight: false,
       textOpacity: false,
     },
     theme: {},