terry/Arkie-Library-Frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: lower desktop header breakpoint

Browse Source
This commit is contained in:
TerryM
2026-05-31 03:04:27 +08:00
parent 6b3211f26f
commit 92a8a83585
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/layouts/PublicLayout.tsx
View File

@@ -537,7 +537,7 @@ export function PublicLayout() {
<div className="mx-auto hidden max-w-[1280px] px-4 py-[15px] min-[440px]:px-5 sm:px-6 md:block md:px-9 xl:px-0">
{/* Single row (md+): logo | scrollable nav (左對齊，可橫向滑動) | 搜尋 + 語言 */}
<div className="flex h-10 items-center gap-2 min-[1200px]:gap-0 lg:gap-4">
<div className="flex h-10 items-center gap-2 min-[1100px]:gap-0 lg:gap-4">
<div className="flex min-w-0 shrink items-center gap-2.5 text-xl font-bold tracking-wide text-ark-gold">
{/* Logo → home; page-name text → scroll to top of the current page. */}
<Link
@@ -563,7 +563,7 @@ export function PublicLayout() {
</div>
<nav
className="header-nav-scroll hidden min-w-0 flex-1 items-center justify-center gap-4 overflow-x-auto overflow-y-hidden py-0.5 min-[1200px]:flex lg:gap-5"
className="header-nav-scroll hidden min-w-0 flex-1 items-center justify-center gap-4 overflow-x-auto overflow-y-hidden py-0.5 min-[1100px]:flex lg:gap-5"
aria-label={t("mainNav")}
>
<Link
@@ -610,10 +610,10 @@ export function PublicLayout() {
</Link>
</nav>
<div className="flex min-w-0 flex-1 items-center justify-end gap-2 min-[1200px]:flex-none">
<div className="flex min-w-0 flex-1 items-center justify-end gap-2 min-[1100px]:flex-none">
<div
ref={desktopSearchRef}
className="hidden h-10 min-w-0 flex-1 items-center gap-2 rounded-full border border-ark-line bg-[#1a1b20] py-2 pl-3 pr-3 shadow-inner md:flex min-[1200px]:w-44 min-[1200px]:flex-none lg:pr-4 xl:w-52"
className="hidden h-10 min-w-0 flex-1 items-center gap-2 rounded-full border border-ark-line bg-[#1a1b20] py-2 pl-3 pr-3 shadow-inner md:flex min-[1100px]:w-44 min-[1100px]:flex-none lg:pr-4 xl:w-52"
>
<button
type="button"
@@ -645,7 +645,7 @@ export function PublicLayout() {
<button
ref={desktopMenuButtonRef}
type="button"
className="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-full border border-ark-line bg-[#1a1b20] text-neutral-200 outline-none focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg min-[1200px]:hidden"
className="inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-full border border-ark-line bg-[#1a1b20] text-neutral-200 outline-none focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg min-[1100px]:hidden"
onClick={() => {
setDesktopSearchOpen(false);
setOpen((v) => !v);
@@ -661,7 +661,7 @@ export function PublicLayout() {
{open ? (
<div
ref={menuRef}
className={`${headerMenuAnimationClass} fixed inset-x-0 top-[64px] z-50 grid gap-2 bg-[#08070c] px-4 py-3 shadow-2xl shadow-black/50 min-[440px]:px-5 sm:px-6 md:top-[70px] md:px-9 min-[1200px]:hidden`}
className={`${headerMenuAnimationClass} fixed inset-x-0 top-[64px] z-50 grid gap-2 bg-[#08070c] px-4 py-3 shadow-2xl shadow-black/50 min-[440px]:px-5 sm:px-6 md:top-[70px] md:px-9 min-[1100px]:hidden`}
>
<Link
to="/browse"