feat: improve markdown note styles and layout logic

This commit is contained in:
Shine1i 2026-02-24 04:04:02 +01:00
commit dad78ae0ce
10 changed files with 157 additions and 42 deletions

View file

@ -19,16 +19,24 @@ function MarkdownPreviewImpl({
className,
plain = false,
}: MarkdownPreviewProps): ReactElement {
const markdownClassName =
"w-full max-w-none min-w-0 space-y-2 [overflow-wrap:anywhere] [&_*]:max-w-none [&_p]:w-full [&_ul]:w-full [&_ol]:w-full [&_li]:w-full [&_h1]:w-full [&_h2]:w-full [&_h3]:w-full [&_h4]:w-full [&_h5]:w-full [&_h6]:w-full [&_pre]:w-full [&_table]:w-full [&_p]:break-words [&_li]:break-words [&_code]:break-words [&_pre]:whitespace-pre-wrap [&_pre]:break-words";
return (
<div
className={cn(
plain
? "h-full w-full overflow-auto p-2 text-xs leading-relaxed pointer-events-none select-none"
: "nodrag max-h-56 overflow-auto rounded-md border border-border/60 bg-muted/20 p-2 text-xs leading-relaxed",
? "h-full w-full min-w-0 overflow-auto p-2 text-xs leading-relaxed pointer-events-none select-none"
: "nodrag max-h-56 w-full min-w-0 overflow-auto rounded-md border border-border/60 bg-muted/20 p-2 text-xs leading-relaxed",
className,
)}
>
<Streamdown mode="static" plugins={MARKDOWN_PLUGINS} controls={false}>
<Streamdown
mode="static"
plugins={MARKDOWN_PLUGINS}
controls={false}
className={markdownClassName}
>
{markdown.trim() ? markdown : "_Empty note_"}
</Streamdown>
</div>