style: Improve PostList spacing with centered layout and add Footer component

- Center-align PostList items for better visual balance
- Add new Footer component
- Update Index page layout

Author: letam

app/src/components/Footer.tsx

@@ -0,0 +1,12 @@
+export default function Footer() {
+  return (
+    <div className="my-8 max-w-2xl mx-auto px-4">
+      <p className="text-sm text-gray-500 text-center">
+        Made 🪷 with 💩 by{" "}
+        <a href="https://github.com/letam" target="_blank" rel="noopener noreferrer">
+          letam
+        </a>
+      </p>
+    </div>
+  );
+}

app/src/components/PostList.tsx

@@ -22,7 +22,7 @@ export default function PostList(): ReactElement {
   }
 
   return (
-    <div>
+    <div className="mt-4 max-w-2xl mx-auto px-4">
       {data?.map((post) => (
         <Post key={`PostCard-${getIdFromRecord(post)}`} post={post} />
       ))}

app/src/pages/Index.tsx

@@ -4,6 +4,7 @@ import PostList from "../components/PostList";
 import PostForm from "../components/PostForm";
 import Header from "../components/Header";
 import Head from "../components/Head";
+import Footer from "../components/Footer";
 
 export default function Index(): ReactElement {
   return (
@@ -14,6 +15,7 @@ export default function Index(): ReactElement {
         <PostForm />
       </div>
       <PostList />
+      <Footer />
     </>
   );
 }