Chrysoblog

A blog framework

Building

To create the production version,

pnpm run build

You can preview the production build with pnpm run dev --open.

Content

To insert custom content, create a directory with a similar structure to src/content, and set the environment variable CHRYSOBLOG_CONTENT to that directory. The website will be built statically in build/. Note that changing 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
• picture: Avatar
• links: A map of brands to links
• extra: Extra pages showing on the navbar
• markdown: { "highlighterLangs": [ ... ], "katex": [ ... ] }

Developing

Install pre-commit.

Install dependencies with pnpm install. Then start the dev server with

pnpm run dev [-- --open]

Formatting

pnpx eslint

Testing

To run tests

pnpx playwright test

All tests must have the suffix .spec.[jt]s. Be cautious while updating playwright since the versions in nixpkgs and node must exactly match.

SVG Assets

For SVG assets in Inkscape, export the asset using the export panel instead of "Save As". This preserves special effects such as blurring.

For full screen assets: Delete the width and height attributes on the root tag after exporting SVGs.