style(main): extend proto2 surfaces to remaining pages
This commit is contained in:
@@ -4,8 +4,8 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
export default function HelpPage() {
|
||||
return (
|
||||
<div className="container mx-auto max-w-3xl px-4 py-8 space-y-6">
|
||||
<h1 className="text-2xl font-bold">帮助中心</h1>
|
||||
<Card>
|
||||
<h1 className="text-2xl font-bold tracking-tighter leading-tight">帮助中心</h1>
|
||||
<Card className="hover:shadow-[var(--shadow-card)]">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">常见流程</CardTitle>
|
||||
</CardHeader>
|
||||
|
||||
@@ -21,7 +21,7 @@ export default async function PostDetailPage({ params }: { params: Promise<{ id:
|
||||
const linkedPlayer = linkedOrder ? getPlayerById(linkedOrder.playerId) : null
|
||||
|
||||
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
|
||||
href="/community"
|
||||
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>
|
||||
|
||||
<Card>
|
||||
<Card className="hover:shadow-[var(--shadow-card)]">
|
||||
<CardHeader className="pb-3">
|
||||
<div className="flex items-center gap-3">
|
||||
<Avatar className="h-10 w-10">
|
||||
@@ -52,13 +52,13 @@ export default async function PostDetailPage({ params }: { params: Promise<{ id:
|
||||
</div>
|
||||
</CardHeader>
|
||||
<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>
|
||||
|
||||
{post.images.length > 0 && (
|
||||
<div className="flex gap-2 flex-wrap">
|
||||
{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" />
|
||||
</div>
|
||||
))}
|
||||
|
||||
@@ -92,7 +92,7 @@ export default function NewPostPage() {
|
||||
}
|
||||
|
||||
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
|
||||
href="/community"
|
||||
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>
|
||||
|
||||
<Card>
|
||||
<Card className="hover:shadow-[var(--shadow-card)]">
|
||||
<CardHeader>
|
||||
<CardTitle>发布帖子</CardTitle>
|
||||
<CardTitle className="tracking-tighter leading-tight">发布帖子</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form onSubmit={handleSubmit(onSubmit)} className="space-y-6">
|
||||
@@ -154,14 +154,14 @@ export default function NewPostPage() {
|
||||
))}
|
||||
</SelectContent>
|
||||
</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>
|
||||
{selectedQuotePostId ? (
|
||||
(() => {
|
||||
const post = posts.find((p) => p.id === selectedQuotePostId)
|
||||
if (!post) return <p className="mt-1">未找到帖子</p>
|
||||
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="mt-1 line-clamp-2 text-xs text-muted-foreground">
|
||||
{post.content}
|
||||
@@ -201,7 +201,7 @@ export default function NewPostPage() {
|
||||
{Array.from({ length: imageCount }).map((_, i) => (
|
||||
<div
|
||||
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>
|
||||
<button
|
||||
@@ -217,7 +217,7 @@ export default function NewPostPage() {
|
||||
<button
|
||||
type="button"
|
||||
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" />
|
||||
<span className="text-[10px]">添加</span>
|
||||
|
||||
@@ -3,8 +3,8 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
export default function PrivacyPage() {
|
||||
return (
|
||||
<div className="container mx-auto max-w-3xl px-4 py-8 space-y-6">
|
||||
<h1 className="text-2xl font-bold">隐私政策摘要</h1>
|
||||
<Card>
|
||||
<h1 className="text-2xl font-bold tracking-tighter leading-tight">隐私政策摘要</h1>
|
||||
<Card className="hover:shadow-[var(--shadow-card)]">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">数据使用范围</CardTitle>
|
||||
</CardHeader>
|
||||
|
||||
@@ -4,8 +4,8 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
export default function TermsPage() {
|
||||
return (
|
||||
<div className="container mx-auto max-w-3xl px-4 py-8 space-y-6">
|
||||
<h1 className="text-2xl font-bold">用户协议摘要</h1>
|
||||
<Card>
|
||||
<h1 className="text-2xl font-bold tracking-tighter leading-tight">用户协议摘要</h1>
|
||||
<Card className="hover:shadow-[var(--shadow-card)]">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">平台规则</CardTitle>
|
||||
</CardHeader>
|
||||
|
||||
@@ -33,14 +33,14 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
|
||||
.filter((s): s is NonNullable<typeof s> => s != null)
|
||||
|
||||
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">
|
||||
<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} />
|
||||
<AvatarFallback>{user.nickname[0]}</AvatarFallback>
|
||||
</Avatar>
|
||||
<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>
|
||||
<div className="flex gap-4 text-sm text-muted-foreground">
|
||||
<span>{userPosts.length} 帖子</span>
|
||||
@@ -61,7 +61,7 @@ export default async function UserProfilePage({ params }: { params: Promise<{ id
|
||||
) : (
|
||||
userPosts.map((post) => (
|
||||
<Link key={post.id} href={`/post/${post.id}`}>
|
||||
<Card className="hover:shadow-md transition-shadow">
|
||||
<Card>
|
||||
<CardHeader className="pb-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<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">
|
||||
{favoritePlayers.map((player) => (
|
||||
<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">
|
||||
<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">
|
||||
{favoriteShops.map((shop) => (
|
||||
<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">
|
||||
<Avatar>
|
||||
<AvatarImage src={shop.owner.avatar} />
|
||||
|
||||
Reference in New Issue
Block a user