yuki/yuki.k4w411.net
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

initial scss templating

Browse source
This commit is contained in:
yuki 2025-03-27 06:29:56 -03:00
parent 44205a7d24
commit 6cd5becee9
Signed by: yuki
GPG key ID: 0C98E6FF04EC3915
6 changed files with 49 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
_includes/base.njk
View file

@ -4,6 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% if title %} {{ title }} | {{ meta.sitename }} {% else %} {{ meta.sitename }} {% endif %}</title>
<link rel="stylesheet" href="/css/{{ style if style else "general_styles" }}.css">
</head>
<body>
{{ content | safe }}

4
_includes/general.scss Normal file
View file

@ -0,0 +1,4 @@
body {
background-color: bisque;
color: blueviolet;
}

1
css/general_styles.scss Normal file
View file

@ -0,0 +1 @@
@use "general";

18
eleventy.config.js
View file

@ -1,22 +1,8 @@
const sass = require("sass");
const eleventySass = require("eleventy-sass");
module.exports = function (eleventyConfig) {
eleventyConfig.addTemplateFormats("scss");
eleventyConfig.addPlugin(eleventySass);
// Creates the extension for use
eleventyConfig.addExtension("scss", {
outputFileExtension: "css", // optional, default: "html"
// `compile` is called once per .scss file in the input directory
compile: async function (inputContent) {
let result = sass.compileString(inputContent);
// This is the render function, `data` is the full data cascade
return async (data) => {
return result.css;
};
},
});
return {
markdownTemplateEngine: "njk",
htmlTemplateEngine: "njk"

39
package-lock.json generated
View file

@ -10,6 +10,7 @@
"license": "WTFPL",
"dependencies": {
"@11ty/eleventy": "^3.0.0",
"eleventy-sass": "^3.0.0-beta.0",
"sass": "^1.86.0"
}
},
@ -1095,6 +1096,34 @@
"integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
"license": "MIT"
},
"node_modules/eleventy-sass": {
"version": "3.0.0-beta.0",
"resolved": "https://registry.npmjs.org/eleventy-sass/-/eleventy-sass-3.0.0-beta.0.tgz",
"integrity": "sha512-pO+CLz3M/MgOkZ4L7zp0pCY7cxXvX23yTZBEp8vcgIr2Z8xiSfeZqhHMiz53GazJay0A8AUnhBbEfuGMI1RLXA==",
"license": "MIT",
"dependencies": {
"debug": "^4.3.3",
"kleur": "^4.1.4",
"sass": "^1.49.7",
"upath": "^2.0.1"
},
"engines": {
"node": ">=22.0.0"
},
"peerDependencies": {
"@11ty/eleventy": "^3.0.0-beta.1",
"eleventy-plugin-clean": "^1.1.0",
"eleventy-plugin-rev": "^2.0.0"
},
"peerDependenciesMeta": {
"eleventy-plugin-clean": {
"optional": true
},
"eleventy-plugin-rev": {
"optional": true
}
}
},
"node_modules/emoji-regex": {
"version": "9.2.2",
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
@ -2461,6 +2490,16 @@
"node": ">= 0.8"
}
},
"node_modules/upath": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/upath/-/upath-2.0.1.tgz",
"integrity": "sha512-1uEe95xksV1O0CYKXo8vQvN1JEbtJp7lb7C5U9HMsIp6IVwntkH/oNUzyVNQSd4S1sYk2FpSSW44FqMc8qee5w==",
"license": "MIT",
"engines": {
"node": ">=4",
"yarn": "*"
}
},
"node_modules/urlpattern-polyfill": {
"version": "10.0.0",
"resolved": "https://registry.npmjs.org/urlpattern-polyfill/-/urlpattern-polyfill-10.0.0.tgz",

3
package.json
View file

@ -4,7 +4,7 @@
"description": "my website!!",
"main": "index.js",
"scripts": {
"watch:eleventy": "npx @11ty/eleventy --watch",
"watch:eleventy": "npx --node-options=\"--experimental-require-module\" @11ty/eleventy --watch",
"watch:sass": "npx sass sass:_site/css --watch",
"start": "npm run watch:eleventy"
},
@ -14,6 +14,7 @@
"type": "commonjs",
"dependencies": {
"@11ty/eleventy": "^3.0.0",
"eleventy-sass": "^3.0.0-beta.0",
"sass": "^1.86.0"
}
}