feat(ui): 全站画布氛围层、侧栏 sticky 对齐与长页回顶
用顶栏/主栏高度令牌消除 sticky 首滚空走,面包屑叠到中栏上方,公开页增加回顶浮钮。 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -283,8 +283,11 @@ function BoardPanelsBody(props: BoardPanelsProps) {
|
||||
|
||||
export function BoardPanels(props: BoardPanelsProps) {
|
||||
return (
|
||||
<aside className="hidden w-[280px] shrink-0 lg:block xl:w-[300px]" aria-label="板块面板">
|
||||
<div className="sticky top-24 space-y-4">
|
||||
<aside
|
||||
className="hidden w-[280px] shrink-0 lg:block xl:w-[300px]"
|
||||
aria-label="板块面板"
|
||||
>
|
||||
<div className="space-y-4">
|
||||
<BoardPanelsBody {...props} />
|
||||
</div>
|
||||
</aside>
|
||||
@@ -302,18 +305,19 @@ export function BoardPanelsMobile(props: BoardPanelsProps) {
|
||||
/** 板块不存在时的简卡 */
|
||||
export function BoardMissingPanel() {
|
||||
return (
|
||||
<aside className="hidden w-[280px] shrink-0 lg:block xl:w-[300px]" aria-label="板块面板">
|
||||
<div className="sticky top-24">
|
||||
<section className="j13-module">
|
||||
<p className="j13-module-title mb-2">
|
||||
<LayoutGrid size={15} style={{ color: "var(--ink-3)" }} /> 板块
|
||||
</p>
|
||||
<p className="meta">板块不存在或已删除</p>
|
||||
<Link href="/" className="btn btn-line btn-sm mt-3 w-full justify-center">
|
||||
返回全部讨论
|
||||
</Link>
|
||||
</section>
|
||||
</div>
|
||||
<aside
|
||||
className="hidden w-[280px] shrink-0 lg:block xl:w-[300px]"
|
||||
aria-label="板块面板"
|
||||
>
|
||||
<section className="j13-module">
|
||||
<p className="j13-module-title mb-2">
|
||||
<LayoutGrid size={15} style={{ color: "var(--ink-3)" }} /> 板块
|
||||
</p>
|
||||
<p className="meta">板块不存在或已删除</p>
|
||||
<Link href="/" className="btn btn-line btn-sm mt-3 w-full justify-center">
|
||||
返回全部讨论
|
||||
</Link>
|
||||
</section>
|
||||
</aside>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -450,8 +450,11 @@ function CommunityPanelsBody({
|
||||
|
||||
export function CommunityPanels(props: PanelsProps) {
|
||||
return (
|
||||
<aside className="hidden w-[280px] shrink-0 lg:block xl:w-[300px]" aria-label="社区面板">
|
||||
<div className="sticky top-24 space-y-4">
|
||||
<aside
|
||||
className="hidden w-[280px] shrink-0 lg:block xl:w-[300px]"
|
||||
aria-label="社区面板"
|
||||
>
|
||||
<div className="space-y-4">
|
||||
<CommunityPanelsBody {...props} />
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
@@ -16,8 +16,12 @@ export function WorkspaceNav({ boards }: { boards: BoardWithCount[]; user?: User
|
||||
const activeBoard = Number(params.get("board")) || 0;
|
||||
|
||||
return (
|
||||
<nav className="hidden lg:block w-56 xl:w-60 shrink-0" aria-label="工作台导航">
|
||||
<div className="sticky top-24 space-y-5">
|
||||
// sticky 必须挂在 flex 子项上:父级 items-start 会把内层缩成内容高,失去粘滞行程
|
||||
<nav
|
||||
className="hidden lg:block w-56 xl:w-60 shrink-0 sticky top-[var(--rail-top)] max-h-[var(--rail-max-h)] j13-rail-scroll"
|
||||
aria-label="工作台导航"
|
||||
>
|
||||
<div className="space-y-5">
|
||||
{/* 「全部讨论」是重置筛选的动作入口,与板块目录分区展示;卡片样式与下方板块一致 */}
|
||||
<div className="space-y-0.5">
|
||||
<Link href="/" className="j13-bcard" aria-current={activeBoard === 0 ? "page" : undefined}>
|
||||
|
||||
Reference in New Issue
Block a user