authorgravatar for 589761+jvzijp@users.noreply.github.comJacob <589761+jvzijp@users.noreply.github.com> 2026-04-10 02:52:41+02:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-04-09 17:52:41-07:00
log7c0849fe2e449c25ff43a1d5993f6f75b2be3a59
tree910003b3ba2f8161e80cec9edec315a22cafdbb5
parent592c234fd5d1ba8eb59197a15affbbda1150341f
signature Signed by PGP key B5690EEEBB952194

fix(web): harmonize typography in chat messages and code blocks (#1861)


3 files changed, 9 insertions(+), 10 deletions(-)

apps/web/src/components/ChatMarkdown.tsx+1-1
......@@ -165,7 +165,7 @@ function MarkdownCodeBlock({ code, children }: { code: string; children: ReactNo
165165 );
166166
167167 return (
168 <div className="chat-markdown-codeblock">
168 <div className="chat-markdown-codeblock leading-snug">
169169 <button
170170 type="button"
171171 className="chat-markdown-copy-button"
apps/web/src/components/chat/MessagesTimeline.tsx+7-7
......@@ -428,7 +428,7 @@ export const MessagesTimeline = memo(function MessagesTimeline({
428428 </Button>
429429 )}
430430 </div>
431 <p className="text-right text-[10px] text-muted-foreground/30">
431 <p className="text-right text-xs text-muted-foreground/50">
432432 {formatTimestamp(row.message.createdAt, timestampFormat)}
433433 </p>
434434 </div>
......@@ -515,7 +515,7 @@ export const MessagesTimeline = memo(function MessagesTimeline({
515515 </div>
516516 );
517517 })()}
518 <p className="mt-1.5 text-[10px] text-muted-foreground/30">
518 <p className="mt-1.5 text-xs text-muted-foreground/50">
519519 {formatMessageMeta(
520520 row.message.createdAt,
521521 row.message.streaming
......@@ -703,7 +703,7 @@ const UserMessageBody = memo(function UserMessageBody(props: {
703703 }
704704
705705 return (
706 <div className="wrap-break-word whitespace-pre-wrap font-mono text-sm leading-relaxed text-foreground">
706 <div className="whitespace-pre-wrap wrap-break-word text-sm leading-relaxed text-foreground">
707707 {inlineNodes}
708708 </div>
709709 );
......@@ -731,7 +731,7 @@ const UserMessageBody = memo(function UserMessageBody(props: {
731731 }
732732
733733 return (
734 <div className="wrap-break-word whitespace-pre-wrap font-mono text-sm leading-relaxed text-foreground">
734 <div className="whitespace-pre-wrap wrap-break-word text-sm leading-relaxed text-foreground">
735735 {inlineNodes}
736736 </div>
737737 );
......@@ -742,9 +742,9 @@ const UserMessageBody = memo(function UserMessageBody(props: {
742742 }
743743
744744 return (
745 <pre className="whitespace-pre-wrap wrap-break-word font-mono text-sm leading-relaxed text-foreground">
745 <div className="whitespace-pre-wrap wrap-break-word text-sm leading-relaxed text-foreground">
746746 {props.text}
747 </pre>
747 </div>
748748 );
749749});
750750
......@@ -871,7 +871,7 @@ const SimpleWorkEntryRow = memo(function SimpleWorkEntryRow(props: {
871871 <div className="max-w-full">
872872 <p
873873 className={cn(
874 "truncate text-[11px] leading-5",
874 "truncate text-xs leading-5",
875875 workToneClass(workEntry.tone),
876876 preview ? "text-muted-foreground/70" : "",
877877 )}
apps/web/src/index.css+1-2
......@@ -335,8 +335,7 @@ label:has(> select#reasoning-effort) select {
335335 border: none;
336336 background: transparent;
337337 padding: 0;
338 line-height: 1.5;
339 font-size: 0.875rem;
338 font-size: 0.75rem;
340339}
341340
342341.chat-markdown .chat-markdown-codeblock {