Adding featured image to blog post

src/templates/post-default.js

@@ -31,9 +31,17 @@ class PostDefault extends Component {
           ]}
         />
         <main className="container mx-auto p-4 max-w-lg sm:p-10">
-          <h1>{data.wordpressPost.title}</h1>
+          <img
+            className="w-full rounded"
+            src={
+              data.wordpressPost.featured_media
+                ? data.wordpressPost.featured_media.source_url
+                : ''
+            }
+          />
+          <h1 className="mt-4">{data.wordpressPost.title}</h1>
           <div
-            className="leading-normal blog-post"
+            className="leading-normal blog-post font-serif"
             dangerouslySetInnerHTML={{
               __html: data.wordpressPost.content,
             }}
@@ -55,6 +63,10 @@ export const query = graphql`
       title
       slug
       content
+      date(formatString: "MMMM DD, YYYY")
+      featured_media {
+        source_url
+      }
     }
   }
 `