Add support for code syntax highlighting
This commit is contained in:
parent
ed1a3e3cfa
commit
e284972969
|
@ -1,4 +1,5 @@
|
|||
const eleventyNavigationPlugin = require("@11ty/eleventy-navigation");
|
||||
const eleventySyntaxHighlight = require("@11ty/eleventy-plugin-syntaxhighlight");
|
||||
const eleventySass = require("eleventy-sass");
|
||||
const mdDefList = require("markdown-it-deflist");
|
||||
|
||||
|
@ -7,10 +8,13 @@ module.exports = function (eleventyConfig) {
|
|||
files: "./_site/css/**/*.css",
|
||||
});
|
||||
eleventyConfig.addPassthroughCopy({
|
||||
"node_modules/prismjs/themes/prism.min.css": "css/prism.min.css",
|
||||
"node_modules/prismjs/themes/prism-tomorrow.min.css": "css/prism-tomorrow.min.css",
|
||||
"node_modules/feather-icons/dist/feather-sprite.svg": "images/feather-sprite.svg",
|
||||
"src/js/site.js": "js/site.js"
|
||||
});
|
||||
eleventyConfig.addPlugin(eleventyNavigationPlugin);
|
||||
eleventyConfig.addPlugin(eleventySyntaxHighlight);
|
||||
eleventyConfig.addPlugin(eleventySass, {
|
||||
sass: {
|
||||
loadPaths: ["node_modules"],
|
||||
|
@ -41,9 +45,7 @@ module.exports = function (eleventyConfig) {
|
|||
collection.sort((a, b) => a.data.sectionOrder - b.data.sectionOrder)
|
||||
);
|
||||
eleventyConfig.addFilter("filterDrafts", collection => {
|
||||
if (process.env.BUILD_DRAFTS === true) {
|
||||
console.log("Skipping filtering drafts");
|
||||
|
||||
if (process.env.BUILD_DRAFTS) {
|
||||
return collection;
|
||||
}
|
||||
|
||||
|
|
|
@ -14,7 +14,7 @@
|
|||
}
|
||||
},
|
||||
"environment" : {
|
||||
"BUILD_DRAFTS" : "false"
|
||||
"BUILD_DRAFTS" : "true"
|
||||
},
|
||||
"openLogOnRun" : "fail",
|
||||
"persistent" : true
|
||||
|
|
39
package-lock.json
generated
39
package-lock.json
generated
|
@ -10,11 +10,13 @@
|
|||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"feather-icons": "^4.29.0",
|
||||
"normalize.css": "^8.0.1"
|
||||
"normalize.css": "^8.0.1",
|
||||
"prismjs": "^1.29.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@11ty/eleventy": "^2.0.0",
|
||||
"@11ty/eleventy-navigation": "^0.3.5",
|
||||
"@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
|
||||
"eleventy-sass": "^2.2.3",
|
||||
"markdown-it-deflist": "^2.1.0"
|
||||
}
|
||||
|
@ -123,6 +125,19 @@
|
|||
"url": "https://opencollective.com/11ty"
|
||||
}
|
||||
},
|
||||
"node_modules/@11ty/eleventy-plugin-syntaxhighlight": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@11ty/eleventy-plugin-syntaxhighlight/-/eleventy-plugin-syntaxhighlight-5.0.0.tgz",
|
||||
"integrity": "sha512-y9BUmP1GofmbJgxM1+ky/UpFCpD8JSOeLeKItUs0WApgnrHk9haHziW7lS86lbArX5SiCVo4zTTw9x53gvRCaA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"prismjs": "^1.29.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/11ty"
|
||||
}
|
||||
},
|
||||
"node_modules/@11ty/eleventy-utils": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@11ty/eleventy-utils/-/eleventy-utils-1.0.1.tgz",
|
||||
|
@ -1865,6 +1880,14 @@
|
|||
"node": ">= 4"
|
||||
}
|
||||
},
|
||||
"node_modules/prismjs": {
|
||||
"version": "1.29.0",
|
||||
"resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.29.0.tgz",
|
||||
"integrity": "sha512-Kx/1w86q/epKcmte75LNrEoT+lX8pBpavuAbvJWRXar7Hz8jrtF+e3vY751p0R8H9HdArwaCTNDDzHg/ScJK1Q==",
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/promise": {
|
||||
"version": "7.3.1",
|
||||
"resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
|
||||
|
@ -2513,6 +2536,15 @@
|
|||
"dependency-graph": "^0.11.0"
|
||||
}
|
||||
},
|
||||
"@11ty/eleventy-plugin-syntaxhighlight": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@11ty/eleventy-plugin-syntaxhighlight/-/eleventy-plugin-syntaxhighlight-5.0.0.tgz",
|
||||
"integrity": "sha512-y9BUmP1GofmbJgxM1+ky/UpFCpD8JSOeLeKItUs0WApgnrHk9haHziW7lS86lbArX5SiCVo4zTTw9x53gvRCaA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"prismjs": "^1.29.0"
|
||||
}
|
||||
},
|
||||
"@11ty/eleventy-utils": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@11ty/eleventy-utils/-/eleventy-utils-1.0.1.tgz",
|
||||
|
@ -3804,6 +3836,11 @@
|
|||
"promise-each": "^2.2.0"
|
||||
}
|
||||
},
|
||||
"prismjs": {
|
||||
"version": "1.29.0",
|
||||
"resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.29.0.tgz",
|
||||
"integrity": "sha512-Kx/1w86q/epKcmte75LNrEoT+lX8pBpavuAbvJWRXar7Hz8jrtF+e3vY751p0R8H9HdArwaCTNDDzHg/ScJK1Q=="
|
||||
},
|
||||
"promise": {
|
||||
"version": "7.3.1",
|
||||
"resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
|
||||
|
|
|
@ -14,11 +14,13 @@
|
|||
"devDependencies": {
|
||||
"@11ty/eleventy": "^2.0.0",
|
||||
"@11ty/eleventy-navigation": "^0.3.5",
|
||||
"@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
|
||||
"eleventy-sass": "^2.2.3",
|
||||
"markdown-it-deflist": "^2.1.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"feather-icons": "^4.29.0",
|
||||
"normalize.css": "^8.0.1"
|
||||
"normalize.css": "^8.0.1",
|
||||
"prismjs": "^1.29.0"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -14,6 +14,8 @@
|
|||
{% endif %}
|
||||
</title>
|
||||
|
||||
<link rel="stylesheet" href="{{ '/css/prism.min.css' }}" media="(prefers-color-scheme: light)">
|
||||
<link rel="stylesheet" href="{{ '/css/prism-tomorrow.min.css' }}" media="(prefers-color-scheme: dark)">
|
||||
<link rel="stylesheet" href="{{ '/css/site.css' | url }}">
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
@ -35,6 +35,7 @@ header {
|
|||
|
||||
main {
|
||||
width: 100%;
|
||||
min-width: 0px;
|
||||
max-width: 70em;
|
||||
padding: 2rem;
|
||||
margin-left: auto;
|
||||
|
|
|
@ -17,3 +17,17 @@ code {
|
|||
border: solid 1px var(--primary-border-color);
|
||||
border-radius: calc(var(--main-border-radius) / 2);
|
||||
}
|
||||
|
||||
pre {
|
||||
background: var(--code-background);
|
||||
padding: 1em;
|
||||
border: solid 1px var(--primary-border-color);
|
||||
border-radius: calc(var(--main-border-radius) / 2);
|
||||
|
||||
code {
|
||||
background: unset;
|
||||
padding: unset;
|
||||
border: unset;
|
||||
border-radius: unset;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -11,6 +11,9 @@ eleventyNavigation:
|
|||
<section>
|
||||
<h2><a href={{ post.url }}>{{ post.data.title }}</a></h2>
|
||||
<div>
|
||||
<svg class="icon">
|
||||
<use href="/images/feather-sprite.svg#clock" />
|
||||
</svg>
|
||||
{{ post.date.toLocaleDateString("en-US") }}
|
||||
</div>
|
||||
<p>{{ post.data.description }}</p>
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
{
|
||||
"tags": [ "posts" ]
|
||||
"tags": [ "posts" ],
|
||||
"date": "git Created"
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue