字体大小修改
This commit is contained in:
fengxiangdebaozi committed
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>
|
||||
),
|
||||
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 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 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 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 className="font-bold text-slate-900">{children}</strong>
|
||||
|
||||
@@ -1,44 +1,75 @@
|
||||
/**
|
||||
* 圆桌 Step 3 报告里 `react-markdown` 的紧凑渲染组件集（小字号、卡片内排版）。
|
||||
* 圆桌 Step 3 报告里 `react-markdown` 的渲染组件集（卡片内排版）。
|
||||
* 抽到独立文件供 `HighFidelityReport` 与 `Step3ReportMode` 共用，避免两者互相 import
|
||||
* 形成循环依赖。
|
||||
*/
|
||||
export const markdownComponents = {
|
||||
p: ({ children }: any) => <p className="my-1.5 whitespace-pre-wrap leading-relaxed">{children}</p>,
|
||||
ul: ({ children }: any) => <ul className="list-disc pl-5 my-1.5 space-y-1">{children}</ul>,
|
||||
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>,
|
||||
h1: ({ children }: any) => <h1 className="text-sm font-bold mt-3 mb-1.5">{children}</h1>,
|
||||
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>,
|
||||
h4: ({ children }: any) => <h4 className="text-xs font-bold mt-1.5 mb-1">{children}</h4>,
|
||||
strong: ({ children }: any) => <strong className="font-bold text-slate-900">{children}</strong>,
|
||||
p: ({ children }: any) => (
|
||||
<p className="roundtable-chat-message my-1.5 whitespace-pre-wrap">{children}</p>
|
||||
),
|
||||
ul: ({ children }: any) => (
|
||||
<ul className="roundtable-chat-message list-disc pl-5 my-1.5 space-y-1">{children}</ul>
|
||||
),
|
||||
ol: ({ children }: any) => (
|
||||
<ol className="roundtable-chat-message list-decimal pl-5 my-1.5 space-y-1">{children}</ol>
|
||||
),
|
||||
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>,
|
||||
code: ({ children, className }: any) => {
|
||||
const isBlock = /language-/.test(className ?? "");
|
||||
if (isBlock) {
|
||||
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>
|
||||
</pre>
|
||||
);
|
||||
}
|
||||
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 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 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}
|
||||
</a>
|
||||
),
|
||||
table: ({ children }: any) => <table className="my-2 border-collapse text-[11px]">{children}</table>,
|
||||
th: ({ children }: any) => (
|
||||
<th className="border border-slate-300 px-1.5 py-0.5 bg-slate-50 font-bold text-left">{children}</th>
|
||||
table: ({ children }: any) => (
|
||||
<table className="roundtable-chat-message my-2 border-collapse">{children}</table>
|
||||
),
|
||||
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" />,
|
||||
};
|
||||
@@ -1528,17 +1528,17 @@ function HumanParticipationCard() {
|
||||
<Activity className="w-4 h-4 text-primary" strokeWidth={2.5} />
|
||||
<h2 className="text-xs font-bold text-slate-900 uppercase tracking-widest">人工参与</h2>
|
||||
</div>
|
||||
<div className="flex items-center justify-between p-2 rounded-xl bg-slate-50 border border-slate-100">
|
||||
<div className="flex items-center gap-2.5">
|
||||
<Man1Avatar size="h-7 w-7" />
|
||||
<span className="text-xs font-bold text-slate-800">用户</span>
|
||||
<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 min-w-0 items-center gap-3">
|
||||
<Man1Avatar size="h-10 w-10" />
|
||||
<span className="truncate text-sm font-bold leading-5 text-slate-800">用户</span>
|
||||
</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="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>
|
||||
<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>
|
||||
@@ -1808,7 +1808,7 @@ function RoleRow({
|
||||
return (
|
||||
<div
|
||||
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
|
||||
? "bg-slate-50 border border-slate-100"
|
||||
: isBootingUp
|
||||
@@ -1816,17 +1816,19 @@ function RoleRow({
|
||||
: "opacity-60"
|
||||
}`}
|
||||
>
|
||||
<div className="flex items-center gap-2.5">
|
||||
<RoleAvatarBadge role={role} agentNameToRole={agentNameToRole} />
|
||||
<div className="flex flex-col">
|
||||
<span className="text-xs font-bold text-slate-800 tracking-tight">{role.name}</span>
|
||||
<div className="flex min-w-0 items-center gap-3">
|
||||
<RoleAvatarBadge role={role} agentNameToRole={agentNameToRole} size="h-10 w-10" />
|
||||
<div className="flex min-w-0 flex-col gap-0.5">
|
||||
<span className="truncate text-sm font-bold leading-5 tracking-tight text-slate-800">
|
||||
{role.name}
|
||||
</span>
|
||||
{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 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 ? (
|
||||
<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>
|
||||
@@ -1845,7 +1847,7 @@ function RoleRow({
|
||||
<span className="h-1.5 w-1.5 rounded-full bg-slate-300" />
|
||||
)}
|
||||
<span
|
||||
className={`text-[10px] font-semibold ${
|
||||
className={`whitespace-nowrap text-xs font-semibold leading-none ${
|
||||
isOngoing
|
||||
? "text-[var(--brand-900)]"
|
||||
: role.status === "在线"
|
||||
@@ -1908,23 +1910,26 @@ function RightSidebar({
|
||||
<h2 className="text-xs font-bold text-slate-900 uppercase tracking-widest">澄清记录</h2>
|
||||
</div>
|
||||
|
||||
<div className="flex-1 overflow-y-auto pr-1 space-y-4 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="flex-1 overflow-y-auto pr-1 font-normal custom-scrollbar">
|
||||
<div className="relative ml-2 space-y-4 border-l border-red-50 pb-2 pl-4 pt-1.5">
|
||||
{timelineEntries.map((entry) => (
|
||||
<div key={entry.id} className="relative">
|
||||
<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)]" />
|
||||
<div className="space-y-0.5">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-[10px] text-slate-400 font-mono tracking-tight shrink-0">
|
||||
{entry.time}
|
||||
</span>
|
||||
<h4 className="text-[11.5px] font-bold text-slate-800 tracking-tight leading-none">
|
||||
<div
|
||||
key={entry.id}
|
||||
className="relative rounded-lg px-1.5 py-1 transition-colors hover:bg-slate-50/80"
|
||||
>
|
||||
<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)]" />
|
||||
<div className="grid grid-cols-[68px_minmax(0,1fr)] gap-x-2">
|
||||
<span className="font-mono text-xs leading-5 tracking-tight text-slate-400">
|
||||
{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}
|
||||
</h4>
|
||||
<p className="mt-1 break-words text-xs leading-5 text-slate-500">
|
||||
{entry.desc}
|
||||
</p>
|
||||
</div>
|
||||
<p className="text-[11px] text-slate-500 leading-normal pl-0.5 mt-0.5 font-sans">
|
||||
{entry.desc}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
|
||||
@@ -10,12 +10,13 @@
|
||||
--rt-primary-active: var(--brand-950, #a8071a);
|
||||
--rt-primary-soft: var(--brand-200, #feeded);
|
||||
--rt-page-bg: #fef6f6;
|
||||
/* 消息列表正文字号 —— 与右侧沙箱 CodeEditor / Markdown 预览的 text-sm 对齐 */
|
||||
--roundtable-chat-font-size: var(--text-sm, 0.875rem);
|
||||
--roundtable-chat-meta-font-size: var(--text-xs, 0.75rem);
|
||||
/* 圆桌全页最小可读字号（含 Step 3 方案展示 / 结果绘制） */
|
||||
--roundtable-chat-font-size: 16px;
|
||||
--roundtable-chat-meta-font-size: 16px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* 会商对话区：气泡正文、步骤卡、Markdown 块统一继承 */
|
||||
/* 会商对话区：气泡正文、步骤卡、Markdown 块 */
|
||||
.roundtable-chat-message {
|
||||
font-size: var(--roundtable-chat-font-size);
|
||||
line-height: 1.625;
|
||||
@@ -23,6 +24,29 @@
|
||||
|
||||
.roundtable-chat-meta {
|
||||
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 {
|
||||
|
||||
@@ -72,8 +72,9 @@
|
||||
|
||||
@theme {
|
||||
--font-sans:
|
||||
ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
|
||||
"Segoe UI Symbol", "Noto Color Emoji";
|
||||
"Noto Sans S Chinese", "Noto Sans SC", "Source Han Sans SC", "思源黑体",
|
||||
"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;
|
||||
@keyframes fade-in {
|
||||
|
||||
Reference in new issue
Block a user