diff --git a/src/lib/common/markdown/Markdown.svelte b/src/lib/common/markdown/Markdown.svelte index 87fb3371..b0a6cb5c 100644 --- a/src/lib/common/markdown/Markdown.svelte +++ b/src/lib/common/markdown/Markdown.svelte @@ -50,7 +50,7 @@ const normalizedText = typeof text !== 'string' ? `${JSON.stringify(text)}` : text; const markedText = !rawText ? replaceNewLine(marked(replaceMarkdown(normalizedText || ''))?.toString()) - : marked(normalizedText || '')?.toString(); + : marked(normalizedText || '', { breaks: true })?.toString(); if (!!markedText && markedText.endsWith('
')) { const idx = markedText.lastIndexOf('
'); return markedText.substring(0, idx); @@ -124,8 +124,20 @@ margin-bottom: 0; } + /* Tailwind's Preflight (app.css) resets ol/ul to `list-style: none` and + zero padding in @layer base. These unlayered rules restore the markers + for rendered markdown; call sites may still override padding/margins. */ + .markdown-container :global(strong) { + font-weight: 700; + } + .markdown-container :global(ul) { - list-style-position: outside; + list-style: disc outside; + padding-left: 1.5rem; + } + .markdown-container :global(ol) { + list-style: decimal outside; + padding-left: 1.5rem; } /* Variant: `markdown-lite` — used when the container sits on a dark diff --git a/src/lib/styles/pages/_agent.scss b/src/lib/styles/pages/_agent.scss index 8fb401d0..47816d3a 100644 --- a/src/lib/styles/pages/_agent.scss +++ b/src/lib/styles/pages/_agent.scss @@ -3792,7 +3792,7 @@ } -h1 { +.node h1 { font-size: 0.9rem; font-weight: 200; padding: 0; diff --git a/src/lib/styles/pages/_chat.scss b/src/lib/styles/pages/_chat.scss index 39fbad28..280bedc9 100644 --- a/src/lib/styles/pages/_chat.scss +++ b/src/lib/styles/pages/_chat.scss @@ -4504,6 +4504,59 @@ } +/* Markdown theme for the bot bubble. Markdown.svelte zeroes paragraph margins + for its other call sites, and headings otherwise fall through to the global + theme sizes, so block spacing and a modest heading scale are restored here. */ + + +.rcm-body .markdown-container { + & p { + margin: 0.3rem 0; + + &:first-child { + margin-top: 0; + } + + &:last-child { + margin-bottom: 0; + } + } + + & h1, + & h2, + & h3, + & h4, + & h5, + & h6 { + margin: 0.75rem 0 0.35rem; + color: inherit; + font-weight: 700; + line-height: 1.25; + + &:first-child { + margin-top: 0; + } + } + + & h1 { font-size: 1.25rem; } + & h2 { font-size: 1.15rem; } + & h3 { font-size: 1.05rem; } + & h4, + & h5, + & h6 { font-size: 1rem; } + + & ul, + & ol { + margin: 0.35rem 0; + padding-left: 1.4rem; + } + + & li { + margin: 0.2rem 0; + } +} + + /* Bold "Thinking" label inside the toggle row (replaces Bootstrap .font-bold) */ diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 4f7a05ff..19a29b3d 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -6,6 +6,7 @@ import '@fontsource/bebas-neue/400.css'; import '@fontsource/averia-libre/400.css'; import '@fontsource/libre-baskerville/400.css'; + import '@fontsource/libre-baskerville/700.css'; import '@fontsource/source-code-pro/400.css'; import '@fontsource/rethink-sans/400.css';