gitea/dalcode-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

checkpoint: before i18n implementation

Browse Source
This commit is contained in:
Leon-in
2026-04-29 00:29:14 +08:00
parent ded6c67a36
commit 437dc976fb
41 changed files with 2167 additions and 1855 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/Header.tsx
+19 -41
View File
@@ -5,13 +5,7 @@ import Image from "next/image"
import Link from "next/link"
import { usePathname } from "next/navigation"
import ThemeToggle from "@/components/ThemeToggle"
const NAV_LINKS = [
{ href: "/", label: "Home" },
{ href: "/about", label: "About" },
{ href: "/blog", label: "Blog" },
{ href: "/contact", label: "Contact" },
]
import { NAV_GROUPS, NAV_LINKS } from "@/lib/site-content"
function ChevronIcon() {
return (
@@ -34,6 +28,10 @@ export default function Header() {
const [dropdownOpen, setDropdownOpen] = useState(false)
const [scrolled, setScrolled] = useState(false)
const pathname = usePathname()
const closeMenus = useCallback(() => {
setMobileOpen(false)
setDropdownOpen(false)
}, [])
useEffect(() => {
const onScroll = () => setScrolled(window.scrollY > 20)
@@ -41,11 +39,6 @@ export default function Header() {
return () => window.removeEventListener("scroll", onScroll)
}, [])
useEffect(() => {
setMobileOpen(false)
setDropdownOpen(false)
}, [pathname])
const toggleMobile = useCallback(() => setMobileOpen((v) => !v), [])
return (
@@ -82,6 +75,7 @@ export default function Header() {
<Link
href={href}
className={`link w-inline-block ${pathname === href ? "w--current" : ""}`}
onClick={closeMenus}
>
<div className="link-icon-wrapper">
<div className="link-icon">
@@ -104,7 +98,7 @@ export default function Header() {
aria-expanded={dropdownOpen}
type="button"
>
<div>Pages</div>
<div>Explore</div>
<div className="dropdown-icon">
<DropdownIcon />
</div>
@@ -113,28 +107,12 @@ export default function Header() {
<nav className="dropdown-content-wrapper w-dropdown-list w--open">
<div className="card header-dropdown-card">
<div className="w-layout-grid header-dropdown-grid">
<div>
<div className="dropdown-title">Main pages</div>
<div className="w-layout-grid main-pages-grid">
{NAV_GROUPS.map((group) => (
<div key={group.title}>
<div className="dropdown-title">{group.title}</div>
<div className="w-layout-grid pages-column">
{[
{ href: "/", label: "Home" },
{ href: "/about", label: "About" },
{ href: "/contact", label: "Contact" },
].map(({ href, label }) => (
<Link key={href} href={href} className="link w-inline-block">
<div className="link-icon-wrapper">
<div className="link-icon"><ChevronIcon /></div>
</div>
<div className="link-text">{label}</div>
</Link>
))}
</div>
<div className="w-layout-grid pages-column">
{[
{ href: "/blog", label: "Blog" },
].map(({ href, label }) => (
<Link key={href} href={href} className="link w-inline-block">
{group.links.map(({ href, label }) => (
<Link key={href} href={href} className="link w-inline-block" onClick={closeMenus}>
<div className="link-icon-wrapper">
<div className="link-icon"><ChevronIcon /></div>
</div>
@@ -143,7 +121,7 @@ export default function Header() {
))}
</div>
</div>
</div>
))}
</div>
</div>
</nav>
@@ -151,9 +129,9 @@ export default function Header() {
</div>
</li>
<li className="link-nav-item mbl-button">
<Link href="/contact" className="primary-button w-inline-block">
<Link href="/contact" className="primary-button w-inline-block" onClick={closeMenus}>
<div className="button-content">
<div>Join our team</div>
<div>申请试用</div>
<div className="button-icon-wrapper primary">
<ChevronIcon />
<div className="button-icon-bg" />
@@ -166,9 +144,9 @@ export default function Header() {
</nav>
<div className="hidden-on-mobile-landscape">
<div className="show-light-mode">
<Link href="/contact" className="primary-button w-inline-block">
<Link href="/contact" className="primary-button w-inline-block" onClick={closeMenus}>
<div className="button-content">
<div>Join our team</div>
<div>申请试用</div>
<div className="button-icon-wrapper primary">
<ChevronIcon />
<div className="button-icon-bg" />
@@ -178,9 +156,9 @@ export default function Header() {
</Link>
</div>
<div className="show-dark-mode">
<Link href="/contact" className="secondary-button w-inline-block">
<Link href="/contact" className="secondary-button w-inline-block" onClick={closeMenus}>
<div className="button-content">
<div>Join our team</div>
<div>申请试用</div>
<div className="button-icon-wrapper secondary">
<ChevronIcon />
<div className="button-icon-bg bg-neutral-800" />