authorgravatar for 269035359+t3-code[bot]@users.noreply.github.comt3-code[bot] <269035359+t3-code[bot]@users.noreply.github.com> 2026-08-04 13:34:10+02:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-08-04 13:34:10+02:00
log25ec0b9d13deaaa6d30c42f66ddfee633e9a29be
tree1ae51c844cc936cb3fe9fa2211fbd34a8316a3ec
parent966cc05a9007a4ad1b7f8d5d3a1fc0e5c82a5b94
signature Signed by PGP key B5690EEEBB952194

fix(web): simplify chat code blocks (#5301)

2 files changed, 6 insertions(+), 10 deletions(-)

apps/web/src/components/ChatMarkdown.tsx+2-2
...@@ -594,7 +594,7 @@ function MarkdownCodeBlock({...@@ -594,7 +594,7 @@ function MarkdownCodeBlock({
594594
595 return (595 return (
596 <div596 <div
597 className="chat-markdown-codeblock leading-snug"597 className="chat-markdown-codeblock border border-border/70 bg-secondary leading-snug dark:border-transparent dark:bg-input/32"
598 data-language={language}598 data-language={language}
599 data-wrap={wrapped ? "true" : "false"}599 data-wrap={wrapped ? "true" : "false"}
600 >600 >
...@@ -606,7 +606,7 @@ function MarkdownCodeBlock({...@@ -606,7 +606,7 @@ function MarkdownCodeBlock({
606 theme={theme}606 theme={theme}
607 />607 />
608 </span>608 </span>
609 <span className="flex items-center gap-0.5">609 <span className="flex items-center gap-0.5" role="toolbar" aria-label="Code block actions">
610 <Tooltip>610 <Tooltip>
611 <TooltipTrigger611 <TooltipTrigger
612 render={612 render={
apps/web/src/index.css+4-8
...@@ -1415,9 +1415,7 @@ label:has(> select#reasoning-effort) select {...@@ -1415,9 +1415,7 @@ label:has(> select#reasoning-effort) select {
1415.chat-markdown .chat-markdown-codeblock {1415.chat-markdown .chat-markdown-codeblock {
1416 margin: 0.65rem 0;1416 margin: 0.65rem 0;
1417 overflow: hidden;1417 overflow: hidden;
1418 border: 1px solid var(--border);1418 border-radius: var(--radius);
1419 border-radius: 0.75rem;
1420 background: color-mix(in srgb, var(--muted) 78%, var(--background));
1421}1419}
14221420
1423.chat-markdown .chat-markdown-codeblock-header {1421.chat-markdown .chat-markdown-codeblock-header {
...@@ -1425,10 +1423,8 @@ label:has(> select#reasoning-effort) select {...@@ -1425,10 +1423,8 @@ label:has(> select#reasoning-effort) select {
1425 align-items: center;1423 align-items: center;
1426 justify-content: space-between;1424 justify-content: space-between;
1427 gap: 0.5rem;1425 gap: 0.5rem;
1428 border-bottom: 1px solid var(--border);1426 padding: 0.375rem 0.375rem 0 0.75rem;
1429 background: var(--muted);1427 color: color-mix(in srgb, var(--foreground) 72%, transparent);
1430 padding: 0.25rem 0.375rem 0.25rem 0.7rem;
1431 color: var(--muted-foreground);
1432}1428}
14331429
1434.chat-markdown .chat-markdown-codeblock-title {1430.chat-markdown .chat-markdown-codeblock-title {
...@@ -1441,7 +1437,7 @@ label:has(> select#reasoning-effort) select {...@@ -1441,7 +1437,7 @@ label:has(> select#reasoning-effort) select {
1441}1437}
14421438
1443.chat-markdown .chat-markdown-chrome-action {1439.chat-markdown .chat-markdown-chrome-action {
1444 color: var(--muted-foreground);1440 color: color-mix(in srgb, var(--foreground) 72%, transparent);
1445}1441}
14461442
1447.chat-markdown .chat-markdown-chrome-action:hover {1443.chat-markdown .chat-markdown-chrome-action:hover {