Support ultrawide layout with equal columns and taiji branding.
Use 50/50 mode workspace columns, widen content to 1920px on fish screens, replace header logo with taiji icon, and add full-page taiji backdrop. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -1,8 +1,9 @@
|
||||
"use client";
|
||||
import Link from "next/link";
|
||||
import { usePathname } from "next/navigation";
|
||||
import { ChatGPT } from "@/components/svg";
|
||||
import { TaijiIcon } from "@/components/svg/taiji";
|
||||
import { ModeToggle } from "@/components/mode-toggle";
|
||||
import { APP_CONTAINER } from "@/lib/layout";
|
||||
|
||||
const NAV_ITEMS = [
|
||||
{ href: "/learn", label: "易经学习" },
|
||||
@@ -34,11 +35,11 @@ function NavLink({ href, label }: { href: string; label: string }) {
|
||||
|
||||
export default function Header() {
|
||||
return (
|
||||
<header className="border-b border-border/40 bg-card/60 py-3 shadow-sm backdrop-blur-md">
|
||||
<div className="mx-auto flex w-full max-w-6xl flex-col gap-2 px-4 sm:flex-row sm:items-center sm:justify-between">
|
||||
<header className="relative z-10 border-b border-border/40 bg-card/70 py-3 shadow-sm backdrop-blur-md">
|
||||
<div className={`${APP_CONTAINER} flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between`}>
|
||||
<Link href="/" className="flex items-center justify-center gap-2 sm:justify-start">
|
||||
<ChatGPT />
|
||||
<span className="font-medium">知命阁</span>
|
||||
<TaijiIcon />
|
||||
<span className="font-medium tracking-wide">知命阁</span>
|
||||
</Link>
|
||||
<nav className="flex flex-wrap items-center justify-center gap-x-4 gap-y-1">
|
||||
{NAV_ITEMS.map((item) => (
|
||||
|
||||
Reference in New Issue
Block a user