[#520] Redesign footer to match Dropcast style

e2e/navigation.spec.ts

@@ -18,13 +18,13 @@ test.describe("Navigation", () => {
     await expect(page).toHaveURL("/create");
   });
 
-  test("Footer renders with PlotLink branding", async ({ page }) => {
+  test("Footer renders with version and credits", async ({ page }) => {
     await page.goto("/");
-    // Footer contains "PlotLink" copyright text
     const footer = page.locator("footer");
     await expect(footer).toBeVisible({ timeout: 10000 });
-    // Verify footer has expected content
-    await expect(footer.getByText(/PlotLink/)).toBeVisible();
+    // Verify footer has version and credits content
+    await expect(footer.getByText(/Base Mainnet/)).toBeVisible();
+    await expect(footer.getByText(/@project7/)).toBeVisible();
   });
 
   test("no console errors on navigation", async ({ page }) => {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "plotlink",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "private": true,
   "workspaces": [
     "packages/*"

src/components/Footer.tsx

@@ -8,36 +8,39 @@ const GITHUB_URL = "https://github.com/realproject7/plotlink-contracts";
 export function Footer() {
   return (
     <footer className="border-t border-[var(--border)] bg-[var(--bg)] px-4 py-6 pb-20 lg:pb-6 mt-16">
-      <div className="mx-auto max-w-5xl flex flex-col gap-4 text-xs">
-        <div className="flex flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-center sm:justify-between sm:gap-4">
-          <div className="flex flex-wrap items-center gap-3 sm:gap-4 text-muted">
-            <a
-              href={CONTRACT_URL}
-              target="_blank"
-              rel="noopener noreferrer"
-              className="hover:text-foreground transition-colors"
-              title={STORY_FACTORY}
-            >
-              contract: {STORY_FACTORY.slice(0, 6)}...{STORY_FACTORY.slice(-4)}
-            </a>
-            <Link href="/token" className="hover:text-foreground transition-colors">
-              $PLOT
-            </Link>
-            <a
-              href={GITHUB_URL}
-              target="_blank"
-              rel="noopener noreferrer"
-              className="hover:text-foreground transition-colors"
-            >
-              github
-            </a>
-          </div>
-          <span className="text-muted">
-            built on <span className="text-accent-dim">Base</span>
-          </span>
+      <div className="mx-auto max-w-5xl flex flex-col items-center gap-4 text-xs">
+        <div className="flex flex-wrap items-center justify-center gap-3 sm:gap-4 text-muted">
+          <a
+            href={CONTRACT_URL}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="hover:text-foreground transition-colors"
+            title={STORY_FACTORY}
+          >
+            contract: {STORY_FACTORY.slice(0, 6)}...{STORY_FACTORY.slice(-4)}
+          </a>
+          <Link href="/token" className="hover:text-foreground transition-colors">
+            $PLOT
+          </Link>
+          <a
+            href={GITHUB_URL}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="hover:text-foreground transition-colors"
+          >
+            github
+          </a>
         </div>
-        <div className="text-muted text-xs">
-          PlotLink &copy; {new Date().getFullYear()} &middot; v{version}
+        <div className="text-muted text-xs text-center">
+          v{version} &middot; Base Mainnet &middot; Made by{" "}
+          <a
+            href="https://farcaster.com/project7"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="hover:text-foreground transition-colors"
+          >
+            @project7
+          </a>
         </div>
       </div>
     </footer>