[update] migrate the project formatter from prettier and eslint to biome
This commit is contained in:
@@ -31,7 +31,9 @@ export const Footer = () => {
|
||||
</Link>
|
||||
{Config.RSSFeed?.enabled && (
|
||||
<DialogTrigger asChild>
|
||||
<button title="Subscribe the RSS Feed.">{"Feed"}</button>
|
||||
<button title="Subscribe the RSS Feed." type="button">
|
||||
{"Feed"}
|
||||
</button>
|
||||
</DialogTrigger>
|
||||
)}
|
||||
</div>
|
||||
@@ -39,20 +41,20 @@ export const Footer = () => {
|
||||
<DialogContent className="sm:max-w-md">
|
||||
<DialogHeader>
|
||||
<DialogTitle className="flex">
|
||||
<IoLogoRss className="mr-2 my-auto" />
|
||||
<IoLogoRss className="my-auto mr-2" />
|
||||
{"RSS Feed"}
|
||||
</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<div>
|
||||
<div className="w-full text-sm my-2">
|
||||
<div className="my-2 w-full text-sm">
|
||||
<div>
|
||||
<b>NOTE: </b>Some RSS Feed Reader may has deficient in rendering SVG formulations, graphs. Such as the
|
||||
Inoreader, Feedly. If it happens, please read the origin web page for better experience.
|
||||
</div>
|
||||
</div>
|
||||
<Separator />
|
||||
<div className="w-full flex my-3">
|
||||
<div className="my-3 flex w-full">
|
||||
<Input defaultValue={RSSFeedURL} readOnly />
|
||||
<CopyToClipboard
|
||||
onCopy={() => {
|
||||
@@ -61,7 +63,7 @@ export const Footer = () => {
|
||||
text={RSSFeedURL}
|
||||
>
|
||||
<Button
|
||||
className={`ml-3 my-auto ${isCopied && "bg-green-500 hover:bg-green-500"}`}
|
||||
className={`my-auto ml-3 ${isCopied && "bg-green-500 hover:bg-green-500"}`}
|
||||
size="sm"
|
||||
type="submit"
|
||||
>
|
||||
|
||||
@@ -32,16 +32,16 @@ export const NavBar = () => {
|
||||
|
||||
return (
|
||||
<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={`website-title-font my-auto`} title="Click to jump to home page.">
|
||||
<div className="sticky top-0 z-50 flex flex-wrap justify-between border-black-200 border-b bg-white px-5 py-3 md:px-10 lg:px-20 xl:px-32 2xl:px-52 dark:border-gray-700 dark:bg-gray-950">
|
||||
<Link className="my-auto cursor-pointer font-bold text-2xl" href="/">
|
||||
<h1 className={"website-title-font 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"
|
||||
className="mx-2 my-auto px-2 font-bold hover:text-sky-700 dark:hover:text-sky-500"
|
||||
href={menuItem.href}
|
||||
key={nanoid()}
|
||||
onClick={() => setIsSideNavOpen(false)}
|
||||
@@ -50,23 +50,23 @@ export const NavBar = () => {
|
||||
</Link>
|
||||
))}
|
||||
<Link
|
||||
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"
|
||||
className="mx-2 cursor-pointer 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
|
||||
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"
|
||||
className="mx-1 cursor-pointer 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">
|
||||
<div className="my-auto text-3xl sm:hidden">
|
||||
<SheetTrigger
|
||||
className="text-black rounded-full p-1 hover:bg-gray-200 dark:text-gray-50 dark:hover:bg-gray-800"
|
||||
className="rounded-full p-1 text-black hover:bg-gray-200 dark:text-gray-50 dark:hover:bg-gray-800"
|
||||
title="Spread the navigation menu"
|
||||
>
|
||||
<MdMenu
|
||||
@@ -77,7 +77,7 @@ export const NavBar = () => {
|
||||
</SheetTrigger>
|
||||
</div>
|
||||
</div>
|
||||
<SheetContent className="bg:white border-none py-16 shadow-md dark:bg-black flex flex-col text-end">
|
||||
<SheetContent className="bg:white flex flex-col border-none py-16 text-end shadow-md dark:bg-black">
|
||||
{MenuItems.map((menuItem) => (
|
||||
<Link
|
||||
className="border-b border-dashed p-3 text-xl hover:text-sky-500"
|
||||
@@ -97,11 +97,11 @@ export const NavBar = () => {
|
||||
{"SEARCH"}
|
||||
</Link>
|
||||
<div
|
||||
className="flex text-xl p-3 cursor-pointer border-b border-dashed justify-end hover:text-sky-500"
|
||||
className="flex cursor-pointer justify-end border-b border-dashed p-3 text-xl hover:text-sky-500"
|
||||
onClick={handleSwitchTheme}
|
||||
>
|
||||
<div
|
||||
className="cursor-pointer mx-1 my-auto rounded-full text-2xl"
|
||||
className="mx-1 my-auto cursor-pointer rounded-full text-2xl"
|
||||
title={theme === "light" ? "Switch to dark mode" : "Switch to light mode"}
|
||||
>
|
||||
{theme === "light" ? <MdOutlineDarkMode /> : <MdOutlineLightMode />}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { normalizeDate } from "@/lib/date";
|
||||
import { TPostListItem } from "@/types/post-list";
|
||||
import type { TPostListItem } from "@/types/post-list";
|
||||
import { nanoid } from "nanoid";
|
||||
import Link from "next/link";
|
||||
import { Badge } from "../ui/badge";
|
||||
@@ -12,34 +12,34 @@ export const PostList = (props: { data: TPostListItem[] }) => {
|
||||
<div
|
||||
className={`flex flex-col justify-center ${
|
||||
index !== props.data.length - 1 && "border-b"
|
||||
} border-gray-200 hover:bg-gray-50 dark:hover:bg-gray-900 dark:border-gray-800 px-3 py-1`}
|
||||
} border-gray-200 px-3 py-1 hover:bg-gray-50 dark:border-gray-800 dark:hover:bg-gray-900`}
|
||||
>
|
||||
<div className={"post-list-caption-font flex-col py-3"}>
|
||||
<div className="flex justify-center">
|
||||
<h3 className="mx-auto text-lg font-extrabold capitalize">{postItem.frontMatter.title}</h3>
|
||||
<h3 className="mx-auto font-extrabold text-lg capitalize">{postItem.frontMatter.title}</h3>
|
||||
</div>
|
||||
<div className="flex justify-center">
|
||||
{postItem.frontMatter.subtitle && (
|
||||
<div className="mx-auto text-sm font-bold capitalize text-gray-700 dark:text-gray-300">
|
||||
<div className="mx-auto font-bold text-gray-700 text-sm capitalize dark:text-gray-300">
|
||||
{postItem.frontMatter.subtitle}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{postItem.frontMatter.summary && (
|
||||
<div className={"content-font flex justify-center"}>
|
||||
<div className={"flex justify-center content-font"}>
|
||||
<p>{postItem.frontMatter.summary}</p>
|
||||
</div>
|
||||
)}
|
||||
<div className="flex flex-wrap justify-between my-2">
|
||||
<div className="text-center flex flex-col justify-center italic text-sm my-auto mr-2 h-6">
|
||||
<div className="my-2 flex flex-wrap justify-between">
|
||||
<div className="my-auto mr-2 flex h-6 flex-col justify-center text-center text-sm italic">
|
||||
<div className="my-auto">{normalizeDate(postItem.frontMatter.time)}</div>
|
||||
</div>
|
||||
{postItem.frontMatter.tags && (
|
||||
<div className="flex flex-wrap my-auto">
|
||||
<div className="my-auto flex flex-wrap">
|
||||
{postItem.frontMatter.tags.map((tagName) => (
|
||||
<Badge
|
||||
className="mr-1 my-1 text-gray-600 dark:text-gray-300"
|
||||
className="my-1 mr-1 text-gray-600 dark:text-gray-300"
|
||||
key={`tags-${nanoid()}`}
|
||||
variant={"secondary"}
|
||||
>
|
||||
|
||||
@@ -5,7 +5,7 @@ import { TbBrandFacebook, TbBrandLinkedin, TbBrandMastodon } from "react-icons/t
|
||||
|
||||
export const SocialIcons = () => {
|
||||
return (
|
||||
<div className="my-5 flex justify-center space-x-4 text-2xl font-bold">
|
||||
<div className="my-5 flex justify-center space-x-4 font-bold text-2xl">
|
||||
{Config.SocialLinks.twitter && (
|
||||
<Link href={`https://x.com/${Config.SocialLinks.twitter}`} target="_blank" title="Twitter">
|
||||
<FiTwitter className="hover:text-sky-500" />
|
||||
|
||||
Reference in New Issue
Block a user