From f739f87ce42e3b2075a6720e4c9b681814f14823 Mon Sep 17 00:00:00 2001
From: Michael DiLeo <michael.dileo@oakstreethealth.com>
Date: Thu, 14 Aug 2025 09:11:44 -0500
Subject: [PATCH] swap to jade theme, fix missing anchor tags

---
 minify-build.js              | 26 ++++++++++++++++----------
 public/site-styles/style.css | 12 +++++++++++-
 2 files changed, 27 insertions(+), 11 deletions(-)

diff --git a/minify-build.js b/minify-build.js
index b2ab660..22ecbee 100644
--- a/minify-build.js
+++ b/minify-build.js
@@ -35,12 +35,11 @@ async function createOptimizedBuild() {
         const purgeResults = await new PurgeCSS().purge({
             content: [
                 'public/index.html',
-                'public/about.html',
-                'index.html'
+                'public/about.html'
             ],
             css: [
-                'public/css/pico.green.min.css',
-                'public/css/pico.colors.min.css'
+                'public/css/pico.jade.css'
+                // 'public/css/pico.colors.min.css'
             ],
             safelist: {
                 standard: [
@@ -51,7 +50,8 @@ async function createOptimizedBuild() {
                     'banner-subtitle',
                     'video-container',
                     'photo-gallery',
-                    'photo-item'
+                    'photo-item',
+                    'dark'
                 ],
                 deep: [
                     /^--pico-/,
@@ -75,19 +75,25 @@ async function createOptimizedBuild() {
                     /^ul$/,
                     /^li$/,
                     /^strong$/,
-                    /^a$/
+                    /^a$/,
+                    /^a:/,  // Add anchor pseudo-classes like a:hover, a:focus
+                    /^a\./,  // Add anchor with classes like a.secondary
+                    /^a\[/   // Add anchor with attributes like a[role=button]
                 ]
             },
             variables: true,
             keyframes: true
         });
 
-        // Step 1.5: Add essential font rule that PurgeCSS removes too aggressively
+        // Step 1.5: Add essential rules that PurgeCSS removes too aggressively
         const fontRule = `:where(:host),:where(:root){background-color:var(--pico-background-color);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:var(--pico-font-size);line-height:var(--pico-line-height);font-family:var(--pico-font-family);}`;
+        
+        // Add missing anchor tag primary color rule
+        const anchorRule = `a:not([role=button]){--pico-color:var(--pico-primary);--pico-underline:var(--pico-primary-underline);background-color:transparent;color:var(--pico-color);text-decoration:var(--pico-text-decoration);text-decoration-color:var(--pico-underline);text-underline-offset:.125em;transition:background-color var(--pico-transition),color var(--pico-transition),text-decoration var(--pico-transition),box-shadow var(--pico-transition);}a:not([role=button]):is(:hover,:active,:focus){--pico-color:var(--pico-primary-hover);--pico-underline:var(--pico-primary-hover-underline);text-decoration:underline;}`;
 
         // Step 2: CSS Minification with cssnano
         console.log('🗜️  Step 2: Minifying CSS with cssnano...');
-        const combinedCSS = purgeResults.map(result => result.css).join('\n\n') + '\n' + fontRule;
+        const combinedCSS = purgeResults.map(result => result.css).join('\n\n') + '\n' + fontRule + '\n' + anchorRule;
         
         const minifiedCSS = await postcss([
             cssnano({
@@ -156,7 +162,7 @@ async function createOptimizedBuild() {
         // Calculate JavaScript size if bundled
         let jsInfo = '';
         try {
-            const bundledJSSize = (await fs.stat('dist/scripts/scripts.js')).size;
+            const bundledJSSize = (await fs.stat('dist/scripts/bundle.js')).size;
             jsInfo = `\n   JavaScript: Bundled into ${(bundledJSSize / 1024).toFixed(1)}KB`;
         } catch (err) {
             // No JavaScript files were bundled
@@ -269,7 +275,7 @@ async function minifyHTMLFile(inputPath, outputPath) {
         .replace(/<link rel="stylesheet" href="css\/pico\.colors\.min\.css">/g, '')
         .replace(/<link rel="stylesheet" href="site-styles\/style\.css">/g, 
                 '<link rel="stylesheet" href="css/styles.css"><link rel="stylesheet" href="site-styles/style.css">')
-        .replace(/<\/body>/g, '<script src="scripts/scripts.js"></script></body>');
+        .replace(/<\/body>/g, '<script src="scripts/bundle.js"></script></body>');
 
     const minified = await htmlMinify(updatedHTML, {
         collapseWhitespace: true,
diff --git a/public/site-styles/style.css b/public/site-styles/style.css
index 0af26de..bc3b9c1 100644
--- a/public/site-styles/style.css
+++ b/public/site-styles/style.css
@@ -188,7 +188,7 @@
     }
 }
 
-/* Make headers use primary green color - only for light theme and default */
+/* Make headers use primary green color for both themes */
 :root:not([data-theme="dark"]) {
     --pico-h1-color: var(--pico-primary);
     --pico-h2-color: var(--pico-primary);
@@ -198,6 +198,16 @@
     --pico-h6-color: var(--pico-primary);
 }
 
+/* Make headers use primary color in dark theme too */
+[data-theme="dark"] {
+    --pico-h1-color: var(--pico-primary);
+    --pico-h2-color: var(--pico-primary);
+    --pico-h3-color: var(--pico-primary);
+    --pico-h4-color: var(--pico-primary);
+    --pico-h5-color: var(--pico-primary);
+    --pico-h6-color: var(--pico-primary);
+}
+
 /* Custom header colors for green theme - light mode */
 /* [data-theme="light"],
 :root:not([data-theme="dark"]) {