Fix handling of outline offsets

tailwindlabs · Mar 17, 2021 · 6e2e2b8 · 6e2e2b8
1 parent 3c16d43
commit 6e2e2b8
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 8 deletions.
diff --git a/src/corePlugins/outline.js b/src/corePlugins/outline.js
@@ -1,17 +1,11 @@
 const nameClass = require('tailwindcss/lib/util/nameClass').default
-const transformThemeValue = require('tailwindcss/lib/util/transformThemeValue').default
-
-function isPlainObject(value) {
-  return typeof value === 'object' && value !== null
-}
 
 module.exports = function ({ matchUtilities, jit: { theme } }) {
   matchUtilities({
     outline: (modifier, { theme }) => {
-      let transformValue = transformThemeValue('outline')
-      let value = transformValue(theme.outline[modifier])
+      let value = theme.outline[modifier]
 
-      if (modifier === '' || value === undefined) {
+      if (value === undefined) {
         return []
       }
 

diff --git a/tests/00-kitchen-sink.test.css b/tests/00-kitchen-sink.test.css
@@ -304,6 +304,10 @@ div {
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
     var(--tw-shadow);
 }
+.outline-black {
+  outline: 2px dotted black;
+  outline-offset: 2px;
+}
 .filter-none {
   filter: none;
 }

diff --git a/tests/00-kitchen-sink.test.html b/tests/00-kitchen-sink.test.html
@@ -16,6 +16,7 @@
     <div class="test-apply-font-variant"></div>
     <div class="mt-6"></div>
     <div class="bg-black"></div>
+    <div class="outline-black"></div>
     <div class="custom-util"></div>
     <div class="hover:custom-util"></div>
     <div class="group-hover:custom-util"></div>