feat: More icons and custom highlighter languages #35

Merged
aniva merged 3 commits from home/metadata into main 2024-11-05 11:56:16 -08:00
6 changed files with 45 additions and 12 deletions

View File

@ -11,7 +11,7 @@ repos:
hooks: hooks:
- id: conventional-pre-commit - id: conventional-pre-commit
stages: [commit-msg] stages: [commit-msg]
args: [feat, fix, chore, test, build, merge, refactor] args: [feat, fix, chore, test, build, merge, refactor, doc]
- repo: local - repo: local
hooks: hooks:
- id: eslint - id: eslint

View File

@ -19,6 +19,18 @@ To insert custom content, create a directory with a similar structure to
directory. The website will be built statically in `build/`. Note that changing directory. The website will be built statically in `build/`. Note that changing
`favicon.svg` will require modifying the `static/` folder. `favicon.svg` will require modifying the `static/` folder.
Set `metadata.json` based on the example to have a custom avatar and background
image.
- `name`: Displayed name on the home page
- `blogName`: Displayed name of the blog
- `url`: The site url
- `frontDescription`: The text above the main navbar
- `frontCover`: Path to the cover image
- `picture`: Avatar
- `links`: A map of brands to links
- `extra`: Extra pages showing on the navbar
- `markdown`: `{ "highlighterLangs": [ ... ], "katex": [ ... ] }`
## Developing ## Developing
Install [pre-commit](https://pre-commit.com/). Install [pre-commit](https://pre-commit.com/).

View File

@ -12,5 +12,12 @@
}, },
"extra": [ "extra": [
{ "route": "/archives", "name": "Archives" } { "route": "/archives", "name": "Archives" }
],
"markdown": {
"highlighterLangs": [
"python",
"lean",
"tex"
] ]
}
} }

View File

@ -26,3 +26,7 @@ $$
$$ $$
\vec z^{(l+1)} = \mat M\vec z^{(l)} + \vec b \vec z^{(l+1)} = \mat M\vec z^{(l)} + \vec b
$$ $$
```tex
\\newcommand{\\cirno}{9}
```

View File

@ -19,15 +19,22 @@
import metadata from '$content/metadata.json'; import metadata from '$content/metadata.json';
const iconMap: Map<string, string> = { const iconMap: Map<string, string> = {
"bitbucket": "fa-brands fa-bitbucket", "orcid": "fa-brands fa-orcid",
"google-scholar": "fa-brands fa-google-scholar",
"discord": "fa-brands fa-discord", "discord": "fa-brands fa-discord",
"email": "fa-solid fa-envelope", "email": "fa-solid fa-envelope",
"bitbucket": "fa-brands fa-bitbucket",
"github": "fa-brands fa-github", "github": "fa-brands fa-github",
"gitlab": "fa-brands fa-gitlab", "gitlab": "fa-brands fa-gitlab",
"google-scholar": "fa-brands fa-google-scholar",
"instagram": "fa-brands fa-instagram",
"open-source": "fa-brands fa-osi", "open-source": "fa-brands fa-osi",
"orcid": "fa-brands fa-orcid",
"bluesky": "fa-brands fa-bluesky",
"youtube": "fa-brands fa-youtube",
"instagram": "fa-brands fa-instagram",
"bandcamp": "fa-brands fa-bandcamp",
"pixiv": "fa-brands fa-pixiv",
}; };
const iconLinks: [string, string][] = Object.entries(metadata.links).map( const iconLinks: [string, string][] = Object.entries(metadata.links).map(
([key, link]) => [iconMap[key], link]); ([key, link]) => [iconMap[key], link]);

View File

@ -1,5 +1,6 @@
import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'; import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
import adapter from '@sveltejs/adapter-static'; import adapter from '@sveltejs/adapter-static';
import fs from 'fs';
import { mdsvex, escapeSvelte } from 'mdsvex'; import { mdsvex, escapeSvelte } from 'mdsvex';
import remarkAlert from './src/lib/markdown.js' import remarkAlert from './src/lib/markdown.js'
@ -12,7 +13,9 @@ import remarkMath from 'remark-math'
const contentDir = process.env?.CHRYSOBLOG_CONTENT ?? "src/content"; const contentDir = process.env?.CHRYSOBLOG_CONTENT ?? "src/content";
const langs = [ const metadata = await fs.promises.readFile(contentDir + "/metadata.json")
.then((file) => JSON.parse(file.toString()));
const langs = metadata?.markdown.highlighterLangs ?? [
"javascript", "javascript",
"lean", "lean",
"lisp", "lisp",
@ -26,11 +29,7 @@ const langs = [
"c++", "c++",
"sh", "sh",
]; ];
const highlightingThemes = { const katexOptions = metadata?.markdown.katex ?? {
light: 'vitesse-light',
dark: 'vitesse-dark',
};
const katexOptions = {
macros: { macros: {
"\\Nat": "\\mathbb N", "\\Nat": "\\mathbb N",
"\\Complex": "\\mathbb C", "\\Complex": "\\mathbb C",
@ -39,6 +38,10 @@ const katexOptions = {
"\\rv": "\\mathrm", "\\rv": "\\mathrm",
}, },
}; };
const highlightingThemes = {
light: 'vitesse-light',
dark: 'vitesse-dark',
};
const themes = Object.keys(highlightingThemes).map(function(k){ return highlightingThemes[k] }); const themes = Object.keys(highlightingThemes).map(function(k){ return highlightingThemes[k] });
const highlighter = await getHighlighter({ const highlighter = await getHighlighter({