add styles to article page

pages/posts/[id].js

@@ -15,11 +15,45 @@ export default function Posts({ post }) {
         <meta property="og:description" content={post.metas.description} />
         <meta property="og:image" content={post.metas.image} />
       </Head>
-      <h1>{post.title}</h1>
-      <p>{post.bibliography}</p>
-      <p>{post.categories.name}</p>
-      <p>{moment(post.published).format("llll")}</p>
-      {parse(post.content)}
+
+      <div className="container my-10 mx-auto">
+        <section className="mb-32 text-gray-800">
+          <img
+            src={post.featured_media.large}
+            className="w-3/5 m-auto shadow-lg rounded-lg mb-6 object-cover"
+            alt=""
+          />
+
+          <div className="flex items-center mb-6">
+            <div>
+              <span>
+                {moment(post.published).format("llll")}
+                {post.author && (
+                  <>
+                    <span>
+                      <a href="#!" className="font-medium">
+                        {post.author}
+                      </a>
+                      by{" "}
+                    </span>
+                  </>
+                )}
+              </span>
+            </div>
+          </div>
+
+          <h1 className="font-bold text-3xl mb-6">{post.title}</h1>
+
+          {parse(post.content)}
+
+          {post.bibliography && (
+            <>
+              <h1 className="font-bold text-3xl mb-2 mt-4">Bibliografia</h1>
+              {parse(post.bibliography)}
+            </>
+          )}
+        </section>
+      </div>
     </>
   );
 }