Visual improvement in H1-6 proses and regular blockquotes

components/prose/ProseBlockquote.vue

@@ -26,7 +26,7 @@ function toggle() {
 blockquote:not(.callout)
 {
   @apply ps-4;
-  @apply my-2;
+  @apply my-4;
   @apply relative;
   @apply before:absolute;
   @apply before:-top-1;

components/prose/ProseH1.vue

@@ -1,5 +1,5 @@
 <template>
-  <h1 :id="parseId(id)" class="text-3xl font-semibold my-3 first:pt-0 pt-2">
+  <h1 :id="parseId(id)" class="text-5xl font-thin mt-3 mb-8 first:pt-0 pt-2 relative right-8">
     <slot />
   </h1>
 </template>

components/prose/ProseH2.vue

@@ -1,5 +1,5 @@
 <template>
-  <h2 :id="parseId(id)" class="text-2xl font-semibold my-3 ms-1 first:pt-0 pt-2">
+  <h2 :id="parseId(id)" class="text-4xl font-semibold mt-3 mb-6 ms-1 first:pt-0 pt-2 relative right-8">
     <slot />
   </h2>
 </template>

components/prose/ProseH3.vue

@@ -1,5 +1,5 @@
 <template>
-  <h3 :id="parseId(id)" class="text-xl font-semibold my-2 ms-4">
+  <h3 :id="parseId(id)" class="text-2xl font-bold  mt-2 mb-4">
     <slot />
   </h3>
 </template>

components/prose/ProseH4.vue

@@ -1,5 +1,5 @@
 <template>
-  <h4 :id="parseId(id)" class="text-lg font-semibold my-2 ms-4">
+  <h4 :id="parseId(id)" class="text-xl font-semibold my-2" style="font-variant: small-caps;">
     <slot />
   </h4>
 </template>

components/prose/ProseH5.vue

@@ -1,5 +1,5 @@
 <template>
-  <h5 :id="parseId(id)" class="text-base font-semibold my-1 ms-4">
+  <h5 :id="parseId(id)" class="text-lg font-semibold my-1">
     <slot />
   </h5>
 </template>

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>
+            <div class="px-24 my-1">
                 <ProseH1>{{ content[0].title }}</ProseH1>
                 <Markdown v-model="content[0].content"></Markdown>
             </div>