Skip to content

Commit e87f79f

Browse files
committed
style(secondary-nav): 二级导航统一改为水平居中,主导航保持靠右不变;
- 将 5 个模块二级导航(KnowledgeNav / InterfaceNav / MemoryNav / HomeNav / AdminNav)的外层 flex 容器由 justify-end 调整为 justify-center,使胶囊样导航整体水平居中; - 同步更新 KnowledgeNav 视觉不变量单测,断言 className 包含 justify-center 且同时排除 justify-end / justify-between,防止误回退; - 主导航 MainNav(SiteHeader 内)继续通过 justify-between 实现靠右,不动。 🤖 Generated with [Claude Code](https://github.com/claude), [CodeX](https://openai.com), [Gemini](https://github.com/apps/gemini-code-assist) Co-Authored-By: Aurelius Huang<threefish.ai@gmail.com>
1 parent 7b270eb commit e87f79f

6 files changed

Lines changed: 10 additions & 9 deletions

File tree

apps/negentropy-ui/components/ui/AdminNav.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export function AdminNav({
3131

3232
return (
3333
<div className="border-b border-border bg-card px-6 py-1">
34-
<div className="flex flex-wrap items-center justify-end gap-4">
34+
<div className="flex flex-wrap items-center justify-center gap-4">
3535
<nav className="flex flex-wrap items-center gap-1 bg-muted/50 p-1 rounded-full">
3636
{NAV_ITEMS.map((item) => (
3737
<Link

apps/negentropy-ui/components/ui/HomeNav.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export function HomeNav({ title }: { title: string }) {
3838

3939
return (
4040
<div className="border-b border-border bg-card px-6 py-1">
41-
<div className="flex flex-wrap items-center justify-end gap-4">
41+
<div className="flex flex-wrap items-center justify-center gap-4">
4242
<nav className="flex items-center gap-1 bg-muted/50 p-1 rounded-full">
4343
{NAV_ITEMS.map((item) => {
4444
const href = item.key === "studio" ? studioHref : item.href;

apps/negentropy-ui/components/ui/InterfaceNav.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ export function InterfaceNav({
4444

4545
return (
4646
<div className="border-b border-border bg-card px-6 py-1">
47-
<div className="flex flex-wrap items-center justify-end gap-4">
47+
<div className="flex flex-wrap items-center justify-center gap-4">
4848
<nav className="flex flex-wrap items-center gap-1 bg-muted/50 p-1 rounded-full">
4949
{visibleItems.map((item) => (
5050
<Link

apps/negentropy-ui/components/ui/KnowledgeNav.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ export function KnowledgeNav({
3737

3838
return (
3939
<div className="border-b border-border bg-card px-6 py-1">
40-
<div className="flex flex-wrap items-center justify-end gap-4">
40+
<div className="flex flex-wrap items-center justify-center gap-4">
4141
{modeToggle}
4242
<nav className="flex items-center gap-1 bg-muted/50 p-1 rounded-full">
4343
{NAV_ITEMS.map((item) => {

apps/negentropy-ui/components/ui/MemoryNav.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ export function MemoryNav({
3636

3737
return (
3838
<div className="border-b border-border bg-card px-6 py-1">
39-
<div className="flex flex-wrap items-center justify-end gap-4">
39+
<div className="flex flex-wrap items-center justify-center gap-4">
4040
<nav className="flex items-center gap-1 bg-muted/50 p-1 rounded-full">
4141
{NAV_ITEMS.map((item) => (
4242
<Link

apps/negentropy-ui/tests/unit/ui/KnowledgeNav.test.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -26,17 +26,18 @@ describe("KnowledgeNav", () => {
2626
expect(baseLink).toHaveAttribute("href", "/knowledge/base");
2727
});
2828

29-
// 视觉不变量:与 HomeNav/MemoryNav/InterfaceNav/AdminNav 保持二级导航靠右对齐
30-
it("二级导航容器使用 justify-end,整体右对齐", () => {
29+
// 视觉不变量:与 HomeNav/MemoryNav/InterfaceNav/AdminNav 保持二级导航水平居中
30+
it("二级导航容器使用 justify-center,整体水平居中", () => {
3131
const { container } = render(<KnowledgeNav title="Pipelines" />);
3232
const nav = container.querySelector("nav") as HTMLElement;
3333
const flexRow = nav.parentElement as HTMLElement;
3434

35-
expect(flexRow.className).toContain("justify-end");
35+
expect(flexRow.className).toContain("justify-center");
36+
expect(flexRow.className).not.toContain("justify-end");
3637
expect(flexRow.className).not.toContain("justify-between");
3738
});
3839

39-
it("传入 modeToggle 时,渲染顺序为 modeToggle 在 nav 之前(确保 nav 始终贴最右边缘)", () => {
40+
it("传入 modeToggle 时,渲染顺序为 modeToggle 在 nav 之前(确保 modeToggle 与 nav 顺序稳定)", () => {
4041
const { container } = render(
4142
<KnowledgeNav title="Wiki" modeToggle={<div data-testid="mt">toggle</div>} />,
4243
);

0 commit comments

Comments
 (0)