From c091a6d261832d6b6744efd1e47fa0cd02ab4fd5 Mon Sep 17 00:00:00 2001
From: Peaceultime <clem31470@gmail.com>
Date: Tue, 3 Sep 2024 13:14:42 +0200
Subject: [PATCH] Rework page spacing for mobile

---
 components/prose/ProseH1.vue             | 2 +-
 components/prose/ProseH2.vue             | 2 +-
 layouts/explorer.vue                     | 2 +-
 pages/explorer/[projectId]/[...slug].vue | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/components/prose/ProseH1.vue b/components/prose/ProseH1.vue
index 827580b..c210949 100644
--- a/components/prose/ProseH1.vue
+++ b/components/prose/ProseH1.vue
@@ -1,5 +1,5 @@
 <template>
-  <h1 :id="parseId(id)" class="text-5xl font-thin mt-3 mb-8 first:pt-0 pt-2 relative right-8">
+  <h1 :id="parseId(id)" class="text-5xl font-thin mt-3 mb-8 first:pt-0 pt-2 relative sm:right-8 right-4">
     <slot />
   </h1>
 </template>
diff --git a/components/prose/ProseH2.vue b/components/prose/ProseH2.vue
index 37857d7..2e5b56c 100644
--- a/components/prose/ProseH2.vue
+++ b/components/prose/ProseH2.vue
@@ -1,5 +1,5 @@
 <template>
-  <h2 :id="parseId(id)" class="text-4xl font-semibold mt-3 mb-6 ms-1 first:pt-0 pt-2 relative right-8">
+  <h2 :id="parseId(id)" class="text-4xl font-semibold mt-3 mb-6 ms-1 first:pt-0 pt-2 relative sm:right-8 right-4">
     <slot />
   </h2>
 </template>
diff --git a/layouts/explorer.vue b/layouts/explorer.vue
index ead0507..ee9e120 100644
--- a/layouts/explorer.vue
+++ b/layouts/explorer.vue
@@ -38,7 +38,7 @@ function toggleNavigation(bool?: boolean)
 				<p>Copyright Peaceultime - 2024</p>
 			</div>
 		</div>
-		<div class="flex-1 flex items-baseline overflow-auto p-8 relative">
+		<div class="flex-1 flex items-baseline overflow-auto py-8 sm:px-8 px-4 relative">
 			<slot></slot>
 		</div>
 	</div>
diff --git a/pages/explorer/[projectId]/[...slug].vue b/pages/explorer/[projectId]/[...slug].vue
index 3698d24..7f80f13 100644
--- a/pages/explorer/[projectId]/[...slug].vue
+++ b/pages/explorer/[projectId]/[...slug].vue
@@ -18,7 +18,7 @@ definePageMeta({
     </Head>
     <div class="flex-1 flex overflow-hidden">
         <template v-if="!!content && content[0] && content[0].type == 'Markdown' && !!content[0].content">
-            <div class="md:px-24 ps-8 my-1">
+            <div class="md:px-24 ps-8 my-1 whitespace-break-spaces">
                 <ProseH1>{{ content[0].title }}</ProseH1>
                 <Markdown v-model="content[0].content"></Markdown>
             </div>