From 4f18552c5a307304e8c7972302e1adc30e723c1b Mon Sep 17 00:00:00 2001
From: Oliver Davies <oliver@oliverdavies.uk>
Date: Sat, 15 Aug 2020 20:45:02 +0100
Subject: [PATCH] Organise tailwind.config.js

---
 .../custom/opdavies/tailwind-focus-visible.js |  9 +++++++++
 web/themes/custom/opdavies/tailwind.config.js | 20 ++++++++-----------
 2 files changed, 17 insertions(+), 12 deletions(-)
 create mode 100644 web/themes/custom/opdavies/tailwind-focus-visible.js

diff --git a/web/themes/custom/opdavies/tailwind-focus-visible.js b/web/themes/custom/opdavies/tailwind-focus-visible.js
new file mode 100644
index 0000000..f6dfec9
--- /dev/null
+++ b/web/themes/custom/opdavies/tailwind-focus-visible.js
@@ -0,0 +1,9 @@
+const plugin = require('tailwindcss/plugin')
+
+module.exports = plugin(function({ addVariant, e }) {
+  addVariant('focus-visible', ({ modifySelectors, separator }) => {
+    modifySelectors(({ className }) => {
+      return `.${e(`focus-visible${separator}${className}`)}[data-focus-visible-added]`
+    })
+  })
+})
diff --git a/web/themes/custom/opdavies/tailwind.config.js b/web/themes/custom/opdavies/tailwind.config.js
index d015a60..fbfba96 100644
--- a/web/themes/custom/opdavies/tailwind.config.js
+++ b/web/themes/custom/opdavies/tailwind.config.js
@@ -1,6 +1,9 @@
-const plugin = require('tailwindcss/plugin')
-const {variants} = require('tailwindcss/defaultConfig')
-const {fontFamily, spacing} = require('tailwindcss/defaultTheme')
+const defaultConfig = require('tailwindcss/defaultConfig')
+const defaultTheme = require('tailwindcss/defaultTheme')
+const focusVisible = require('./tailwind-focus-visible')
+const typography = require('@tailwindcss/typography')
+const { fontFamily } = defaultTheme
+const { variants } = defaultConfig
 
 module.exports = {
   important: true,
@@ -58,15 +61,8 @@ module.exports = {
     container: false
   },
   plugins: [
-    plugin(function({ addVariant, e }) {
-      addVariant('focus-visible', ({ modifySelectors, separator }) => {
-        modifySelectors(({ className }) => {
-          return `.${e(`focus-visible${separator}${className}`)}[data-focus-visible-added]`
-        })
-      })
-    }),
-
-    require('@tailwindcss/typography')
+    focusVisible,
+    typography
   ],
   variants: {
     borderColor: [...variants.borderColor, 'focus-visible'],