字体大小修改

This commit is contained in:
fengxiangdebaozi committed 2026-06-04 20:49:32 +08:00
1 parent 90bced3ed2
commit cca3d8eb41
5 files changed
+116 -55

No files matched your search

@@ -119,16 +119,16 @@ export const sharedMarkdownComponents = {
<li className="leading-snug">{children}</li> <li className="leading-snug">{children}</li>
), ),
h1: ({ children }: { children?: React.ReactNode }) => ( h1: ({ children }: { children?: React.ReactNode }) => (
<h1 className="text-sm font-bold mt-2 mb-1">{children}</h1> <h1 className="text-lg font-bold mt-2 mb-1">{children}</h1>
), ),
h2: ({ children }: { children?: React.ReactNode }) => ( h2: ({ children }: { children?: React.ReactNode }) => (
<h2 className="text-sm font-bold mt-2 mb-1">{children}</h2> <h2 className="text-base font-bold mt-2 mb-1">{children}</h2>
), ),
h3: ({ children }: { children?: React.ReactNode }) => ( h3: ({ children }: { children?: React.ReactNode }) => (
<h3 className="text-sm font-bold mt-1.5 mb-0.5">{children}</h3> <h3 className="roundtable-chat-message font-bold mt-1.5 mb-0.5">{children}</h3>
), ),
h4: ({ children }: { children?: React.ReactNode }) => ( h4: ({ children }: { children?: React.ReactNode }) => (
<h4 className="text-sm font-bold mt-1 mb-0.5">{children}</h4> <h4 className="roundtable-chat-message font-bold mt-1 mb-0.5">{children}</h4>
), ),
strong: ({ children }: { children?: React.ReactNode }) => ( strong: ({ children }: { children?: React.ReactNode }) => (
<strong className="font-bold text-slate-900">{children}</strong> <strong className="font-bold text-slate-900">{children}</strong>
@@ -1,44 +1,75 @@
/** /**
* 圆桌 Step 3 报告里 `react-markdown` 的紧凑渲染组件集(小字号、卡片内排版)。 * 圆桌 Step 3 报告里 `react-markdown` 的渲染组件集(卡片内排版)。
* 抽到独立文件供 `HighFidelityReport` 与 `Step3ReportMode` 共用,避免两者互相 import * 抽到独立文件供 `HighFidelityReport` 与 `Step3ReportMode` 共用,避免两者互相 import
* 形成循环依赖。 * 形成循环依赖。
*/ */
export const markdownComponents = { export const markdownComponents = {
p: ({ children }: any) => <p className="my-1.5 whitespace-pre-wrap leading-relaxed">{children}</p>, p: ({ children }: any) => (
ul: ({ children }: any) => <ul className="list-disc pl-5 my-1.5 space-y-1">{children}</ul>, <p className="roundtable-chat-message my-1.5 whitespace-pre-wrap">{children}</p>
ol: ({ children }: any) => <ol className="list-decimal pl-5 my-1.5 space-y-1">{children}</ol>, ),
li: ({ children }: any) => <li className="leading-snug">{children}</li>, ul: ({ children }: any) => (
h1: ({ children }: any) => <h1 className="text-sm font-bold mt-3 mb-1.5">{children}</h1>, <ul className="roundtable-chat-message list-disc pl-5 my-1.5 space-y-1">{children}</ul>
h2: ({ children }: any) => <h2 className="text-sm font-bold mt-3 mb-1.5">{children}</h2>, ),
h3: ({ children }: any) => <h3 className="text-xs font-bold mt-2 mb-1">{children}</h3>, ol: ({ children }: any) => (
h4: ({ children }: any) => <h4 className="text-xs font-bold mt-1.5 mb-1">{children}</h4>, <ol className="roundtable-chat-message list-decimal pl-5 my-1.5 space-y-1">{children}</ol>
strong: ({ children }: any) => <strong className="font-bold text-slate-900">{children}</strong>, ),
li: ({ children }: any) => <li className="leading-relaxed">{children}</li>,
h1: ({ children }: any) => (
<h1 className="text-lg font-bold mt-3 mb-1.5">{children}</h1>
),
h2: ({ children }: any) => (
<h2 className="text-base font-bold mt-3 mb-1.5">{children}</h2>
),
h3: ({ children }: any) => (
<h3 className="roundtable-chat-message font-bold mt-2 mb-1">{children}</h3>
),
h4: ({ children }: any) => (
<h4 className="roundtable-chat-message font-bold mt-1.5 mb-1">{children}</h4>
),
strong: ({ children }: any) => (
<strong className="font-bold text-slate-900">{children}</strong>
),
em: ({ children }: any) => <em className="italic">{children}</em>, em: ({ children }: any) => <em className="italic">{children}</em>,
code: ({ children, className }: any) => { code: ({ children, className }: any) => {
const isBlock = /language-/.test(className ?? ""); const isBlock = /language-/.test(className ?? "");
if (isBlock) { if (isBlock) {
return ( return (
<pre className="bg-slate-100 text-slate-800 rounded-md p-2 my-1 overflow-x-auto text-[11px] font-mono"> <pre className="roundtable-chat-message bg-slate-100 text-slate-800 rounded-md p-2 my-1 overflow-x-auto font-mono">
<code>{children}</code> <code>{children}</code>
</pre> </pre>
); );
} }
return ( return (
<code className="bg-slate-100 text-slate-800 rounded px-1 py-0.5 text-[11px] font-mono">{children}</code> <code className="roundtable-chat-message bg-slate-100 text-slate-800 rounded px-1 py-0.5 font-mono">
{children}
</code>
); );
}, },
blockquote: ({ children }: any) => ( blockquote: ({ children }: any) => (
<blockquote className="border-l-2 border-slate-300 pl-2 my-1 text-slate-600 italic">{children}</blockquote> <blockquote className="roundtable-chat-message border-l-2 border-slate-300 pl-2 my-1 text-slate-600 italic">
{children}
</blockquote>
), ),
a: ({ children, href }: any) => ( a: ({ children, href }: any) => (
<a href={href} target="_blank" rel="noopener noreferrer" className="text-primary underline hover:opacity-80"> <a
href={href}
target="_blank"
rel="noopener noreferrer"
className="text-primary underline hover:opacity-80"
>
{children} {children}
</a> </a>
), ),
table: ({ children }: any) => <table className="my-2 border-collapse text-[11px]">{children}</table>, table: ({ children }: any) => (
th: ({ children }: any) => ( <table className="roundtable-chat-message my-2 border-collapse">{children}</table>
<th className="border border-slate-300 px-1.5 py-0.5 bg-slate-50 font-bold text-left">{children}</th> ),
th: ({ children }: any) => (
<th className="border border-slate-300 px-1.5 py-0.5 bg-slate-50 font-bold text-left">
{children}
</th>
),
td: ({ children }: any) => (
<td className="border border-slate-200 px-1.5 py-0.5">{children}</td>
), ),
td: ({ children }: any) => <td className="border border-slate-200 px-1.5 py-0.5">{children}</td>,
hr: () => <hr className="my-2 border-slate-200" />, hr: () => <hr className="my-2 border-slate-200" />,
}; };
@@ -1528,17 +1528,17 @@ function HumanParticipationCard() {
<Activity className="w-4 h-4 text-primary" strokeWidth={2.5} /> <Activity className="w-4 h-4 text-primary" strokeWidth={2.5} />
<h2 className="text-xs font-bold text-slate-900 uppercase tracking-widest">人工参与</h2> <h2 className="text-xs font-bold text-slate-900 uppercase tracking-widest">人工参与</h2>
</div> </div>
<div className="flex items-center justify-between p-2 rounded-xl bg-slate-50 border border-slate-100"> <div className="flex min-h-[56px] items-center justify-between gap-3 rounded-xl border border-slate-100 bg-slate-50 p-3">
<div className="flex items-center gap-2.5"> <div className="flex min-w-0 items-center gap-3">
<Man1Avatar size="h-7 w-7" /> <Man1Avatar size="h-10 w-10" />
<span className="text-xs font-bold text-slate-800">用户</span> <span className="truncate text-sm font-bold leading-5 text-slate-800">用户</span>
</div> </div>
<div className="flex items-center gap-1.5"> <div className="flex shrink-0 items-center gap-1.5 rounded-full border border-white/70 bg-white/70 px-2 py-1">
<span className="flex h-1.5 w-1.5 relative"> <span className="flex h-1.5 w-1.5 relative">
<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-75"></span> <span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-emerald-400 opacity-75"></span>
<span className="relative inline-flex rounded-full h-1.5 w-1.5 bg-emerald-500"></span> <span className="relative inline-flex rounded-full h-1.5 w-1.5 bg-emerald-500"></span>
</span> </span>
<span className="text-[10px] font-bold text-emerald-600">在线</span> <span className="whitespace-nowrap text-xs font-bold leading-none text-emerald-600">在线</span>
</div> </div>
</div> </div>
</div> </div>
@@ -1808,7 +1808,7 @@ function RoleRow({
return ( return (
<div <div
id={`role-item-${role.id}`} id={`role-item-${role.id}`}
className={`flex items-center justify-between p-2 rounded-xl transition ${ className={`flex min-h-[60px] items-center justify-between gap-3 rounded-xl p-3 transition ${
isActive isActive
? "bg-slate-50 border border-slate-100" ? "bg-slate-50 border border-slate-100"
: isBootingUp : isBootingUp
@@ -1816,17 +1816,19 @@ function RoleRow({
: "opacity-60" : "opacity-60"
}`} }`}
> >
<div className="flex items-center gap-2.5"> <div className="flex min-w-0 items-center gap-3">
<RoleAvatarBadge role={role} agentNameToRole={agentNameToRole} /> <RoleAvatarBadge role={role} agentNameToRole={agentNameToRole} size="h-10 w-10" />
<div className="flex flex-col"> <div className="flex min-w-0 flex-col gap-0.5">
<span className="text-xs font-bold text-slate-800 tracking-tight">{role.name}</span> <span className="truncate text-sm font-bold leading-5 tracking-tight text-slate-800">
{role.name}
</span>
{role.type === "agent" && ( {role.type === "agent" && (
<span className="text-[9px] text-primary font-medium leading-none">AI 智能体</span> <span className="text-[11px] text-primary font-medium leading-4">AI 智能体</span>
)} )}
</div> </div>
</div> </div>
<div className="flex items-center gap-1.5 shrink-0"> <div className="flex shrink-0 items-center gap-1.5 rounded-full border border-white/70 bg-white/70 px-2 py-1">
{isOngoing ? ( {isOngoing ? (
<span className="flex h-1.5 w-1.5 relative"> <span className="flex h-1.5 w-1.5 relative">
<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-primary/60 opacity-75"></span> <span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-primary/60 opacity-75"></span>
@@ -1845,7 +1847,7 @@ function RoleRow({
<span className="h-1.5 w-1.5 rounded-full bg-slate-300" /> <span className="h-1.5 w-1.5 rounded-full bg-slate-300" />
)} )}
<span <span
className={`text-[10px] font-semibold ${ className={`whitespace-nowrap text-xs font-semibold leading-none ${
isOngoing isOngoing
? "text-[var(--brand-900)]" ? "text-[var(--brand-900)]"
: role.status === "在线" : role.status === "在线"
@@ -1908,23 +1910,26 @@ function RightSidebar({
<h2 className="text-xs font-bold text-slate-900 uppercase tracking-widest">澄清记录</h2> <h2 className="text-xs font-bold text-slate-900 uppercase tracking-widest">澄清记录</h2>
</div> </div>
<div className="flex-1 overflow-y-auto pr-1 space-y-4 font-normal custom-scrollbar"> <div className="flex-1 overflow-y-auto pr-1 font-normal custom-scrollbar">
<div className="relative pl-4 border-l border-red-50 space-y-4 ml-2 pt-1.5 pb-2"> <div className="relative ml-2 space-y-4 border-l border-red-50 pb-2 pl-4 pt-1.5">
{timelineEntries.map((entry) => ( {timelineEntries.map((entry) => (
<div key={entry.id} className="relative"> <div
<div className="absolute -left-[20.5px] top-0.5 h-3 w-3 rounded-full bg-primary border-2 border-white ring-2 ring-[var(--brand-200)]" /> key={entry.id}
<div className="space-y-0.5"> className="relative rounded-lg px-1.5 py-1 transition-colors hover:bg-slate-50/80"
<div className="flex items-center gap-2"> >
<span className="text-[10px] text-slate-400 font-mono tracking-tight shrink-0"> <div className="absolute -left-[20.5px] top-2 h-3 w-3 rounded-full bg-primary border-2 border-white ring-2 ring-[var(--brand-200)]" />
{entry.time} <div className="grid grid-cols-[68px_minmax(0,1fr)] gap-x-2">
</span> <span className="font-mono text-xs leading-5 tracking-tight text-slate-400">
<h4 className="text-[11.5px] font-bold text-slate-800 tracking-tight leading-none"> {entry.time}
</span>
<div className="min-w-0">
<h4 className="break-words text-sm font-bold leading-5 tracking-tight text-slate-800">
{entry.title} {entry.title}
</h4> </h4>
<p className="mt-1 break-words text-xs leading-5 text-slate-500">
{entry.desc}
</p>
</div> </div>
<p className="text-[11px] text-slate-500 leading-normal pl-0.5 mt-0.5 font-sans">
{entry.desc}
</p>
</div> </div>
</div> </div>
))} ))}
@@ -10,12 +10,13 @@
--rt-primary-active: var(--brand-950, #a8071a); --rt-primary-active: var(--brand-950, #a8071a);
--rt-primary-soft: var(--brand-200, #feeded); --rt-primary-soft: var(--brand-200, #feeded);
--rt-page-bg: #fef6f6; --rt-page-bg: #fef6f6;
/* 消息列表正文字号 —— 与右侧沙箱 CodeEditor / Markdown 预览的 text-sm 对齐 */ /* 圆桌全页最小可读字号(含 Step 3 方案展示 / 结果绘制) */
--roundtable-chat-font-size: var(--text-sm, 0.875rem); --roundtable-chat-font-size: 16px;
--roundtable-chat-meta-font-size: var(--text-xs, 0.75rem); --roundtable-chat-meta-font-size: 16px;
font-size: 16px;
} }
/* 会商对话区:气泡正文、步骤卡、Markdown 块统一继承 */ /* 会商对话区:气泡正文、步骤卡、Markdown 块 */
.roundtable-chat-message { .roundtable-chat-message {
font-size: var(--roundtable-chat-font-size); font-size: var(--roundtable-chat-font-size);
line-height: 1.625; line-height: 1.625;
@@ -23,6 +24,29 @@
.roundtable-chat-meta { .roundtable-chat-meta {
font-size: var(--roundtable-chat-meta-font-size); font-size: var(--roundtable-chat-meta-font-size);
line-height: 1.5;
}
/*
* 抬升页内显式写死的小字号类(text-xs / text-sm / text-[10–14px] / calc),
* 避免 Step 3、侧栏、按钮条等遗漏逐文件改 class。text-base 及以上标题保持不变。
*/
.roundtable-planning :where(.text-xs, .text-sm) {
font-size: 16px;
}
.roundtable-planning :where(
[class*="text-[9px"],
[class*="text-[10px"],
[class*="text-[10.5px"],
[class*="text-[11px"],
[class*="text-[11.5px"],
[class*="text-[12px"],
[class*="text-[13px"],
[class*="text-[14px"],
[class*="text-[calc"]
):not(.w-5) {
font-size: 16px;
} }
.roundtable-planning ::-webkit-scrollbar-thumb { .roundtable-planning ::-webkit-scrollbar-thumb {
+3 -2
View File
@@ -72,8 +72,9 @@
@theme { @theme {
--font-sans: --font-sans:
ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Noto Sans S Chinese", "Noto Sans SC", "Source Han Sans SC", "思源黑体",
"Segoe UI Symbol", "Noto Color Emoji"; "Microsoft YaHei", "PingFang SC", ui-sans-serif, system-ui, sans-serif,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--animate-fade-in: fade-in 1.1s; --animate-fade-in: fade-in 1.1s;
@keyframes fade-in { @keyframes fade-in {