From 354421a0fa3f2d3d958d7359f2c972372aa0d5d7 Mon Sep 17 00:00:00 2001
From: Johnson Mao <tutelary.maomao@gmail.com>
Date: Tue, 31 Oct 2023 22:20:25 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=F0=9F=94=A7=20remove=20experimental=20->?=
 =?UTF-8?q?=20appDir?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 next.config.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/next.config.js b/next.config.js
index d38d470f..6c66a415 100644
--- a/next.config.js
+++ b/next.config.js
@@ -2,7 +2,6 @@
 const nextConfig = {
   reactStrictMode: true,
   experimental: {
-    appDir: true,
     typedRoutes: true,
   },
   images: {

From c087bdc4a192b572e2031ffde7d72ef60d3ee050 Mon Sep 17 00:00:00 2001
From: Johnson Mao <tutelary.maomao@gmail.com>
Date: Tue, 31 Oct 2023 22:20:45 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=92=84=20update=20web=20style?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/[lang]/page.tsx                | 18 +++++++++++-------
 src/app/[lang]/posts/[postId]/page.tsx |  8 +++++---
 src/app/[lang]/posts/page.tsx          | 18 +++++++++++-------
 src/components/Container/Container.tsx |  3 ++-
 4 files changed, 29 insertions(+), 18 deletions(-)

diff --git a/src/app/[lang]/page.tsx b/src/app/[lang]/page.tsx
index f0456e1e..983e7ebe 100644
--- a/src/app/[lang]/page.tsx
+++ b/src/app/[lang]/page.tsx
@@ -23,13 +23,17 @@ async function RootPage({ params: { lang } }: RootParams) {
   const { metadata } = await getDictionary(lang);
 
   return (
-    <Container as="main">
-      <H1 className="py-4 text-3xl font-bold dark:text-white">
-        {metadata.title}
-      </H1>
-      <p className="pb-12 text-xl dark:text-white">{metadata.description}</p>
-      <List Item={Card} items={posts} />
-    </Container>
+    <>
+      <Container className="py-8">
+        <H1 className="mb-4 text-3xl font-bold dark:text-white">
+          {metadata.title}
+        </H1>
+        <p className="text-xl dark:text-white">{metadata.description}</p>
+      </Container>
+      <Container as="main" className="py-8">
+        <List Item={Card} items={posts} />
+      </Container>
+    </>
   );
 }
 
diff --git a/src/app/[lang]/posts/[postId]/page.tsx b/src/app/[lang]/posts/[postId]/page.tsx
index 6b6935a1..09954563 100644
--- a/src/app/[lang]/posts/[postId]/page.tsx
+++ b/src/app/[lang]/posts/[postId]/page.tsx
@@ -39,11 +39,13 @@ async function PostPage({ params: { postId } }: PostParams) {
 
   return (
     <>
-      <Container as="main">
-        <H1 className="py-4 text-3xl font-bold dark:text-white">
+      <Container className="py-8">
+        <H1 className="mb-4 text-3xl font-bold dark:text-white">
           {frontmatter.title}
         </H1>
-        <time className="mt-0">{formattedDate}</time>
+        <time>{formattedDate}</time>
+      </Container>
+      <Container as="main" className="py-8">
         <article className="prose prose-xl prose-slate mx-auto dark:prose-invert">
           {content}
         </article>
diff --git a/src/app/[lang]/posts/page.tsx b/src/app/[lang]/posts/page.tsx
index cf5a6be8..71c3cbd6 100644
--- a/src/app/[lang]/posts/page.tsx
+++ b/src/app/[lang]/posts/page.tsx
@@ -23,13 +23,17 @@ async function RootPage({ params: { lang } }: RootParams) {
   const { metadata } = await getDictionary(lang);
 
   return (
-    <Container as="main">
-      <H1 className="py-4 text-3xl font-bold dark:text-white">
-        {metadata.title}
-      </H1>
-      <p className="pb-12 text-xl dark:text-white">{metadata.description}</p>
-      <List Item={Card} items={posts} />
-    </Container>
+    <>
+      <Container className="py-8">
+        <H1 className="mb-4 text-3xl font-bold dark:text-white">
+          {metadata.title}
+        </H1>
+        <p className="text-xl dark:text-white">{metadata.description}</p>
+      </Container>
+      <Container as="main" className="py-8">
+        <List Item={Card} items={posts} />
+      </Container>
+    </>
   );
 }
 
diff --git a/src/components/Container/Container.tsx b/src/components/Container/Container.tsx
index e45be005..5a307498 100644
--- a/src/components/Container/Container.tsx
+++ b/src/components/Container/Container.tsx
@@ -13,7 +13,8 @@ const Container = forwardRef<HTMLDivElement, ContainerProps>(
       <Component
         className={cn(
           'px-7 md:mx-8 lg:mx-16 lg:px-14',
-          as === 'main' && 'border-2 rounded-lg mt-4 border-gray-500 backdrop-blur',
+          as === 'main' &&
+            'mt-4 rounded-lg border-2 border-zinc-500 bg-zinc-100/70 dark:bg-zinc-900/70',
           className
         )}
         ref={ref}