TinyTownStudio
diff --git a/‎_includes/base-simple-header.njk
Lines changed: 2 additions & 4 deletions b/‎_includes/base-simple-header.njk
Lines changed: 2 additions & 4 deletions
diff --git a/‎_includes/base.njk
Lines changed: 2 additions & 4 deletions b/‎_includes/base.njk
Lines changed: 2 additions & 4 deletions
diff --git a/‎_lib/purge.js
Lines changed: 50 additions & 0 deletions b/‎_lib/purge.js
Lines changed: 50 additions & 0 deletions
diff --git a/‎eleventy.config.js
Lines changed: 12 additions & 0 deletions b/‎eleventy.config.js
Lines changed: 12 additions & 0 deletions
diff --git a/‎package.json
Lines changed: 7 additions & 0 deletions b/‎package.json
Lines changed: 7 additions & 0 deletions
@@ -4,9 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>tinytown.studio</title>
-    <style>
-      {% include "../node_modules/shed-css/dist/index.css" %}
-    </style>
+    <link rel="stylesheet" href="/shed-css/index.css" />
     <link rel="stylesheet" href="/main.css" />
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
@@ -17,7 +15,7 @@
   </head>
   <body>
     <header>
-      <h1 class="m:0 p:0 m-t:2">tinyTown</h1>
+      <h1 class="m:0 p:0 m-t:2">tiny<span class="t-t:u">Town</span></h1>
       <p class="m:0 p:0 sub-heading subtle">tiny things for the tiny ones</p>
     </header>
     <div class="m-t:10">
 
@@ -4,10 +4,8 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>tinytown.studio</title>
-    <style>
-      {% include "../node_modules/shed-css/dist/index.css" %}
-    </style>
-    <link rel="stylesheet" href="/main.css" />
+    <link rel="stylesheet" href="/node_modules/shed-css/dist/index.css" />
+    <link rel="stylesheet" href="/main.css" /
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
 
@@ -0,0 +1,50 @@
+import { purgeCSSPlugin } from '@fullhuman/postcss-purgecss';
+import fs from 'fs';
+import postCSS from 'postcss';
+import glob from 'tiny-glob';
+import MinifyCSS from 'clean-css';
+
+import { extname, join } from 'node:path';
+
+export async function purge(directories) {
+  const inputDir = directories.output;
+
+  const requiredFiles = await glob('**/*.{html,css}', {
+    cwd: join(process.cwd(), inputDir),
+    absolute: true,
+  });
+
+  const cssFiles = [];
+  const htmlFiles = [];
+
+  for (let file of requiredFiles) {
+    if (extname(file) === '.css') {
+      cssFiles.push(file);
+    }
+    if (extname(file) === '.html') {
+      htmlFiles.push(file);
+    }
+  }
+
+  for (let file of cssFiles) {
+    const sourceCSS = await fs.promises.readFile(file, 'utf8');
+    const allCSS = await postCSS([
+      purgeCSSPlugin({
+        content: htmlFiles,
+        variables: true,
+        keyframes: true,
+        defaultExtractor: (content) => content.match(/[\w-:./]+(?<!:)/g) || [],
+      }),
+    ])
+      .process(sourceCSS, {
+        from: file,
+        to: file,
+      })
+      .catch((error) => {
+        console.log(error);
+      });
+
+    const minifiedCSS = new MinifyCSS().minify(allCSS.css).styles;
+    await fs.promises.writeFile(file, minifiedCSS, 'utf8');
+  }
+}
@@ -1,8 +1,20 @@
 import { EleventyHtmlBasePlugin } from '@11ty/eleventy';
+import { purge } from './_lib/purge.js';
 
 export default function (eleventyConfig) {
   eleventyConfig.addPassthroughCopy({
     './public/': '/',
   });
+  eleventyConfig.addPassthroughCopy({
+    './node_modules/shed-css/dist/index.css':
+      '/node_modules/shed-css/dist/index.css',
+  });
   eleventyConfig.addPlugin(EleventyHtmlBasePlugin);
+
+  eleventyConfig.on(
+    'eleventy.after',
+    async ({ directories, results, runMode, outputMode }) => {
+      await purge(directories);
+    }
+  );
 }
@@ -13,6 +13,13 @@
   "type": "module",
   "dependencies": {
     "@11ty/eleventy": "^3.0.0",
+    "clean-css": "^5.3.3",
     "shed-css": "^1.4.0"
+  },
+  "devDependencies": {
+    "@fullhuman/postcss-purgecss": "^7.0.2",
+    "eleventy-plugin-purgecss": "^0.5.0",
+    "postcss": "^8.5.1",
+    "tiny-glob": "^0.2.9"
   }
 }
Original file line number	Diff line number	Diff line change
`@@ -13,6 +13,13 @@`
`13`	`13`	`"type": "module",`
`14`	`14`	`"dependencies": {`
`15`	`15`	`"@11ty/eleventy": "^3.0.0",`
	`16`	`+ "clean-css": "^5.3.3",`
`16`	`17`	`"shed-css": "^1.4.0"`
	`18`	`+ },`
	`19`	`+ "devDependencies": {`
	`20`	`+ "@fullhuman/postcss-purgecss": "^7.0.2",`
	`21`	`+ "eleventy-plugin-purgecss": "^0.5.0",`
	`22`	`+ "postcss": "^8.5.1",`
	`23`	`+ "tiny-glob": "^0.2.9"`
`17`	`24`	`}`
`18`	`25`	`}`