Merge pull request #38 from onetimesecret/post/testing-roast

Post/testing roast

Author: delano

app/assets/css/main.css

@@ -1,50 +1,23 @@
-
-
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
 
 @layer base {
   html {
-    font-family: theme('fontFamily.serif');
-  }
-
-  .font-zilla-slab {
-    font-weight: 500; /* Or another appropriate weight */
-    font-size-adjust: 0.55; /* Adjust this value as needed */
-  }
-
-  h1,h2,h3,h4,h5 {
-    font-family: theme('fontFamily.brand');
-
-  }
-
-  button, a.block {
-    font-family: theme('fontFamily.brand');
-    @apply font-zilla-slab;
-  }
-  h1 {
-    @apply text-4xl font-bold text-gray-900 mb-3;
-  }
-  h2 {
-    @apply text-3xl font-bold text-gray-800 mb-3;
-  }
-
-  h3 {
-    @apply text-2xl font-semibold text-gray-700 mb-2;
-  }
-
-  h4 {
-    @apply text-xl font-medium text-gray-600 mb-1;
+    font-family: theme("fontFamily.serif");
   }
 
-  h5 {
-    @apply text-lg font-semibold text-gray-700 mb-2;
+  /* Apply brand font to headings and buttons */
+  h1,
+  h2,
+  button,
+  a.block {
+    font-family: theme("fontFamily.brand");
   }
 }
 
 .onetime-logo-icon {
-  background-image: url('~/assets/img/onetime-logo-v3-xl.svg');
+  background-image: url("~/assets/img/onetime-logo-v3-xl.svg");
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;

app/pages/posts/[slug].vue

@@ -4,8 +4,6 @@ import type { BlogPost } from '~/types';
 import { format } from 'date-fns'
 import { enUS } from 'date-fns/locale'
 
-
-
 const route = useRoute()
 
 const { data: post } = await useAsyncData(route.path, () => queryContent<BlogPost>(route.path).findOne())
@@ -82,8 +80,19 @@ if (post.value.image?.src) {
         Back to Blog
       </NuxtLink>
     </div>
-    <article class="max-w-3xl mx-auto">
+
+    <article class="max-w-3xl mx-auto prose">
       <header class="mb-12">
+
+          <div v-if="post.image?.src" class="mb-6">
+            <img
+              :src="post.image.src"
+              :alt="post.title"
+              class="w-full rounded-lg shadow-sm object-cover max-h-80 mx-auto"
+              loading="lazy"
+            />
+          </div>
+
         <UBadge
           v-bind="post.badge"
           variant="subtle"
@@ -137,5 +146,6 @@ if (post.value.image?.src) {
         </aside>
       </UPage>
     </article>
+
   </UContainer>
 </template>