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
+4 -4
View File
@@ -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>
))}
+7 -7
View File
@@ -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>