fix: Perbaikan UI Landing Page Merah Putih, Tombol Back, dan Fix Data GeoJSON

2026-06-11 14:48:29 +07:00
parent d77596f62b
commit 7a6d552bad
7 changed files with 3417 additions and 5 deletions
@@ -4,7 +4,81 @@
 // ============================================================
 session_start();

-$modul = $_GET['modul'] ?? 'utuh';
+$modul = $_GET['modul'] ?? null;
+
+if (!$modul) {
+    ?>
+    <!DOCTYPE html>
+    <html lang="id">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>Pilih Project Kelas - WebGIS Publik</title>
+        <script src="https://cdn.tailwindcss.com"></script>
+        <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700;800&display=swap" rel="stylesheet">
+        <style>
+            body { font-family: 'Plus Jakarta Sans', sans-serif; }
+            .bg-map {
+                background-image: url('assets/img/map-bg.png');
+                background-size: cover;
+                background-position: center;
+            }
+        </style>
+    </head>
+    <body class="bg-white min-h-screen flex items-center justify-center bg-map relative">
+        <div class="absolute inset-0 bg-white/90 backdrop-blur-md"></div>
+        
+        <div class="relative z-10 max-w-5xl w-full px-6 py-12">
+            <div class="text-center mb-12">
+                <h1 class="text-4xl md:text-5xl font-extrabold text-rose-700 mb-4 tracking-tight drop-shadow-sm">
+                    Pusat Informasi Geospasial
+                </h1>
+                <p class="text-slate-600 text-lg max-w-2xl mx-auto font-medium">
+                    Akses publik untuk mengeksplorasi, menambahkan, dan mengedit data pada 3 modul utama WebGIS.
+                </p>
+            </div>
+
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                <!-- SPBU -->
+                <a href="?modul=spbu" class="group relative bg-white border-2 border-rose-100 p-8 rounded-3xl transition-all duration-300 hover:-translate-y-2 hover:shadow-[0_20px_40px_-15px_rgba(225,29,72,0.3)] hover:border-rose-400">
+                    <div class="w-16 h-16 bg-rose-50 text-rose-600 rounded-2xl flex items-center justify-center text-3xl mb-6 group-hover:bg-rose-600 group-hover:text-white transition-colors duration-300 shadow-sm border border-rose-100">⛽</div>
+                    <h2 class="text-2xl font-bold mb-3 text-slate-800 group-hover:text-rose-700 transition-colors">Peta Lokasi SPBU</h2>
+                    <p class="text-slate-500 text-sm leading-relaxed font-medium">
+                        Manajemen dan pemetaan titik lokasi SPBU di seluruh wilayah, beserta informasi layanan 24 jam.
+                    </p>
+                </a>
+
+                <!-- Tematik -->
+                <a href="?modul=tematik" class="group relative bg-white border-2 border-rose-100 p-8 rounded-3xl transition-all duration-300 hover:-translate-y-2 hover:shadow-[0_20px_40px_-15px_rgba(225,29,72,0.3)] hover:border-rose-400">
+                    <div class="w-16 h-16 bg-rose-50 text-rose-600 rounded-2xl flex items-center justify-center text-3xl mb-6 group-hover:bg-rose-600 group-hover:text-white transition-colors duration-300 shadow-sm border border-rose-100">🗺️</div>
+                    <h2 class="text-2xl font-bold mb-3 text-slate-800 group-hover:text-rose-700 transition-colors">Peta Tematik</h2>
+                    <p class="text-slate-500 text-sm leading-relaxed font-medium">
+                        Visualisasi batas wilayah kecamatan, jaringan sungai besar, dan hierarki jaringan jalan.
+                    </p>
+                </a>
+
+                <!-- Digitasi -->
+                <a href="?modul=digitasi" class="group relative bg-white border-2 border-rose-100 p-8 rounded-3xl transition-all duration-300 hover:-translate-y-2 hover:shadow-[0_20px_40px_-15px_rgba(225,29,72,0.3)] hover:border-rose-400">
+                    <div class="w-16 h-16 bg-rose-50 text-rose-600 rounded-2xl flex items-center justify-center text-3xl mb-6 group-hover:bg-rose-600 group-hover:text-white transition-colors duration-300 shadow-sm border border-rose-100">📐</div>
+                    <h2 class="text-2xl font-bold mb-3 text-slate-800 group-hover:text-rose-700 transition-colors">Digitasi Lahan</h2>
+                    <p class="text-slate-500 text-sm leading-relaxed font-medium">
+                        Fitur penggambaran poligon parsil tanah dan garis jalan secara interaktif layaknya petugas.
+                    </p>
+                </a>
+            </div>
+            
+            <div class="mt-16 text-center text-slate-400 text-sm font-semibold tracking-wide">
+                &copy; 2026 WebGIS PENGENTASAN KEMISKINAN
+            </div>
+        </div>
+    </body>
+    </html>
+    <?php
+    exit;
+}
+
+// Lanjut jika modul sudah dipilih (spbu/tematik/digitasi)
+

 // Aplikasi Publik (Tidak butuh login)
 $currentUser = 'Pengunjung Publik';
@@ -167,10 +241,10 @@ $spbuTidak  = $totalSPBU - $spbu24;
 ============================================================ -->
 <aside class="sidebar" id="sidebar">
    <div class="sidebar-top-sticky" id="sidebarSticky">
-        <div class="btn-back-dashboard" style="display:flex;align-items:center;gap:8px;padding:12px 16px;color:#e11d48;background:rgba(225,29,72,0.03);text-decoration:none;border-bottom:1px solid rgba(225,29,72,0.1);font-size:0.85rem;font-weight:700;">
-            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path></svg>
-            Project Kelas Publik
-        </div>
+        <a href="index.php" class="btn-back-dashboard" style="display:flex;align-items:center;gap:8px;padding:12px 16px;color:#e11d48;background:rgba(225,29,72,0.03);text-decoration:none;border-bottom:1px solid rgba(225,29,72,0.1);font-size:0.85rem;font-weight:700;transition:all 0.3s;" title="Kembali ke Menu Utama">
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M19 12H5M12 19l-7-7 7-7"/></svg>
+            Kembali ke Menu Utama
+        </a>

        <!-- Header Sidebar -->
        <div class="sidebar-header">