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

Fix some UI flaws

Browse Source
This commit is contained in:
PrinOrange
2024-01-06 20:53:18 +08:00
parent eac42b69a7
commit 099795ab4c
9 changed files with 22 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
components/readerpage/TOC.tsx
View File

@@ -3,7 +3,7 @@ import Link from "next/link";
export const TOC = (props: { data: TTOCItem[] }) => {
return (
<div className="sticky top-[5em] mx-5 p-2 border border-black dark:border-gray-400 rounded-sm">
<div className="sticky top-[5em] mx-5 p-2 border border-black dark:border-gray-400">
<div className="p-2 font-bold text-center border bg-black text-white dark:text-black dark:bg-gray-100">
{"TABLE OF CONTENTS"}
</div>

2
components/utils/PostList.tsx
View File

@@ -13,7 +13,7 @@ export const PostList = (props: { data: TPostListItem[] }) => {
key={`post-list-${nanoid()}`}
className={`${fontSourceSerifScreenCN.className} flex flex-col justify-center ${
index !== props.data.length - 1 && "border-b"
} border-dashed border-gray-400 py-3`}
} border-gray-200 dark:border-gray-800 py-3`}
>
<Link className="hover:text-gray-600 dark:hover:text-gray-400" href={`/blog/${postListItem.id}`}>
<div className="flex-center flex flex-col py-2 ">

4
lib/utils.ts
View File

@@ -61,7 +61,7 @@ export function isEmptyString(value: string | null | undefined): boolean {
* @returns The array without empty values.
* @template T - The type of the array elements.
*/
export function removeEmptyValuesFromArray<T = any>(value: any[]): T[] {
export function removeEmptyValuesFromArray<T>(value: T[]): T[] {
return value.filter((item) => item != null);
}
@@ -74,7 +74,7 @@ export function isEmptyArray(value: any[] | null | undefined): boolean {
if (value === null || value === undefined) {
return true;
}
return removeEmptyValuesFromArray(value).length !== 0;
return removeEmptyValuesFromArray(value).length === 0;
}
/**

5
pages/about.tsx
View File

@@ -1,4 +1,5 @@
import { ContentContainer, Page } from "@/components/layouts/layouts";
import { Separator } from "@/components/ui/separator";
import { Footer } from "@/components/utils/Footer";
import { NavBar } from "@/components/utils/NavBar";
import { SEO } from "@/components/utils/SEO";
@@ -17,10 +18,10 @@ export default function AboutPage() {
/>
<ContentContainer>
<NavBar />
<h2 className={`my-10 flex justify-around text-2xl font-bold ${fontFangZhengXiaoBiaoSongCN.className}`}>
<h2 className={`my-5 flex justify-around text-2xl font-bold ${fontFangZhengXiaoBiaoSongCN.className}`}>
{"ABOUT ME"}
</h2>
<hr />
<Separator />
<div className={`${fontSourceSerifScreenCN.className} my-5 justify-center md:flex md:space-x-10`}>
<div className="my-auto flex md:w-1/3">
<img alt="my-profile" className="mx-auto my-auto max-h-[23rem] rounded-lg" src="/images/profile.webp" />

5
pages/friends.tsx
View File

@@ -1,4 +1,5 @@
import { ContentContainer, Page } from "@/components/layouts/layouts";
import { Separator } from "@/components/ui/separator";
import { Footer } from "@/components/utils/Footer";
import { NavBar } from "@/components/utils/NavBar";
import { SEO } from "@/components/utils/SEO";
@@ -17,7 +18,7 @@ export default function FriendsPage() {
<h2 className={`my-10 flex justify-center text-2xl font-bold ${fontFangZhengXiaoBiaoSongCN.className}`}>
{"FRIENDS"}
</h2>
<hr />
<Separator />
<div className={`my-5 py-3 flex flex-wrap justify-center text-2xl ${fontSourceSerifScreenCN.className}`}>
{FriendsList.map((item) => (
<Link className="mx-3 p-2 underline" href={item.url} key={nanoid()}>
@@ -25,7 +26,7 @@ export default function FriendsPage() {
</Link>
))}
</div>
<hr />
<Separator />
<div className="my-3 text-base flex-col flex justify-start">
<div className="mx-auto">
{"Welcome to exchange our friend links and every high-quality blog websites are welcomed. "}

7
pages/index.tsx
View File

@@ -1,6 +1,7 @@
import { HomeCover } from "@/components/homepage/HomeCover";
import { ContentContainer, Page } from "@/components/layouts/layouts";
import { Button } from "@/components/ui/button";
import { Separator } from "@/components/ui/separator";
import { Footer } from "@/components/utils/Footer";
import { NavBar } from "@/components/utils/NavBar";
import { PostList } from "@/components/utils/PostList";
@@ -34,12 +35,12 @@ export default function Home(props: HomePageProps) {
<HomeCover />
{props.pinnedPostList.length !== 0 && (
<div>
<hr />
<Separator />
<h2 className={`my-5 flex justify-center text-2xl font-bold ${fontFangZhengXiaoBiaoSongCN.className}`}>
<RiStarFill className="mx-2 my-auto" />
{"PINNED POSTS"}
</h2>
<hr />
<Separator />
<PostList data={props.pinnedPostList} />
</div>
)}
@@ -50,7 +51,7 @@ export default function Home(props: HomePageProps) {
<LuPenTool className="mx-2 my-auto" />
{"LATEST POSTS"}
</h2>
<hr />
<Separator />
<PostList data={props.latestPostList} />
<div className="my-2 flex justify-end">
<Button asChild>

7
pages/posts/[[...slug]].tsx
View File

@@ -1,6 +1,7 @@
import { ContentContainer, Page } from "@/components/layouts/layouts";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Separator } from "@/components/ui/separator";
import { Footer } from "@/components/utils/Footer";
import { NavBar } from "@/components/utils/NavBar";
import { PostList } from "@/components/utils/PostList";
@@ -55,17 +56,17 @@ export default function PostsPage(props: PostsPageProps) {
/>
<ContentContainer>
<NavBar />
<h2 className={`my-10 flex justify-center text-2xl ${fontFangZhengXiaoBiaoSongCN.className} font-bold`}>
<h2 className={`my-5 flex justify-center text-2xl ${fontFangZhengXiaoBiaoSongCN.className} font-bold`}>
<LuPenTool className="mx-2 my-auto" />
{"ALL POSTS"}
</h2>
<hr />
<Separator />
<div className={`my-5 flex flex-wrap justify-center px-2 ${fontSourceSerifScreenCN.className}`}>
{props.tagList.map((item) => (
<TagBadge key={`tag-badge-${nanoid()}`} name={item.name} size="md" count={item.count} />
))}
</div>
<hr />
<Separator />
<PostList data={props.postList} />
<div className="my-5 flex justify-between text-base font-bold">
{props.pageNumber !== 1 && (

2
pages/sponsor.tsx
View File

@@ -26,7 +26,7 @@ export default function AboutPage() {
<div className="md:flex">
<div className="flex flex-col justify-center md:w-1/2">
<h2
className={`my-10 flex justify-center text-2xl font-bold text-red-500 ${fontFangZhengXiaoBiaoSongCN.className}`}
className={`my-5 flex justify-center text-2xl font-bold text-red-500 ${fontFangZhengXiaoBiaoSongCN.className}`}
>
<GoHeartFill className="mx-2 my-auto" />
{"SPONSOR"}

5
pages/tags/[...slug].tsx
View File

@@ -1,6 +1,7 @@
import { ContentContainer, Page } from "@/components/layouts/layouts";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Separator } from "@/components/ui/separator";
import { Footer } from "@/components/utils/Footer";
import { NavBar } from "@/components/utils/NavBar";
import { PostList } from "@/components/utils/PostList";
@@ -53,11 +54,11 @@ export default function TagsContentPage(props: TagsContentPageProps) {
<ContentContainer>
<NavBar />
<h2
className={`my-10 flex flex-col justify-center text-center text-3xl font-bold ${fontFangZhengXiaoBiaoSongCN.className}`}
className={`my-5 flex flex-col justify-center text-center text-3xl font-bold ${fontFangZhengXiaoBiaoSongCN.className}`}
>
{`Posts of ${props.tagName}`}
</h2>
<hr />
<Separator />
<PostList data={props.postList} />
<div className="my-5 flex justify-between text-base font-bold">
{props.pageNumber !== 1 && (