diff --git a/.eleventy.js b/.eleventy.js
deleted file mode 100644
index 6eee010..0000000
--- a/.eleventy.js
+++ /dev/null
@@ -1,39 +0,0 @@
-const inspect = require("util").inspect;
-
-module.exports = config => {
- config.setUseGitIgnore(false);
-
- config.addPassthroughCopy({"./src/_includes/js/" : "/js"});
-
- config.addLayoutAlias('base', 'layouts/base.html');
-
- config.addCollection("sections", (collectionApi) => {
- const sections = collectionApi.getFilteredByGlob("./src/pages/sections/**")
- .sort((a, b) => a.data.order - b.data.order);
- process.env.DEBUG && console.log(inspect(sections));
- return sections;
- });
- config.addCollection("projects", (collectionApi) => {
- const projects = collectionApi.getFilteredByGlob("./src/projects/**")
- .sort((a, b) => a.data.order - b.data.order);
- process.env.DEBUG && console.log(inspect(projects));
- return projects;
- });
-
- config.addCollection('experiences', collection => {
- return [...collection.getFilteredByGlob('./src/experiences/*.md')]
- .sort((a, b) => a.data.startDate - b.data.startDate).reverse();
- });
-
- config.addPassthroughCopy('src/favicon.ico')
-
- return {
- markdownTemplateEngine: 'liquid',
- dataTemplateEngine: 'liquid',
- htmlTemplateEngine: 'liquid',
- dir: {
- input: 'src',
- output: 'dist'
- }
- };
-};
\ No newline at end of file
diff --git a/eleventy.config.js b/eleventy.config.js
new file mode 100644
index 0000000..2c324e3
--- /dev/null
+++ b/eleventy.config.js
@@ -0,0 +1,112 @@
+import { inspect } from "util";
+import browserslist from "browserslist";
+import * as sass from "sass";
+import path from "node:path";
+import { bundle, browserslistToTargets, composeVisitors, transform } from "lightningcss" ;
+
+export default async function (eleventyConfig) {
+ eleventyConfig.setUseGitIgnore(false);
+
+ eleventyConfig.addPassthroughCopy({"./src/_includes/js/" : "/js"});
+
+ eleventyConfig.addLayoutAlias('base', 'layouts/base.html');
+
+ eleventyConfig.addCollection("sections", (collectionApi) => {
+ const sections = collectionApi.getFilteredByGlob("./src/pages/sections/**")
+ .sort((a, b) => a.data.order - b.data.order);
+ process.env.DEBUG && console.log(inspect(sections));
+ return sections;
+ });
+ eleventyConfig.addCollection("projects", (collectionApi) => {
+ const projects = collectionApi.getFilteredByGlob("./src/projects/**")
+ .sort((a, b) => a.data.order - b.data.order);
+ process.env.DEBUG && console.log(inspect(projects));
+ return projects;
+ });
+
+ eleventyConfig.addCollection('experiences', collection => {
+ return [...collection.getFilteredByGlob('./src/experiences/*.md')]
+ .sort((a, b) => a.data.startDate - b.data.startDate).reverse();
+ });
+
+ eleventyConfig.addPassthroughCopy('src/favicon.ico')
+
+ // Recognize CSS as a "template language"
+ eleventyConfig.addTemplateFormats("css");
+
+ // Process CSS with LightningCSS
+ eleventyConfig.addExtension("css", {
+ outputFileExtension: "css",
+ compile: async function (_inputContent, inputPath) {
+ let parsed = path.parse(inputPath);
+ if (parsed.name.startsWith("_")) {
+ return;
+ }
+
+ let targets = browserslistToTargets(browserslist("> 0.2% and not dead"));
+
+ return async () => {
+ // Switch to the `transform` function if you don't
+ // plan to use `@import` to merge files
+ let { code } = await bundle({
+ filename: inputPath,
+ minify: true,
+ sourceMap: false,
+ targets,
+ // Supports CSS nesting
+ drafts: {
+ nesting,
+ },
+ });
+ return code;
+ };
+ },
+ });
+
+ // Recognize Sass as a "template languages"
+ eleventyConfig.addTemplateFormats("scss");
+
+ // Compile Sass
+ eleventyConfig.addExtension("scss", {
+ outputFileExtension: "css",
+ compile: async function (inputContent, inputPath) {
+ // Skip files like _fileName.scss
+ let parsed = path.parse(inputPath);
+ if (parsed.name.startsWith("_")) {
+ return;
+ }
+
+ // Run file content through Sass
+ let result = sass.compileString(inputContent, {
+ loadPaths: [parsed.dir || "."],
+ sourceMap: false, // or true, your choice!
+ });
+
+ // Allow included files from @use or @import to
+ // trigger rebuilds when using --incremental
+ this.addDependencies(inputPath, result.loadedUrls);
+
+ let targets = browserslistToTargets(browserslist("> 0.2% and not dead"));
+
+ return async () => {
+ let { code } = await transform({
+ code: Buffer.from(result.css),
+ minify: true,
+ sourceMap: false,
+ targets,
+ });
+ return code;
+ };
+ },
+ });
+
+ return {
+ markdownTemplateEngine: 'liquid',
+ dataTemplateEngine: 'liquid',
+ htmlTemplateEngine: 'liquid',
+ dir: {
+ input: 'src',
+ output: 'dist'
+ }
+ };
+};
\ No newline at end of file
diff --git a/gulp-tasks/sass.js b/gulp-tasks/sass.js
deleted file mode 100644
index ca98ff2..0000000
--- a/gulp-tasks/sass.js
+++ /dev/null
@@ -1,50 +0,0 @@
-const {dest, src} = require('gulp');
-const cleanCSS = require('gulp-clean-css');
-const sassProcessor = require('gulp-sass')(require('sass'));
-
-// We want to be using canonical Sass, rather than node-sass
-sassProcessor.compiler = require('sass');
-
-// Flags whether we compress the output etc
-const isProduction = process.env.NODE_ENV === 'production';
-
-// An array of outputs that should be sent over to includes
-const criticalStyles = ['critical.scss', 'home.scss', 'page.scss', 'work-item.scss'];
-
-// Takes the arguments passed by `dest` and determines where the output file goes
-const calculateOutput = ({history}) => {
- // By default, we want a CSS file in our dist directory, so the
- // HTML can grab it with a
- let response = './dist/css';
-
- // Get everything after the last slash
- const sourceFileName = /[^(/|\\)]*$/.exec(history[0])[0];
-
- // If this is critical CSS though, we want it to go
- // to the _includes directory, so nunjucks can include it
- // directly in a