feat(ux): M1/M2 移动端可用 — 导航汉堡抽屉 + 写作工具条不溢出
M1 左导航响应式抽屉:抽出 lib/nav/items.ts(条目数据+激活判定,纯逻辑+vitest) 共用于桌面静态侧栏(hidden lg:block)与移动汉堡抽屉。新增通用 Drawer(遮罩/ Esc 关闭/打开聚焦,复用 CommandPalette a11y 模式)+ NavDrawer + NavItems; LeftNav 改 <lg 隐藏,AppShell 顶栏加汉堡(aria-label 打开导航)。 M2 写作工具条不溢出 + 移动端可达章节/助手:Toolbar 改 flex-wrap,390px 不再 横切「尚未保存」;ChapterList/ChapterAssistant 抽出 *Content,Workbench 经 左/右 Drawer 在 <lg 触达目录/助手。 实景 390px 复验(browse):汉堡显示/静态导航隐藏/抽屉开合聚焦+Esc、工具条 两行不溢出、助手抽屉真注入面板。门禁:lint/typecheck 干净 · vitest 177 · build OK。
This commit is contained in:
@@ -17,15 +17,27 @@ interface ChapterAssistantProps {
|
||||
// 右栏「本章助手」(UX §6.3)。
|
||||
// 「本章注入(透明)」读 B0 端点,列出确定性选中的设定/角色 + 入选理由徽标——
|
||||
// 这是「看到的=写章用的」的信任牌(不变量 #6)。「四审」指向审稿页入口。
|
||||
// 桌面 aside 包裹;移动端经 Workbench 抽屉复用 AssistantContent。
|
||||
export function ChapterAssistant({
|
||||
projectId,
|
||||
chapterNo,
|
||||
}: ChapterAssistantProps) {
|
||||
return (
|
||||
<aside className="hidden border-l border-line bg-panel py-4 lg:block">
|
||||
<AssistantContent projectId={projectId} chapterNo={chapterNo} />
|
||||
</aside>
|
||||
);
|
||||
}
|
||||
|
||||
export function AssistantContent({
|
||||
projectId,
|
||||
chapterNo,
|
||||
}: ChapterAssistantProps) {
|
||||
const injection = useInjection(projectId, chapterNo);
|
||||
const selected = injection.data?.selected ?? [];
|
||||
|
||||
return (
|
||||
<aside className="hidden border-l border-line bg-panel p-4 lg:block">
|
||||
<div className="px-4">
|
||||
<h2 className="text-sm font-semibold text-ink">本章助手</h2>
|
||||
|
||||
<section className="mt-4">
|
||||
@@ -66,7 +78,7 @@ export function ChapterAssistant({
|
||||
去审稿 →
|
||||
</Link>
|
||||
</section>
|
||||
</aside>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user