docs: google open source peer bonus

apps/classroomio-com/src/routes/blog/+page.svelte

@@ -26,7 +26,7 @@
   <div class="w-full flex items-center justify-center">
     <ul class="flex flex-col items-start justify-start gap-2 w-[90%] md:w-[50%]">
       {#each data.posts as post}
-        <li class=" py-14 w-full">
+        <li class="py-10 w-full border-b border-gray-200">
           <div class="flex md:flex-row flex-col md:items-center gap-2">
             <!-- Date -->
             <p class="text-sm text-slate-500">{formatDate(post.date)}</p>

apps/classroomio-com/src/routes/blog/[slug]/+page.svelte

@@ -11,6 +11,19 @@
   <title>{data.meta.title} | ClassroomIO Blog</title>
   <meta property="og:type" content="article" />
   <meta property="og:title" content={data.meta.title} />
+
+  <meta property="og:type" content="website" />
+  <meta property="og:image:type" content="image/png" />
+  <meta property="og:image:width" content="1920" />
+  <meta property="og:image:height" content="1080" />
+  <meta property="og:image:secure_url" itemprop="image" content={data.meta.imageUrl} />
+
+  <meta name="twitter:card" content="summary_large_image" />
+  <meta property="twitter:domain" content="classroomio.com" />
+  <meta property="twitter:url" content="https://www.classroomio.com/blog/" />
+  <meta name="twitter:title" content={data.meta.title} />
+  <meta name="twitter:description" content={data.meta.description} />
+  <meta name="twitter:image" content={data.meta.imageUrl} />
 </svelte:head>
 
 <div class=" mt-[10%] md:mt-16">