modified PostCarousel to use grid, among other things

frontend/components/PostCarousel.tsx

@@ -6,12 +6,12 @@ interface PostOpts {
 
 export const PostCarousel = function PostCarousel({ posts }: PostOpts) {
   return (
-    <div class="post-carousel flex flex-col items-center justify-between bg-[#313244]">
-      <div class="flex items-center justify-center">
-        <div class="flex space-x-4">
-          {posts.map((post: Post) => {
-            return <PostCard post={post} />;
-          })}
+    <div className="flex w-full bg-[#313244] p-8">
+      <div className="items-center justify-center">
+        <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 max-w-7xl w-full">
+          {posts.map((post: Post) => (
+            <PostCard key={post.post_id} post={post} />
+          ))}
         </div>
       </div>
     </div>