diff --git a/.eleventy.js b/.eleventy.js index 1cce19d6..ad896a36 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -1,21 +1,22 @@ -import syntaxHighlight from '@11ty/eleventy-plugin-syntaxhighlight' -import tablerIcons from '@cdransf/eleventy-plugin-tabler-icons' +import { createRequire } from 'module' +import dotenvFlow from 'dotenv-flow' +import filters from './config/filters/index.js' +import htmlmin from 'html-minifier-terser' import markdownIt from 'markdown-it' import markdownItAnchor from 'markdown-it-anchor' import markdownItFootnote from 'markdown-it-footnote' -import htmlmin from 'html-minifier-terser' -import filters from './config/filters/index.js' +import markdownItPrism from 'markdown-it-prism' +import syntaxHighlight from '@11ty/eleventy-plugin-syntaxhighlight' +import tablerIcons from '@cdransf/eleventy-plugin-tabler-icons' import { copyErrorPages, minifyJsComponents } from './config/events/index.js' import { processContent, albumReleasesCalendar } from './config/collections/index.js' import { cssConfig } from './config/plugins/css-config.js' import { DateTime } from 'luxon' // load .env -import dotenvFlow from 'dotenv-flow' dotenvFlow.config() // get app version -import { createRequire } from 'module' const require = createRequire(import.meta.url) const appVersion = require('./package.json').version @@ -75,6 +76,7 @@ export default async function (eleventyConfig) { }), }) md.use(markdownItFootnote) + md.use(markdownItPrism) eleventyConfig.setLibrary('md', md) // filters diff --git a/package-lock.json b/package-lock.json index a97e29e7..a3bfe309 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "coryd.dev", - "version": "25.0.0", + "version": "1.0.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "coryd.dev", - "version": "25.0.0", + "version": "1.0.1", "license": "MIT", "dependencies": { "@cdransf/api-text": "^1.5.0", @@ -32,6 +32,7 @@ "markdown-it": "^14.1.0", "markdown-it-anchor": "^9.2.0", "markdown-it-footnote": "^4.0.0", + "markdown-it-prism": "^2.3.0", "postcss": "^8.4.47", "postcss-cli": "^11.0.0", "postcss-import": "^16.1.0", @@ -2863,6 +2864,19 @@ "dev": true, "license": "MIT" }, + "node_modules/markdown-it-prism": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/markdown-it-prism/-/markdown-it-prism-2.3.0.tgz", + "integrity": "sha512-ePtHY80gZyeje4bn3R3SL0jpd1C9HFaYffJW2Ma0YD+tspqa2v9TuVwUyFwboFu4jnFNcO8oPQROgbcYJbmBvw==", + "dev": true, + "license": "MIT", + "dependencies": { + "prismjs": "1.29.0" + }, + "engines": { + "node": ">=6.0.0" + } + }, "node_modules/maximatch": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/maximatch/-/maximatch-0.1.0.tgz", diff --git a/package.json b/package.json index 504b68d1..20a8faa0 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "coryd.dev", - "version": "25.0.0", + "version": "1.0.1", "description": "The source for my personal site. Built using 11ty (and other tools).", "type": "module", "scripts": { @@ -45,6 +45,7 @@ "markdown-it": "^14.1.0", "markdown-it-anchor": "^9.2.0", "markdown-it-footnote": "^4.0.0", + "markdown-it-prism": "^2.3.0", "postcss": "^8.4.47", "postcss-cli": "^11.0.0", "postcss-import": "^16.1.0", diff --git a/src/assets/styles/plugins/prism.css b/src/assets/styles/plugins/prism.css index e8b9d1d3..df8142d5 100644 --- a/src/assets/styles/plugins/prism.css +++ b/src/assets/styles/plugins/prism.css @@ -32,6 +32,10 @@ pre, border: 1px solid var(--gray-300); } +pre > code { + padding: 0; +} + .namespace { opacity: 0.7; } @@ -42,72 +46,66 @@ pre, } .token { - &.comment, - &.prolog, - &.doctype, - &.cdata { - color: var(--gray-500); - } + color: var(--blue-200); +} - &.punctuation { - color: var(--gray-300); - } +.token.comment, +.token.prolog, +.token.doctype, +.token.cdata { + color: var(--gray-500); +} - &.property, - &.tag, - &.constant, - &.symbol, - &.deleted { - color: var(--blue-200); - } +.token.punctuation { + color: var(--gray-300); +} - &.boolean, - &.number { - color: var(--blue-400); - } +.token.boolean, +.token.number { + color: var(--blue-400); +} - &.selector, - &.attr-name, - &.string, - &.char, - &.builtin, - &.inserted { - color: #6fff6f; - } +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.inserted { + color: #6fff6f; +} - &.operator, - &.entity, - &.url, - &.variable { - color: #99ccff; - } +.token.operator, +.token.entity, +.token.url, +.token.variable { + color: #99ccff; +} - &.atrule, - &.attr-value, - &.function, - &.class-name { - color: #ff8f66; - } +.token.atrule, +.token.attr-value, +.token.function, +.token.class-name { + color: #ff8f66; +} - &.keyword { - color: #00ffff; - } +.token.keyword { + color: #00ffff; +} - &.regex, - &.important { - color: #ff7373; - } +.token.regex, +.token.important { + color: #ff7373; +} - &.italic { - font-style: italic; - } +.token.italic { + font-style: italic; +} - &.entity { - cursor: help; - } +.token.entity { + cursor: help; +} - &.important, - &.bold { - font-weight: var(--font-weight-bold); - } +.token.important, +.token.bold { + font-weight: var(--font-weight-bold); } \ No newline at end of file