Improve MineGeo interface and functionality

app/about/page.tsx

@@ -1,45 +1,49 @@
+import { getI18n } from "@/lib/i18n";
 import { Header, Footer } from "@/components/Shell";
 import Link from "next/link";
-export default function About() {
+export default async function About() {
+  const { t } = await getI18n();
   return (
     <>
       <Header />
       <main className="section page-content prose">
-        <span className="eyebrow">THE EXPLORER’S FIELD GUIDE</span>
+        <span className="eyebrow">{t("THE EXPLORER’S FIELD GUIDE")}</span>
         <h1>
-          You know this place.
+          {t("You know this place.")}
           <br />
-          <span className="green">Probably.</span>
+          <span className="green">{t("Probably.")}</span>
         </h1>
         <p className="lead">
-          MineGeo drops you into a panorama from a community Minecraft world.
-          Find out where you are before the clock runs out.
+          {t(
+            "MineGeo drops you into a panorama from a community Minecraft world. Find out where you are before the clock runs out.",
+          )}
         </p>
-        <h2>Look for the little things</h2>
+        <h2>{t("Look for the little things")}</h2>
         <p>
-          Drag to look around. Mountains, shorelines, roofs, and landmarks all
-          help. You stay in one place throughout a round.
+          {t(
+            "Drag to look around. Mountains, shorelines, roofs, and landmarks all help. You stay in one place throughout a round.",
+          )}
         </p>
-        <h2>Make your guess</h2>
+        <h2>{t("Make your guess")}</h2>
         <p>
-          Expand the map in the bottom-right corner and click to place a pin.
-          North is up, X increases east, and Z increases south. Move your pin
-          until you’re ready, then submit.
+          {t(
+            "Expand the map in the bottom-right corner and click to place a pin. North is up, X increases east, and Z increases south. Move your pin until you’re ready, then submit.",
+          )}
         </p>
-        <h2>Five chances to find your way</h2>
+        <h2>{t("Five chances to find your way")}</h2>
         <p>
-          Easy gives you 180 seconds, Normal 90, and Hard 30. Hard disables
-          zoom. A timed-out round scores zero; you can still finish the
-          expedition.
+          {t(
+            "Easy gives you 180 seconds, Normal 90, and Hard 30. Hard disables zoom. A timed-out round scores zero; you can still finish the expedition.",
+          )}
         </p>
-        <h2>Closer means better</h2>
+        <h2>{t("Closer means better")}</h2>
         <p>
-          Each round awards up to 5,000 points based on horizontal distance. A
-          guess within one block earns a perfect score. Compare all five guesses
-          at the end.
+          {t(
+            "Each round awards up to 5,000 points based on horizontal distance. A guess within one block earns a perfect score. Compare all five guesses at the end.",
+          )}
         </p>
         <Link href="/servers" className="button primary">
-          Let’s find a world →
+          {t("Let’s find a world →")}
         </Link>
       </main>
       <Footer />