feat(ui): 全站画布氛围层、侧栏 sticky 对齐与长页回顶

用顶栏/主栏高度令牌消除 sticky 首滚空走,面包屑叠到中栏上方,公开页增加回顶浮钮。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-09-18 00:28:25 +08:00
parent 0b60c4299b
commit 1535577eac
21 changed files with 286 additions and 111 deletions

View File

@@ -4,6 +4,7 @@ import { useEffect, useLayoutEffect, useRef, useState } from "react";
import { usePathname } from "next/navigation";
import Header from "@/components/Header";
import Footer from "@/components/Footer";
import BackToTop from "@/components/BackToTop";
import type { User } from "@/lib/api";
function pathIsAdmin(pathname: string | null) {
@@ -11,6 +12,17 @@ function pathIsAdmin(pathname: string | null) {
return pathname === "/admin" || pathname.startsWith("/admin/");
}
function pathIsChat(pathname: string | null) {
if (!pathname) return false;
return pathname === "/chat" || pathname.startsWith("/chat/");
}
/** 帖子详情(非 edit)移动端有底栏,回顶需抬高 */
function pathIsPostDetail(pathname: string | null) {
if (!pathname) return false;
return /^\/post\/[^/]+$/.test(pathname);
}
/**
* 公开站 chrome 闸门:/admin 不渲染 Header/Footer/1440 main。
* 首屏用 middleware 的 x-pathname 初值保证 hydration 一致;
@@ -63,6 +75,9 @@ export default function SiteChrome({
return <>{children}</>;
}
// 聊天页锁视口、主滚动在对话区,窗口回顶无意义
const showBackToTop = !pathIsChat(pathname);
return (
<>
<Header
@@ -76,11 +91,14 @@ export default function SiteChrome({
<main
id="main"
tabIndex={-1}
className="flex-1 w-full max-w-[1440px] mx-auto px-4 sm:px-6 py-7 sm:py-9 outline-none"
className="flex-1 w-full max-w-[1440px] mx-auto px-4 sm:px-6 py-7 sm:py-[var(--main-pad-y)] outline-none"
>
{children}
</main>
<Footer siteName={siteName} />
{showBackToTop ? (
<BackToTop liftForMobileBar={pathIsPostDetail(pathname)} />
) : null}
</>
);
}