From 5885a03c8c2b4b9f91816a194cc4895ec3e46e3c Mon Sep 17 00:00:00 2001 From: Matt Rubens Date: Tue, 17 Dec 2024 11:25:50 -0500 Subject: [PATCH] Fixes to markdown wrapping --- .../src/components/common/MarkdownBlock.tsx | 26 ++++++++++++++----- 1 file changed, 19 insertions(+), 7 deletions(-) diff --git a/webview-ui/src/components/common/MarkdownBlock.tsx b/webview-ui/src/components/common/MarkdownBlock.tsx index 37a0278..669cab2 100644 --- a/webview-ui/src/components/common/MarkdownBlock.tsx +++ b/webview-ui/src/components/common/MarkdownBlock.tsx @@ -54,14 +54,21 @@ const StyledMarkdown = styled.div` pre { background-color: ${CODE_BLOCK_BG_COLOR}; border-radius: 3px; - margin: 13x 0; - padding: 10px 10px; - max-width: calc(100vw - 20px); - overflow-x: auto; - overflow-y: hidden; + margin: 13px 0; + padding: 10px; + max-width: 100%; + white-space: pre-wrap; + word-break: break-word; + overflow-wrap: break-word; } pre > code { + white-space: pre-wrap; + word-break: break-word; + overflow-wrap: break-word; + width: 100%; + display: inline-block; + .hljs-deletion { background-color: var(--vscode-diffEditor-removedTextBackground); display: inline-block; @@ -78,7 +85,9 @@ const StyledMarkdown = styled.div` span.line:empty { display: none; } - word-wrap: break-word; + white-space: pre-wrap; + word-break: break-word; + overflow-wrap: break-word; border-radius: 3px; background-color: ${CODE_BLOCK_BG_COLOR}; font-size: var(--vscode-editor-font-size, var(--vscode-font-size, 12px)); @@ -116,7 +125,10 @@ const StyledMarkdown = styled.div` li, ol, ul { - line-height: 1.25; + line-height: 1.4; + white-space: pre-wrap; + word-break: break-word; + overflow-wrap: break-word; } ol,