From 9ecbf0816e8ddedb3677aa08e9e77bf807fcb148 Mon Sep 17 00:00:00 2001
From: giancarlo <giancarlopsk@gmail.com>
Date: Sun, 7 Apr 2024 15:37:03 +0800
Subject: [PATCH] Update CSS classes in web pages

The CSS classes used across different web pages in the web application have been updated. This change mainly consists of adjustments to spacing on various elements to improve the visual layout. The alterations should enhance the readability and user experience of the mentioned pages.
---
 apps/web/app/(marketing)/blog/_components/post.tsx | 2 +-
 apps/web/app/(marketing)/blog/page.tsx             | 2 +-
 apps/web/app/(marketing)/docs/[...slug]/page.tsx   | 2 +-
 apps/web/app/(marketing)/docs/page.tsx             | 2 +-
 apps/web/app/(marketing)/faq/page.tsx              | 2 +-
 apps/web/app/(marketing)/layout.tsx                | 4 ++--
 apps/web/app/(marketing)/page.tsx                  | 2 +-
 7 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/apps/web/app/(marketing)/blog/_components/post.tsx b/apps/web/app/(marketing)/blog/_components/post.tsx
index 48ceec099..5c1bff50f 100644
--- a/apps/web/app/(marketing)/blog/_components/post.tsx
+++ b/apps/web/app/(marketing)/blog/_components/post.tsx
@@ -9,7 +9,7 @@ export const Post: React.FC<{
   content: string;
 }> = ({ post, content }) => {
   return (
-    <div className={'mx-auto my-8 flex max-w-2xl flex-col space-y-6'}>
+    <div className={'mx-auto flex max-w-2xl flex-col space-y-6'}>
       <PostHeader post={post} />
 
       <article className={styles.HTML}>
diff --git a/apps/web/app/(marketing)/blog/page.tsx b/apps/web/app/(marketing)/blog/page.tsx
index 69ae75ac7..a1f3c69e5 100644
--- a/apps/web/app/(marketing)/blog/page.tsx
+++ b/apps/web/app/(marketing)/blog/page.tsx
@@ -25,7 +25,7 @@ async function BlogPage() {
 
   return (
     <div className={'container mx-auto'}>
-      <div className={'my-8 flex flex-col space-y-16'}>
+      <div className={'flex flex-col space-y-16'}>
         <SitePageHeader
           title={t('marketing:blog')}
           subtitle={t('marketing:blogSubtitle')}
diff --git a/apps/web/app/(marketing)/docs/[...slug]/page.tsx b/apps/web/app/(marketing)/docs/[...slug]/page.tsx
index 2ef7bb7db..128aaf2d3 100644
--- a/apps/web/app/(marketing)/docs/[...slug]/page.tsx
+++ b/apps/web/app/(marketing)/docs/[...slug]/page.tsx
@@ -51,7 +51,7 @@ async function DocumentationPage({ params }: PageParams) {
     <div className={'container mx-auto'}>
       <div
         className={
-          'relative mx-auto flex max-w-4xl grow flex-col space-y-4 px-8 py-8'
+          'relative mx-auto flex max-w-4xl grow flex-col space-y-4 px-8'
         }
       >
         <SitePageHeader
diff --git a/apps/web/app/(marketing)/docs/page.tsx b/apps/web/app/(marketing)/docs/page.tsx
index a9630cecf..3dda7b9d3 100644
--- a/apps/web/app/(marketing)/docs/page.tsx
+++ b/apps/web/app/(marketing)/docs/page.tsx
@@ -27,7 +27,7 @@ async function DocsPage() {
 
   return (
     <div className={'flex flex-1 flex-col'}>
-      <PageBody className={'mt-8'}>
+      <PageBody>
         <div className={'flex flex-col items-center space-y-16'}>
           <SitePageHeader
             title={t('marketing:documentation')}
diff --git a/apps/web/app/(marketing)/faq/page.tsx b/apps/web/app/(marketing)/faq/page.tsx
index f0d5b06f3..68550a91c 100644
--- a/apps/web/app/(marketing)/faq/page.tsx
+++ b/apps/web/app/(marketing)/faq/page.tsx
@@ -68,7 +68,7 @@ async function FAQPage() {
       />
 
       <div className={'container mx-auto'}>
-        <div className={'my-8 flex flex-col space-y-16'}>
+        <div className={'flex flex-col space-y-16'}>
           <SitePageHeader
             title={t('marketing:faq')}
             subtitle={t('marketing:faqSubtitle')}
diff --git a/apps/web/app/(marketing)/layout.tsx b/apps/web/app/(marketing)/layout.tsx
index f9e02a63e..af444a9f2 100644
--- a/apps/web/app/(marketing)/layout.tsx
+++ b/apps/web/app/(marketing)/layout.tsx
@@ -9,7 +9,7 @@ async function SiteLayout(props: React.PropsWithChildren) {
   const user = await getUser();
 
   return (
-    <>
+    <div className={'flex flex-col space-y-8'}>
       <SiteHeader user={user} />
 
       {props.children}
@@ -17,7 +17,7 @@ async function SiteLayout(props: React.PropsWithChildren) {
       <Separator />
 
       <SiteFooter />
-    </>
+    </div>
   );
 }
 
diff --git a/apps/web/app/(marketing)/page.tsx b/apps/web/app/(marketing)/page.tsx
index ad4e091de..b0be8c644 100644
--- a/apps/web/app/(marketing)/page.tsx
+++ b/apps/web/app/(marketing)/page.tsx
@@ -17,7 +17,7 @@ function Home() {
       <div className={'container mx-auto'}>
         <div
           className={
-            'my-12 flex flex-col items-center md:flex-row lg:my-16' +
+            'mt-4 flex flex-col items-center md:flex-row xl:mt-12' +
             ' mx-auto flex-1 justify-center animate-in fade-in ' +
             ' duration-1000 slide-in-from-top-12'
           }