style(main): extend proto2 surfaces to remaining pages

This commit is contained in:
zetaloop
2026-02-25 05:33:54 +08:00
parent 15678e755c
commit c301dbd3c2
6 changed files with 23 additions and 23 deletions
+2 -2
View File
@@ -4,8 +4,8 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
export default function HelpPage() { export default function HelpPage() {
return ( return (
<div className="container mx-auto max-w-3xl px-4 py-8 space-y-6"> <div className="container mx-auto max-w-3xl px-4 py-8 space-y-6">
<h1 className="text-2xl font-bold"></h1> <h1 className="text-2xl font-bold tracking-tighter leading-tight"></h1>
<Card> <Card className="hover:shadow-[var(--shadow-card)]">
<CardHeader> <CardHeader>
<CardTitle className="text-base"></CardTitle> <CardTitle className="text-base"></CardTitle>
</CardHeader> </CardHeader>
+4 -4
View File
@@ -21,7 +21,7 @@ export default async function PostDetailPage({ params }: { params: Promise<{ id:
const linkedPlayer = linkedOrder ? getPlayerById(linkedOrder.playerId) : null const linkedPlayer = linkedOrder ? getPlayerById(linkedOrder.playerId) : null
return ( return (
<div className="container mx-auto py-8 px-4 max-w-2xl"> <div className="container mx-auto max-w-2xl px-4 py-8 space-y-6">
<Link <Link
href="/community" href="/community"
className="inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground mb-4" className="inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground mb-4"
@@ -30,7 +30,7 @@ export default async function PostDetailPage({ params }: { params: Promise<{ id:
</Link> </Link>
<Card> <Card className="hover:shadow-[var(--shadow-card)]">
<CardHeader className="pb-3"> <CardHeader className="pb-3">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<Avatar className="h-10 w-10"> <Avatar className="h-10 w-10">
@@ -52,13 +52,13 @@ export default async function PostDetailPage({ params }: { params: Promise<{ id:
</div> </div>
</CardHeader> </CardHeader>
<CardContent className="space-y-4"> <CardContent className="space-y-4">
<h1 className="text-xl font-bold">{post.title}</h1> <h1 className="text-xl font-bold tracking-tighter leading-tight">{post.title}</h1>
<p className="text-sm leading-relaxed whitespace-pre-wrap">{post.content}</p> <p className="text-sm leading-relaxed whitespace-pre-wrap">{post.content}</p>
{post.images.length > 0 && ( {post.images.length > 0 && (
<div className="flex gap-2 flex-wrap"> <div className="flex gap-2 flex-wrap">
{post.images.map((img) => ( {post.images.map((img) => (
<div key={img} className="relative h-40 w-40 rounded-md overflow-hidden bg-muted"> <div key={img} className="relative h-40 w-40 rounded-lg overflow-hidden bg-muted">
<Image src={img} alt="帖子图片" fill className="object-cover" /> <Image src={img} alt="帖子图片" fill className="object-cover" />
</div> </div>
))} ))}
+7 -7
View File
@@ -92,7 +92,7 @@ export default function NewPostPage() {
} }
return ( return (
<div className="container mx-auto py-8 px-4 max-w-2xl"> <div className="container mx-auto max-w-2xl px-4 py-8 space-y-6">
<Link <Link
href="/community" href="/community"
className="inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground mb-4" className="inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground mb-4"
@@ -101,9 +101,9 @@ export default function NewPostPage() {
</Link> </Link>
<Card> <Card className="hover:shadow-[var(--shadow-card)]">
<CardHeader> <CardHeader>
<CardTitle></CardTitle> <CardTitle className="tracking-tighter leading-tight"></CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<form onSubmit={handleSubmit(onSubmit)} className="space-y-6"> <form onSubmit={handleSubmit(onSubmit)} className="space-y-6">
@@ -154,14 +154,14 @@ export default function NewPostPage() {
))} ))}
</SelectContent> </SelectContent>
</Select> </Select>
<div className="mt-2 rounded-md border bg-muted/50 p-3 text-sm text-muted-foreground"> <div className="mt-2 rounded-xl border bg-muted/50 p-3 text-sm text-muted-foreground">
<p className="font-medium text-foreground"></p> <p className="font-medium text-foreground"></p>
{selectedQuotePostId ? ( {selectedQuotePostId ? (
(() => { (() => {
const post = posts.find((p) => p.id === selectedQuotePostId) const post = posts.find((p) => p.id === selectedQuotePostId)
if (!post) return <p className="mt-1"></p> if (!post) return <p className="mt-1"></p>
return ( return (
<div className="mt-2 rounded border bg-background p-3"> <div className="mt-2 rounded-lg border bg-background p-3">
<p className="font-medium text-foreground">{post.title}</p> <p className="font-medium text-foreground">{post.title}</p>
<p className="mt-1 line-clamp-2 text-xs text-muted-foreground"> <p className="mt-1 line-clamp-2 text-xs text-muted-foreground">
{post.content} {post.content}
@@ -201,7 +201,7 @@ export default function NewPostPage() {
{Array.from({ length: imageCount }).map((_, i) => ( {Array.from({ length: imageCount }).map((_, i) => (
<div <div
key={`img-${i.toString()}`} key={`img-${i.toString()}`}
className="h-20 w-20 rounded-md bg-muted flex items-center justify-center relative" className="h-20 w-20 rounded-lg bg-muted flex items-center justify-center relative"
> >
<span className="text-xs text-muted-foreground"></span> <span className="text-xs text-muted-foreground"></span>
<button <button
@@ -217,7 +217,7 @@ export default function NewPostPage() {
<button <button
type="button" type="button"
onClick={() => setImageCount((c) => c + 1)} onClick={() => setImageCount((c) => c + 1)}
className="h-20 w-20 rounded-md border-2 border-dashed border-muted-foreground/25 flex flex-col items-center justify-center gap-1 text-muted-foreground hover:border-muted-foreground/50 transition-colors" className="h-20 w-20 rounded-lg border-2 border-dashed border-muted-foreground/25 flex flex-col items-center justify-center gap-1 text-muted-foreground hover:border-muted-foreground/50 transition-colors"
> >
<ImagePlus className="h-5 w-5" /> <ImagePlus className="h-5 w-5" />
<span className="text-[10px]"></span> <span className="text-[10px]"></span>
+2 -2
View File
@@ -3,8 +3,8 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
export default function PrivacyPage() { export default function PrivacyPage() {
return ( return (
<div className="container mx-auto max-w-3xl px-4 py-8 space-y-6"> <div className="container mx-auto max-w-3xl px-4 py-8 space-y-6">
<h1 className="text-2xl font-bold"></h1> <h1 className="text-2xl font-bold tracking-tighter leading-tight"></h1>
<Card> <Card className="hover:shadow-[var(--shadow-card)]">
<CardHeader> <CardHeader>
<CardTitle className="text-base">使</CardTitle> <CardTitle className="text-base">使</CardTitle>
</CardHeader> </CardHeader>
+2 -2
View File
@@ -4,8 +4,8 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
export default function TermsPage() { export default function TermsPage() {
return ( return (
<div className="container mx-auto max-w-3xl px-4 py-8 space-y-6"> <div className="container mx-auto max-w-3xl px-4 py-8 space-y-6">
<h1 className="text-2xl font-bold"></h1> <h1 className="text-2xl font-bold tracking-tighter leading-tight"></h1>
<Card> <Card className="hover:shadow-[var(--shadow-card)]">
<CardHeader> <CardHeader>
<CardTitle className="text-base"></CardTitle> <CardTitle className="text-base"></CardTitle>
</CardHeader> </CardHeader>
+6 -6
View File
@@ -33,14 +33,14 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
.filter((s): s is NonNullable<typeof s> => s != null) .filter((s): s is NonNullable<typeof s> => s != null)
return ( return (
<div className="container mx-auto py-8 px-4 max-w-4xl"> <div className="container mx-auto max-w-4xl px-4 py-8 space-y-6">
<div className="flex items-center gap-6 mb-8"> <div className="flex items-center gap-6 mb-8">
<Avatar className="w-24 h-24 border-4 border-background shadow-lg"> <Avatar className="w-24 h-24 border-4 border-background shadow-[var(--shadow-card)]">
<AvatarImage src={user.avatar} alt={user.nickname} /> <AvatarImage src={user.avatar} alt={user.nickname} />
<AvatarFallback>{user.nickname[0]}</AvatarFallback> <AvatarFallback>{user.nickname[0]}</AvatarFallback>
</Avatar> </Avatar>
<div className="space-y-2"> <div className="space-y-2">
<h1 className="text-2xl font-bold">{user.nickname}</h1> <h1 className="text-2xl font-bold tracking-tighter leading-tight">{user.nickname}</h1>
<p className="text-sm text-muted-foreground">{user.bio || "这个人很懒,什么都没写~"}</p> <p className="text-sm text-muted-foreground">{user.bio || "这个人很懒,什么都没写~"}</p>
<div className="flex gap-4 text-sm text-muted-foreground"> <div className="flex gap-4 text-sm text-muted-foreground">
<span>{userPosts.length} </span> <span>{userPosts.length} </span>
@@ -61,7 +61,7 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
) : ( ) : (
userPosts.map((post) => ( userPosts.map((post) => (
<Link key={post.id} href={`/post/${post.id}`}> <Link key={post.id} href={`/post/${post.id}`}>
<Card className="hover:shadow-md transition-shadow"> <Card>
<CardHeader className="pb-2"> <CardHeader className="pb-2">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<CardTitle className="text-base">{post.title}</CardTitle> <CardTitle className="text-base">{post.title}</CardTitle>
@@ -97,7 +97,7 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3"> <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
{favoritePlayers.map((player) => ( {favoritePlayers.map((player) => (
<Link key={player.id} href={`/player/${player.id}`}> <Link key={player.id} href={`/player/${player.id}`}>
<Card className="hover:shadow-md transition-shadow"> <Card>
<CardContent className="flex items-center gap-3 p-4"> <CardContent className="flex items-center gap-3 p-4">
<Avatar> <Avatar>
<AvatarImage src={player.user.avatar} /> <AvatarImage src={player.user.avatar} />
@@ -132,7 +132,7 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3"> <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
{favoriteShops.map((shop) => ( {favoriteShops.map((shop) => (
<Link key={shop.id} href={`/shop/${shop.id}`}> <Link key={shop.id} href={`/shop/${shop.id}`}>
<Card className="hover:shadow-md transition-shadow"> <Card>
<CardContent className="flex items-center gap-3 p-4"> <CardContent className="flex items-center gap-3 p-4">
<Avatar> <Avatar>
<AvatarImage src={shop.owner.avatar} /> <AvatarImage src={shop.owner.avatar} />