refactor: improve the color scheme

3 files changed, 24 insertions, 12 deletions

diff --git a/assets/css/markdown.css b/assets/css/markdown.css
index b9206b6..7447315 100644
--- a/assets/css/markdown.css
+++ b/assets/css/markdown.css
@@ -59,7 +59,7 @@
 }
 
 .content code {
-  @apply font-mono text-sm inline bg-tertiary-bg rounded p-1;
+  @apply font-mono text-sm text-tertiary-text inline bg-tertiary-bg rounded p-1;
 }
 
 .content pre {
diff --git a/assets/css/postcss.config.js b/assets/css/postcss.config.js
index 121ed3f..af2c238 100644
--- a/assets/css/postcss.config.js
+++ b/assets/css/postcss.config.js
@@ -1,5 +1,27 @@
 const themeDir = __dirname + '/../../';
 
+const purgecss = require('@fullhuman/postcss-purgecss')({
+
+    // Specify the paths to all of the template files in your project
+    content: [
+        themeDir + 'layouts/**/*.html',
+        themeDir + 'exampleSite/content/**/*.html',
+        'layouts/**/*.html',
+        'content/**/*.html',
+    ],
+
+    // This is the function used to extract class names from your templates
+    defaultExtractor: content => {
+        // Capture as liberally as possible, including things like `h-(screen-1.5)`
+        const broadMatches = content.match(/[^<>"'`\s]*[^<>"'`\s:]/g) || []
+
+        // Capture classes within other delimiters like .block(class="w-1/2") in Pug
+        const innerMatches = content.match(/[^<>"'`\s.()]*[^<>"'`\s.():]/g) || []
+
+        return broadMatches.concat(innerMatches)
+    }
+})
+
 module.exports = {    
     plugins: [        
         require('postcss-import')({
@@ -9,5 +31,6 @@ module.exports = {
         require('autoprefixer')({
             path: [themeDir]
         }),
+        ...(process.env.HUGO_ENVIRONMENT === 'production' ? [purgecss] : [])
     ]
 }
diff --git a/assets/css/tailwind.config.js b/assets/css/tailwind.config.js
index af75cf1..58c9603 100644
--- a/assets/css/tailwind.config.js
+++ b/assets/css/tailwind.config.js
@@ -1,16 +1,5 @@
-const themeDir = __dirname + '/../../';
-
 module.exports = {
   important: true,
-  purge: {
-    enabled: true,
-    content: [
-      themeDir + 'layouts/**/*.html',
-      themeDir + 'exampleSite/content/**/*.html',
-      'layouts/**/*.html',
-      'content/**/*.html',
-    ],
-  },
   theme: {
     fontFamily: {
       'serif': ['Lora', 'Noto Serif SC', 'serif'],