Upload perdana untuk deploy

2026-06-11 13:17:31 +07:00
parent 5857b15aec
commit 72133d0a9a
63 changed files with 10057 additions and 457 deletions
@@ -0,0 +1,116 @@
+import Image from "next/image"
+import { LoginForm } from "@/components/login-form"
+
+export default function Page() {
+  return (
+    <main className="flex min-h-svh w-full">
+      {/* Left: hero / map */}
+      <section className="relative hidden w-1/2 overflow-hidden lg:block">
+        <Image
+          src="/images/map-bg.png"
+          alt="Visualisasi peta analisis spasial"
+          fill
+          priority
+          className="object-cover"
+        />
+        {/* Layered red overlay for elegant depth */}
+        <div
+          aria-hidden
+          className="absolute inset-0 bg-gradient-to-br from-[oklch(0.42_0.2_27/0.85)] via-[oklch(0.32_0.15_25/0.8)] to-[oklch(0.18_0.06_25/0.92)]"
+        />
+        {/* Fine grid texture */}
+        <div
+          aria-hidden
+          className="absolute inset-0 opacity-[0.06]"
+          style={{
+            backgroundImage:
+              "linear-gradient(to right, white 1px, transparent 1px), linear-gradient(to bottom, white 1px, transparent 1px)",
+            backgroundSize: "52px 52px",
+          }}
+        />
+
+        {/* Content */}
+        <div className="relative z-10 flex h-full flex-col justify-between p-12 xl:p-16">
+          {/* Top badge */}
+          <div className="flex items-center gap-2.5">
+            <div className="flex h-9 w-9 items-center justify-center rounded-xl bg-white/15 backdrop-blur-sm ring-1 ring-white/25">
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                className="h-5 w-5 text-white"
+                stroke="currentColor"
+                strokeWidth="2"
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                aria-hidden
+              >
+                <path d="M12 21s-7-5.6-7-11a7 7 0 1 1 14 0c0 5.4-7 11-7 11Z" />
+                <circle cx="12" cy="10" r="2.5" />
+              </svg>
+            </div>
+            <span className="font-heading text-sm font-bold tracking-wide text-white">
+              WebGIS Geospasial
+            </span>
+          </div>
+
+          {/* Headline */}
+          <div className="relative max-w-xl">
+            {/* glowing radial gradient behind headline */}
+            <div
+              aria-hidden
+              className="pointer-events-none absolute -left-10 top-8 -z-10 h-72 w-[34rem] -translate-y-4"
+              style={{
+                background:
+                  "radial-gradient(closest-side, rgba(255,255,255,0.32), rgba(255,120,120,0.12), transparent)",
+                filter: "blur(8px)",
+              }}
+            />
+            <div className="mb-5 inline-flex items-center gap-2 rounded-full bg-white/12 px-3.5 py-1.5 text-xs font-semibold text-white/90 ring-1 ring-white/20 backdrop-blur-sm">
+              <span className="h-1.5 w-1.5 rounded-full bg-white" />
+              Platform Analisis Data Spasial
+            </div>
+            <h1 className="font-heading text-4xl font-extrabold leading-[1.1] tracking-tight text-white text-balance xl:text-5xl">
+              Analisis Spasial Pengentasan Kemiskinan
+            </h1>
+            <p className="mt-5 max-w-md text-base leading-relaxed text-white/80 text-pretty">
+              Petakan, pantau, dan analisis indikator kemiskinan secara geospasial untuk
+              pengambilan keputusan kebijakan yang tepat sasaran dan berbasis data.
+            </p>
+
+            {/* Mini stats */}
+            <div className="mt-10 grid grid-cols-3 gap-4 border-t border-white/15 pt-7">
+              {[
+                { v: "514", l: "Kabupaten/Kota" },
+                { v: "34", l: "Provinsi" },
+                { v: "99.9%", l: "Akurasi Data" },
+              ].map((s) => (
+                <div key={s.l}>
+                  <p className="font-heading text-2xl font-bold text-white">{s.v}</p>
+                  <p className="mt-1 text-xs font-medium text-white/65">{s.l}</p>
+                </div>
+              ))}
+            </div>
+          </div>
+
+          <p className="text-xs font-medium text-white/55">
+            Data terintegrasi · Pembaruan berkala · Aman &amp; terenkripsi
+          </p>
+        </div>
+      </section>
+
+      {/* Right: form */}
+      <section className="relative flex w-full items-center justify-center bg-background px-6 py-12 sm:px-10 lg:w-1/2">
+        {/* soft ambient accents */}
+        <div
+          aria-hidden
+          className="pointer-events-none absolute right-0 top-0 h-72 w-72 rounded-full bg-primary/8 blur-3xl"
+        />
+        <div
+          aria-hidden
+          className="pointer-events-none absolute bottom-0 left-0 h-72 w-72 rounded-full bg-accent/40 blur-3xl"
+        />
+        <LoginForm />
+      </section>
+    </main>
+  )
+}