1 min read

Content

Prose

Doxi includes the @tailwindcss/typography package to easily style the markdown content. Besides the default prose styles, Doxi modifies basic elements like prose-em, prose-blockquote to fit the brand design.

MDX Components

By default, Doxi include overwrites for a and pre HTML tags:

// /src/lib/mdx.tsx
import Link from "@/components/docs/link";
import Pre from "@/components/docs/pre";
 
export const components = {
  a: Link, // support client side transition `next/link`
  pre: Pre, // add 'copy & paste'-button
  // ...
};

Extend the components object with your JSX Components to make use of it in your mdx content.

Pretty Code Blocks

Big props go to the rehype-pretty-code library that includes lots of syntax highlighting. Check out the docs to learn more.

Here is a quick overview you can use with Doxi:

  • word highlighting
  • line highlighting
  • number of lines
  • themes

last edited: 4/1/2023