Built for people who think better out loud.
1<script lang="ts">
2 import type { HTMLAttributes } from "svelte/elements";
3 let {
4 class: className = "",
5 children,
6 ...props
7 }: HTMLAttributes<HTMLDivElement> = $props();
8</script>
9
10<div
11 {...props}
12 class={`
13 prose prose-slate max-w-none font-base
14
15 prose-headings:font-accent prose-headings:underline
16
17 prose-a:text-blue-600 prose-a:no-underline
18 prose-a:hover:underline
19
20 prose-ul:pl-9 prose-ol:pl-9
21
22 prose-kbd:border-s-slate-950 prose-kbd:rounded-md
23 prose-kbd:border-l prose-kbd:border-t prose-kbd:border-r-3 prose-kbd:border-b-3
24 ${className}
25 `}
26>
27 {@render children?.()}
28</div>