feat: 优化 /life 页面样式和图片显示
- 优化 /life 列表页视觉设计,增加主题标签、背景装饰、卡片动效 - 修复列表页精选文章图片显示 - 优化文章详情页图片画廊,支持切换和计数显示 - 保持整体风格一致性(米白背景 + 深灰文字 + 绿色强调)
This commit is contained in:
@@ -0,0 +1,45 @@
|
||||
import type { Metadata } from "next";
|
||||
import { notFound } from "next/navigation";
|
||||
import { LifeArticlePage } from "@/components/life-article-page";
|
||||
import { lifePosts, getLifePost } from "@/content/life/posts";
|
||||
|
||||
type PageProps = {
|
||||
params: Promise<{
|
||||
slug: string;
|
||||
}>;
|
||||
};
|
||||
|
||||
export function generateStaticParams() {
|
||||
return lifePosts.map((post) => ({ slug: post.slug }));
|
||||
}
|
||||
|
||||
export async function generateMetadata({ params }: PageProps): Promise<Metadata> {
|
||||
const { slug } = await params;
|
||||
const post = getLifePost(slug);
|
||||
|
||||
if (!post) {
|
||||
return {
|
||||
title: "文章未找到 | fly",
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
title: `${post.title} | fly 日常分享`,
|
||||
description: post.description,
|
||||
};
|
||||
}
|
||||
|
||||
export default async function LifeArticlePageRoute({ params }: PageProps) {
|
||||
const { slug } = await params;
|
||||
const post = getLifePost(slug);
|
||||
|
||||
if (!post) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const currentIndex = lifePosts.findIndex((p) => p.slug === slug);
|
||||
const prevPost = currentIndex > 0 ? lifePosts[currentIndex - 1] : undefined;
|
||||
const nextPost = currentIndex < lifePosts.length - 1 ? lifePosts[currentIndex + 1] : undefined;
|
||||
|
||||
return <LifeArticlePage post={post} prevPost={prevPost} nextPost={nextPost} />;
|
||||
}
|
||||
+10
-10
@@ -1,12 +1,12 @@
|
||||
import { PlaceholderPage } from "@/components/placeholder-page";
|
||||
import type { Metadata } from "next";
|
||||
import { LifePage } from "@/components/life-page";
|
||||
import { lifePosts } from "@/content/life/posts";
|
||||
|
||||
export default function LifePage() {
|
||||
return (
|
||||
<PlaceholderPage
|
||||
eyebrow="Life journal"
|
||||
title="生活分享"
|
||||
description="技术之外的个人切面:日常、阅读、音乐、照片、旅行,以及阶段性的想法。"
|
||||
items={["日常记录", "阅读和音乐", "照片和旅行", "一些想法"]}
|
||||
/>
|
||||
);
|
||||
export const metadata: Metadata = {
|
||||
title: "日常分享 | fly",
|
||||
description: "fly 的日常分享,记录生活片段、照片和阶段性的想法。",
|
||||
};
|
||||
|
||||
export default function LifeIndexPage() {
|
||||
return <LifePage posts={lifePosts} />;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user