From ebead0ae881f1e2626d41e35f0db87512fc92378 Mon Sep 17 00:00:00 2001 From: Ava Gaiety W Date: Tue, 6 May 2025 11:02:07 -0600 Subject: [PATCH] upgraded catppuccin deps, prettier code blocks --- .eleventy.js | 3 ++- _includes/base-header.html | 2 +- package-lock.json | 10 +++++----- package.json | 6 +++--- repos/svgdir2sprite.md | 4 ++-- styles.css | 29 ++++++++++++++++++++++++----- 6 files changed, 37 insertions(+), 17 deletions(-) diff --git a/.eleventy.js b/.eleventy.js index 24302af..67bc02c 100644 --- a/.eleventy.js +++ b/.eleventy.js @@ -35,6 +35,7 @@ const markdownClassMapping = { video: ['max-w-full', 'rounded-lg', 'max-h-600px', 'contrast-more:contrast-50'], // (contrast-more-50 here undoes the content contrast boost elsewhere) ul: ['list-disc', 'ml-4', 'text-subtext0'], li: ['text-subtext0'], + code: ['hljs'] }; setup(hljs); @@ -44,7 +45,7 @@ const md = markdownit({ highlight: function (str, lang) { if (lang && hljs.getLanguage(lang)) { try { - return hljs.highlight(str, { language: lang }).value; + return hljs.highlight(str, { language: lang }).value + `${lang}`; } catch (__) { } } diff --git a/_includes/base-header.html b/_includes/base-header.html index 05fc35b..dea19b2 100644 --- a/_includes/base-header.html +++ b/_includes/base-header.html @@ -28,7 +28,7 @@ - + diff --git a/package-lock.json b/package-lock.json index de61167..188d04e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,14 +14,14 @@ "devDependencies": { "@11ty/eleventy": "^3.0.0", "@11ty/eleventy-plugin-syntaxhighlight": "^3.1.3", - "@catppuccin/highlightjs": "^0.1.4", + "@catppuccin/highlightjs": "^1.0.1", "@catppuccin/tailwindcss": "^0.1.6", "@divriots/jampack": "^0.23.3", "autoprefixer": "^10.3.7", "cheerio": "^1.0.0-rc.12", "cssnano": "^5.0.8", "dayjs": "^1.11.10", - "highlight.js": "^11.9.0", + "highlight.js": "^11.11.0", "highlightjs-glimmer": "^2.2.1", "install": "^0.13.0", "npm": "^10.5.0", @@ -332,9 +332,9 @@ } }, "node_modules/@catppuccin/highlightjs": { - "version": "0.1.4", - "resolved": "https://registry.npmjs.org/@catppuccin/highlightjs/-/highlightjs-0.1.4.tgz", - "integrity": "sha512-PEzMrpE7VvXFLvQuNAomTcvAuXUJlBlcqvSqhHYFapSxBKye+auNokemssEVuv053KH7Go44Aa4sE+rZNOM5cQ==", + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@catppuccin/highlightjs/-/highlightjs-1.0.1.tgz", + "integrity": "sha512-wnagsNQbJroHQMalkprwRoapfGV1hHRx46d7GXp4kf6rlShImBlgpqPCt9OD471Gq4qpHdfFH/GJFIvY1CLqHA==", "dev": true, "funding": [ { diff --git a/package.json b/package.json index f29cdab..7b489f3 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "start:site": "npx @11ty/eleventy --serve", "build": "npx @11ty/eleventy", "postbuild": "run-s postbuild:*", - "postbuild:highlighttheme": "cp ./node_modules/@catppuccin/highlightjs/css/catppuccin.variables.css ./_site", + "postbuild:highlighttheme": "cp ./node_modules/@catppuccin/highlightjs/css/catppuccin-variables.rgb.css ./_site", "postbuild:styles": "npx tailwindcss -i styles.css -o _site/styles.css --env production", "optimize": "rm -rf _site/_jampack && jampack _site", "test": "echo \"Error: no test specified\" && exit 1", @@ -31,14 +31,14 @@ "devDependencies": { "@11ty/eleventy": "^3.0.0", "@11ty/eleventy-plugin-syntaxhighlight": "^3.1.3", - "@catppuccin/highlightjs": "^0.1.4", + "@catppuccin/highlightjs": "^1.0.1", "@catppuccin/tailwindcss": "^0.1.6", "@divriots/jampack": "^0.23.3", "autoprefixer": "^10.3.7", "cheerio": "^1.0.0-rc.12", "cssnano": "^5.0.8", "dayjs": "^1.11.10", - "highlight.js": "^11.9.0", + "highlight.js": "^11.11.0", "highlightjs-glimmer": "^2.2.1", "install": "^0.13.0", "npm": "^10.5.0", diff --git a/repos/svgdir2sprite.md b/repos/svgdir2sprite.md index 8f17551..ba05f05 100644 --- a/repos/svgdir2sprite.md +++ b/repos/svgdir2sprite.md @@ -39,13 +39,13 @@ svgdir2sprite('./src/svgs', './build/spritesheet.svg'); ### Return SVG Spritesheet to the Console -``` shell +```bash svgdir2sprite ./src/svgs ``` ### Write SVG Spritesheet to File -``` sh +```bash svgdir2sprite ./src/svgs ./build/spritesheet.svg ``` diff --git a/styles.css b/styles.css index 43652c5..fa9e09c 100644 --- a/styles.css +++ b/styles.css @@ -56,24 +56,43 @@ pre, p > code { font-family: "VictorMono", monospace; font-variant-ligatures: contextual; color: rgb(var(--ctp-text)); - outline: 1px solid rgb(var(--ctp-surface0)); - border-radius: 0.25rem; } p > code { padding: 0 .25rem; display: inline-block; background-color: rgb(var(--ctp-mantle)); - color: rgb(var(--ctp-blue)); + color: rgb(var(--ctp-red)); + border: 1px solid rgb(var(--ctp-surface0)); + border-radius: 0.25rem; font-size: 0.875rem; } pre { - padding: 0.5rem 0.75rem; - margin: 0.5rem 0 ; + position: relative; + padding: 1rem 0.75rem; + margin: 1rem 0 ; overflow: auto; max-width: 100%; white-space: pre-wrap; page-break-inside: avoid; background-color: rgb(var(--ctp-crust)); + mask: + radial-gradient(0.56rem at 50% 0.75rem,#000 99%,#0000 101%) calc(50% - 0.5rem) 0/1rem 51% repeat-x, + radial-gradient(0.56rem at 50% -0.5rem,#0000 99%,#000 101%) 50% .25rem/1rem calc(51% - .25rem) repeat-x, + radial-gradient(0.56rem at 50% calc(100% - 0.75rem),#000 99%,#0000 101%) calc(50% - 0.5rem) 100%/1rem 51% repeat-x, + radial-gradient(0.56rem at 50% calc(100% + 0.5rem),#0000 99%,#000 101%) 50% calc(100% - .25rem)/1rem calc(51% - .25rem) repeat-x; + + .hljs-language-icon { + position: absolute; + top: 0; + right: 0; + padding: .2rem .25rem; + color: rgb(var(--ctp-subtext1)); + background-color: rgb(var(--ctp-base)); + border-left: 1px solid rgb(var(--ctp-surface0)); + border-bottom: 1px solid rgb(var(--ctp-surface0)); + border-radius: 0 0 0 0.25rem; + font-size: 0.875rem; + } } .hljs-comment {