commit dc17409fe6a25081c455635eb6c0f62e330fc6fa
Author: Muhammad.haekal Rahmatullah <haekalrahmatullah36@gmail.com>
Date:   Tue Nov 3 08:41:23 2026 -0500

    Upload files to "/"

diff --git a/Gallery.tsx b/Gallery.tsx
new file mode 100644
index 0000000..b505cd4
--- /dev/null
+++ b/Gallery.tsx
@@ -0,0 +1,25 @@
+import Image from 'next/image';
+
+export default function GalleryPage() {
+  const photos = [
+    { src: '/images/Ka.1-2.3-4 Argo Bromo Anggrek.jpg', caption: 'THE KINGDOM OF NORTHERN LINE' },
+    { src: '/images/Ka 5-6 Argo Semeru.jpg', caption: 'THE KINGDOM OF SOUTHERN LINE' },
+    { src: '/images/Ka 7-8 Bima Argo Bima.jpg', caption: 'THE KINGDOM OF SOUTHERN Biru Malam LINE' },
+  ];
+
+  return (
+    <section className="space-y-8">
+      <h1 className="text-3xl font-bold border-b border-zinc-800 pb-2">Galeri Foto</h1>
+      <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6">
+        {photos.map((item, index) => (
+          <div key={index} className="bg-zinc-900 border border-zinc-800 rounded-lg overflow-hidden p-2">
+            <div className="h-56 relative rounded-md overflow-hidden">
+              <Image src={item.src} alt={item.caption} fill className="object-cover" />
+            </div>
+            <p className="text-center text-sm text-zinc-400 mt-3">{item.caption}</p>
+          </div>
+        ))}
+      </div>
+    </section>
+  );
+}
\ No newline at end of file
diff --git a/page.tsx b/page.tsx
new file mode 100644
index 0000000..5af9427
--- /dev/null
+++ b/page.tsx
@@ -0,0 +1,169 @@
+export default function AboutPage() {
+  return (
+    <section className="space-y-8">
+      <h1 className="text-3xl font-bold border-b border-zinc-800 pb-2">
+        About Me - Pecinta Kereta Api
+      </h1>
+
+      <div className="space-y-4 text-zinc-300">
+        <p>
+          Halo! Saya adalah seorang pecinta kereta api Indonesia,
+          khususnya kereta api kelas eksekutif yang melayani
+          perjalanan Surabaya - Jakarta.
+        </p>
+
+        <p>
+          Saya sangat menyukai dunia perkeretaapian Indonesia,
+          mulai dari lokomotif, rangkaian kereta, fasilitas
+          perjalanan, stasiun, hingga perkembangan teknologi
+          transportasi kereta api.
+        </p>
+
+        {/* Kereta Api Favorit */}
+        <div className="space-y-2">
+          <h2 className="text-xl font-semibold text-white">
+            Kereta Api Favorit Surabaya - Jakarta
+          </h2>
+
+          <ul className="list-disc list-inside text-zinc-400 space-y-2">
+            <li>
+              <strong className="text-white">
+                KA 1,2,3,4 Argo Bromo Anggrek
+              </strong>
+              {" "} - Kereta api kelas Eksekutif & Compartment Suites Batch 2 yang melayani
+              perjalanan Surabaya Pasarturi - Jakarta Gambir via Semarang Tawang.
+            </li>
+
+            <li>
+              <strong className="text-white">
+                KA 5-6 Argo Semeru
+              </strong>
+              {" "} - Kereta api kelas Eksekutif & Compartment Suites Batch 1 relasi
+              Surabaya Gubeng - Jakarta Gambir via Yogyakarta.
+            </li>
+
+            <li>
+              <strong className="text-white">
+                KA 7-8 Bima
+              </strong>
+              {" "} - Kereta api kelas Eksekutif & Compartment Suites Batch 1 dengan
+              perjalanan Surabaya Gubeng - Jakarta Gambir via Yogyakarta.
+            </li>
+          </ul>
+        </div>
+
+        {/* Kegiatan Favorit */}
+        <div className="space-y-2">
+          <h2 className="text-xl font-semibold text-white">
+            Kegiatan Favorit
+          </h2>
+
+          <ol className="list-decimal list-inside text-zinc-400 space-y-1">
+            <li>Menonton perjalanan kereta api.</li>
+            <li>Berburu foto dan video kereta api (Trainspotting).</li>
+            <li>Mengoleksi informasi jadwal perjalanan kereta api.</li>
+            <li>Mencoba perjalanan kereta api jarak jauh.</li>
+            <li>Mengikuti perkembangan KAI Indonesia.</li>
+          </ol>
+        </div>
+
+        {/* Tabel Kereta Api */}
+        <div className="space-y-2 pt-4">
+          <h2 className="text-xl font-semibold text-white">
+            Daftar Kereta Api Favorit
+          </h2>
+
+          <div className="overflow-x-auto">
+            <table className="w-full text-left border-collapse border border-zinc-800">
+              <thead>
+                <tr className="bg-zinc-900 text-white">
+                  <th className="border border-zinc-800 px-4 py-2">
+                    No.
+                  </th>
+                  <th className="border border-zinc-800 px-4 py-2">
+                    Nama Kereta
+                  </th>
+                  <th className="border border-zinc-800 px-4 py-2">
+                    Relasi
+                  </th>
+                  <th className="border border-zinc-800 px-4 py-2">
+                    Kelas
+                  </th>
+                </tr>
+              </thead>
+
+              <tbody className="text-zinc-400">
+                <tr>
+                  <td className="border border-zinc-800 px-4 py-2">1</td>
+                  <td className="border border-zinc-800 px-4 py-2">
+                    Argo Bromo Anggrek
+                  </td>
+                  <td className="border border-zinc-800 px-4 py-2">
+                    Surabaya Pasarturi - Jakarta Gambir via Semarang Tawang
+                  </td>
+                  <td className="border border-zinc-800 px-4 py-2">
+                    Eksekutif & Compartment Suites Batch 2
+                  </td>
+                </tr>
+
+                <tr>
+                  <td className="border border-zinc-800 px-4 py-2">2</td>
+                  <td className="border border-zinc-800 px-4 py-2">
+                    Argo Semeru
+                  </td>
+                  <td className="border border-zinc-800 px-4 py-2">
+                    Surabaya Gubeng - Jakarta Gambir via Yogyakarta
+                  </td>
+                  <td className="border border-zinc-800 px-4 py-2">
+                    Eksekutif & Compartment Suites Batch 1 
+                  </td>
+                </tr>
+
+                <tr>
+                  <td className="border border-zinc-800 px-4 py-2">3</td>
+                  <td className="border border-zinc-800 px-4 py-2">
+                    Bima
+                  </td>
+                  <td className="border border-zinc-800 px-4 py-2">
+                    Surabaya Gubeng - Jakarta Gambir via Yogyakarta
+                  </td>
+                  <td className="border border-zinc-800 px-4 py-2">
+                    Eksekutif & Compartment Suites Batch 1
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+
+        {/* Semboyan */}
+        <div className="pt-4 space-y-2">
+          <h2 className="text-xl font-semibold text-white">
+            Motto Pecinta Kereta Api
+          </h2>
+
+          <blockquote className="border-l-4 border-red-600 pl-4 italic text-zinc-400">
+            "Kereta Api Bukan Sekadar Transportasi,
+            Tetapi Juga Perjalanan, Pengalaman, dan Kebanggaan
+            Perkeretaapian Indonesia."
+          </blockquote>
+        </div>
+
+        {/* External Link */}
+        <div className="pt-4">
+          <p className="text-sm">
+            Informasi resmi perkeretaapian Indonesia:{" "}
+            <a
+              href="https://www.kai.id/"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-blue-400 underline hover:text-blue-300"
+            >
+              PT Kereta Api Indonesia (Persero)
+            </a>
+          </p>
+        </div>
+      </div>
+    </section>
+  );
+}