dev.2ha.me/lixiyu-net
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

upgrade the project

Browse Source
This commit is contained in:
PrinOrange
2024-04-03 22:08:27 +08:00
parent a615511139
commit ea3597d62f
313 changed files with 10677 additions and 7069 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
components/utils/NavBar.tsx
View File

@@ -1,6 +1,5 @@
import { Sheet, SheetContent, SheetTrigger } from "@/components/ui/sheet";
import { Config } from "@/data/config";
import { fontFangZhengXiaoBiaoSongCN } from "@/styles/font";
import { nanoid } from "nanoid";
import { useTheme } from "next-themes";
import Link from "next/link";
@@ -32,40 +31,43 @@ export const NavBar = () => {
};
return (
<Sheet open={isSideNavOpen} onOpenChange={(open) => setIsSideNavOpen(open)}>
<div className="sticky top-0 z-50 border-gray-200 dark:border-gray-700 border-b flex flex-wrap justify-between py-3 backdrop-blur bg-white/50 dark:bg-gray-950/50 px-5 md:px-10 lg:px-20 xl:px-32 2xl:px-52">
<Link href="/" className="cursor-pointer my-auto text-2xl font-bold">
<h1 className={`${fontFangZhengXiaoBiaoSongCN.className} my-auto`}>{Config.SiteTitle}</h1>
<Sheet onOpenChange={(open) => setIsSideNavOpen(open)} open={isSideNavOpen}>
<div className="sticky top-0 z-50 border-black-200 dark:border-gray-700 border-b bg-white dark:bg-gray-950 flex flex-wrap justify-between py-3 px-5 md:px-10 lg:px-20 xl:px-32 2xl:px-52">
<Link className="cursor-pointer my-auto text-2xl font-bold" href="/">
<h1 className={`font-fang-zheng-xiao-biao-song my-auto`} title="Click to jump to home page.">
{Config.SiteTitle}
</h1>
</Link>
<div className="my-auto hidden sm:flex">
{MenuItems.map((menuItem) => (
<Link
className="font-bold hover:text-sky-700 dark:hover:text-sky-500 mx-2 my-auto px-2"
href={menuItem.href}
key={nanoid()}
className="border-b-sky-600 font-bold hover:text-sky-600 dark:hover:border-b-sky-500 dark:hover:text-sky-500 mx-2 my-auto px-2"
onClick={() => setIsSideNavOpen(false)}
>
{menuItem.title}
</Link>
))}
<Link
href={"/search"}
className="cursor-pointer mx-2 rounded-full p-1 text-3xl text-black hover:bg-gray-200 dark:text-gray-50 dark:hover:bg-gray-800"
href={"/search"}
title="Search posts by keywords"
>
<MdSearch />
</Link>
<div
title={theme === "light" ? "Switch to dark mode" : "Switch to light mode"}
className="cursor-pointer mx-1 rounded-full p-1 text-3xl text-black hover:bg-gray-200 dark:text-gray-50 dark:hover:bg-gray-800"
onClick={handleSwitchTheme}
title={theme === "light" ? "Switch to dark mode" : "Switch to light mode"}
>
{theme === "light" ? <MdOutlineDarkMode /> : <MdOutlineLightMode />}
</div>
</div>
<div className="text-3xl sm:hidden my-auto">
<SheetTrigger
title="Spread the navigation menu"
className="text-black rounded-full p-1 hover:bg-gray-200 dark:text-gray-50 dark:hover:bg-gray-800"
title="Spread the navigation menu"
>
<MdMenu
onClick={() => {
@@ -78,19 +80,19 @@ export const NavBar = () => {
<SheetContent className="bg:white border-none py-16 shadow-md dark:bg-black flex flex-col text-end">
{MenuItems.map((menuItem) => (
<Link
className="border-b border-dashed p-3 text-xl hover:text-sky-500"
href={menuItem.href}
key={nanoid()}
className="border-b border-dashed p-3 text-xl hover:text-sky-500"
onClick={() => setIsSideNavOpen(false)}
>
{menuItem.title}
</Link>
))}
<Link
title="Search the posts"
className="border-b border-dashed p-3 text-xl hover:text-sky-500"
href="/search"
onClick={() => setIsSideNavOpen(false)}
title="Search the posts"
>
{"SEARCH"}
</Link>
@@ -99,8 +101,8 @@ export const NavBar = () => {
onClick={handleSwitchTheme}
>
<div
title={theme === "light" ? "Switch to dark mode" : "Switch to light mode"}
className="cursor-pointer mx-1 my-auto rounded-full text-2xl"
title={theme === "light" ? "Switch to dark mode" : "Switch to light mode"}
>
{theme === "light" ? <MdOutlineDarkMode /> : <MdOutlineLightMode />}
</div>