refactor: update blog page localization and content structure
- Simplify blog page translation keys in English and Chinese - Remove hardcoded category labels in blog post page - Use server-side translations for publisher, categories, and table of contents - Remove font-serif class from blog post content
This commit is contained in:
parent
11e1df01ed
commit
48adc7ad4a
@ -61,11 +61,8 @@
|
||||
"BlogPage": {
|
||||
"title": "Blog",
|
||||
"subtitle": "Latest news and updates from our team",
|
||||
"categories": {
|
||||
"all": "All",
|
||||
"news": "News",
|
||||
"guide": "Guide",
|
||||
"company": "Company"
|
||||
}
|
||||
"publisher": "Publisher",
|
||||
"categories": "Categories",
|
||||
"tableOfContents": "Table of Contents"
|
||||
}
|
||||
}
|
@ -61,11 +61,8 @@
|
||||
"BlogPage": {
|
||||
"title": "博客",
|
||||
"subtitle": "来自我们的团队最新新闻和更新",
|
||||
"categories": {
|
||||
"all": "全部",
|
||||
"news": "新闻",
|
||||
"guide": "指南",
|
||||
"company": "公司"
|
||||
}
|
||||
"publisher": "发布者",
|
||||
"categories": "分类",
|
||||
"tableOfContents": "目录"
|
||||
}
|
||||
}
|
@ -13,6 +13,7 @@ import { notFound } from 'next/navigation';
|
||||
import { useTranslations } from 'next-intl';
|
||||
|
||||
import '@/styles/mdx.css';
|
||||
import { getTranslations } from 'next-intl/server';
|
||||
|
||||
/**
|
||||
* Gets the blog post from the params
|
||||
@ -89,6 +90,7 @@ export default async function BlogPostPage(props: NextPageProps) {
|
||||
const publishDate = post.date;
|
||||
const date = getLocaleDate(publishDate);
|
||||
const toc = await getTableOfContents(post.content);
|
||||
const t = await getTranslations("BlogPage");
|
||||
|
||||
return (
|
||||
<div className="flex flex-col gap-8">
|
||||
@ -120,7 +122,7 @@ export default async function BlogPostPage(props: NextPageProps) {
|
||||
</div>
|
||||
|
||||
{/* blog post content */}
|
||||
<div className="mt-4 font-serif">
|
||||
<div className="mt-4">
|
||||
<Mdx code={post.body.code} />
|
||||
</div>
|
||||
|
||||
@ -134,7 +136,7 @@ export default async function BlogPostPage(props: NextPageProps) {
|
||||
<div className="space-y-4 lg:sticky lg:top-24">
|
||||
{/* author info */}
|
||||
<div className="bg-muted/50 rounded-lg p-6">
|
||||
<h2 className="text-lg font-semibold mb-4">Publisher</h2>
|
||||
<h2 className="text-lg font-semibold mb-4">{t("publisher")}</h2>
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="relative h-12 w-12 flex-shrink-0">
|
||||
{post.author?.avatar && (
|
||||
@ -156,7 +158,7 @@ export default async function BlogPostPage(props: NextPageProps) {
|
||||
|
||||
{/* categories */}
|
||||
<div className="bg-muted/50 rounded-lg p-6">
|
||||
<h2 className="text-lg font-semibold mb-4">Categories</h2>
|
||||
<h2 className="text-lg font-semibold mb-4">{t("categories")}</h2>
|
||||
<ul className="flex flex-wrap gap-4">
|
||||
{post.categories?.filter(Boolean).map((category) => (
|
||||
category && (
|
||||
@ -178,7 +180,7 @@ export default async function BlogPostPage(props: NextPageProps) {
|
||||
|
||||
{/* table of contents */}
|
||||
<div className="bg-muted/50 rounded-lg p-6 hidden lg:block">
|
||||
<h2 className="text-lg font-semibold mb-4">Table of Contents</h2>
|
||||
<h2 className="text-lg font-semibold mb-4">{t("tableOfContents")}</h2>
|
||||
<div className="max-h-[calc(100vh-18rem)] overflow-y-auto">
|
||||
<BlogToc toc={toc} />
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user