HeroKyou/webgis_geospesial
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update UI Login dan Perbaikan Routing

Browse Source
This commit is contained in:
Rayhan NuerJamman
2026-06-11 14:17:09 +07:00
parent 02563d05d5
commit 4cbbd3c718
3 changed files with 151 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dashboard.php
+21
View File
@@ -105,6 +105,27 @@ $username = $_SESSION['username'] ?? 'User';
</p>
</div>
<!-- TAHAP 3: Buka Peta Analisis Kemiskinan Banner -->
<div class="mb-8 overflow-hidden rounded-3xl border border-rose-200/50 bg-gradient-to-r from-rose-500 via-primary to-rose-700 shadow-xl shadow-primary/20 relative">
<div class="absolute inset-0 bg-[url('assets/img/map-bg.png')] opacity-10 bg-cover bg-center mix-blend-overlay"></div>
<div class="absolute -right-20 -top-20 h-64 w-64 rounded-full bg-white/10 blur-3xl"></div>
<div class="relative z-10 flex flex-col md:flex-row items-center justify-between p-6 md:p-8 gap-6">
<div class="text-white text-center md:text-left">
<h2 class="text-2xl md:text-3xl font-extrabold font-heading mb-2 flex items-center gap-2 justify-center md:justify-start">
<svg viewBox="0 0 24 24" fill="none" class="h-7 w-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 22s-8-4-8-10V5l8-3 8 3v7c0 6-8 10-8 10z"></path></svg>
Aplikasi Kemiskinan Privat
</h2>
<p class="text-rose-100 font-medium text-sm md:text-base max-w-xl">
Akses eksklusif Admin & Petugas Lapangan. Kelola data spasial penduduk miskin, evaluasi program bantuan, dan update wilayah.
</p>
</div>
<a href="index.php?modul=bantuan" class="flex-shrink-0 group flex items-center justify-center gap-2 rounded-2xl bg-white text-primary px-8 py-4 font-bold shadow-lg transition-all hover:bg-rose-50 hover:scale-105 hover:shadow-xl active:scale-95 text-lg">
Buka Peta Analisis Kemiskinan
<svg viewBox="0 0 24 24" fill="none" class="h-5 w-5 transition-transform group-hover:translate-x-1" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>
</a>
</div>
</div>
<!-- Modules Grid -->
<div class="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3">
index.php
+27 -8
View File
@@ -4,16 +4,26 @@
// ============================================================
session_start();
// Cek apakah sudah login
if (!isset($_SESSION['user_id'])) {
header('Location: login.php');
exit;
}
$currentUser = $_SESSION['username'];
$currentRole = $_SESSION['role'];
$modul = $_GET['modul'] ?? 'utuh';
// TAHAP 1: Modul publik diizinkan tanpa login
$public_modules = ['spbu', 'tematik', 'digitasi'];
$is_public_access = in_array($modul, $public_modules);
if ($is_public_access) {
// Jika akses publik, berikan role petugas agar pengunjung dapat mengedit data
$currentUser = $_SESSION['username'] ?? 'Pengunjung Kelas';
$currentRole = $_SESSION['role'] ?? 'petugas';
} else {
// Modul privat wajib login
if (!isset($_SESSION['user_id'])) {
header('Location: login.php');
exit;
}
$currentUser = $_SESSION['username'];
$currentRole = $_SESSION['role'];
}
include 'koneksi.php';
// Eksekusi ALTER TABLE secara diam-diam jika kolom belum ada
@@ -170,10 +180,17 @@ $spbuTidak = $totalSPBU - $spbu24;
============================================================ -->
<aside class="sidebar" id="sidebar">
<div class="sidebar-top-sticky" id="sidebarSticky">
<?php if (!isset($_SESSION['user_id'])): ?>
<a href="login.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);transition:all 0.3s;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="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"></path></svg>
Masuk Aplikasi Kemiskinan
</a>
<?php else: ?>
<a href="dashboard.php" class="btn-back-dashboard" style="display:flex;align-items:center;gap:8px;padding:12px 16px;color:var(--sidebar-text);text-decoration:none;border-bottom:1px solid var(--sidebar-border);transition:all 0.3s;font-size:0.85rem;font-weight:600;">
<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 Dashboard
</a>
<?php endif; ?>
<!-- Header Sidebar -->
<div class="sidebar-header">
@@ -218,6 +235,7 @@ $modulTitle = $modulNames[$modul] ?? 'Analisis Spasial';
<span class="user-role"><?= ucfirst($currentRole) ?></span>
</div>
</div>
<?php if (isset($_SESSION['user_id'])): ?>
<a href="logout.php" class="btn-logout" title="Logout">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/>
@@ -225,6 +243,7 @@ $modulTitle = $modulNames[$modul] ?? 'Analisis Spasial';
<line x1="21" y1="12" x2="9" y2="12"/>
</svg>
</a>
<?php endif; ?>
</div>
login.php
+103 -141
View File
@@ -109,173 +109,135 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
</script>
<?php endif; ?>
<main class="flex h-screen w-full overflow-hidden bg-background font-sans text-foreground">
<!-- Left: hero / map -->
<section class="relative hidden w-1/2 overflow-hidden lg:block">
<img src="assets/img/map-bg.png" alt="Visualisasi peta analisis spasial" class="absolute inset-0 object-cover w-full h-full" onerror="this.src='https://images.unsplash.com/photo-1524661135-423995f22d0b?q=80&w=2074&auto=format&fit=crop'" />
<div aria-hidden="true" class="absolute inset-0 bg-gradient-to-br from-red-900/85 via-red-800/80 to-rose-900/90"></div>
<div aria-hidden="true" class="absolute inset-0 opacity-[0.06]" style="background-image: linear-gradient(to right, white 1px, transparent 1px), linear-gradient(to bottom, white 1px, transparent 1px); background-size: 52px 52px;"></div>
<main class="relative flex h-screen w-full items-center justify-center overflow-hidden font-sans text-foreground">
<!-- Full Screen Background Map -->
<img src="assets/img/map-bg.png" alt="Visualisasi peta analisis spasial" class="absolute inset-0 object-cover w-full h-full" onerror="this.src='https://images.unsplash.com/photo-1524661135-423995f22d0b?q=80&w=2074&auto=format&fit=crop'" />
<div aria-hidden="true" class="absolute inset-0 bg-gradient-to-br from-red-900/90 via-red-950/80 to-black/90"></div>
<div aria-hidden="true" class="absolute inset-0 opacity-10" style="background-image: linear-gradient(to right, white 1px, transparent 1px), linear-gradient(to bottom, white 1px, transparent 1px); background-size: 52px 52px;"></div>
<div class="relative z-10 flex h-full flex-col justify-between p-12 xl:p-16">
<div class="flex items-center gap-2.5">
<div class="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" class="h-5 w-5 text-white" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<!-- Giant Card Container -->
<div class="relative z-10 flex w-[90%] max-w-5xl flex-col lg:flex-row overflow-hidden rounded-[2rem] border border-white/20 bg-white/10 shadow-2xl backdrop-blur-xl">
<!-- LEFT SECTION: Public Access -->
<div class="flex flex-col justify-between p-8 lg:w-1/2 lg:p-12">
<!-- Top / Brand -->
<div class="mb-8">
<div class="mb-4 flex h-12 w-12 items-center justify-center rounded-xl bg-white/15 ring-1 ring-white/30">
<svg viewBox="0 0 24 24" fill="none" class="h-6 w-6 text-white" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<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>
<div>
<h1 class="font-heading text-sm font-bold tracking-wide text-white shadow-sm">WebGIS Geospasial</h1>
<p class="text-[11px] font-medium text-white/70 uppercase tracking-wider">Kementerian Analisis Spasial</p>
</div>
</div>
<div>
<h2 class="font-heading text-4xl font-bold leading-tight tracking-tight text-white xl:text-5xl">
Sistem Informasi <br> Geografis <span class="text-rose-200">Terpadu</span>
</h2>
<p class="mt-4 max-w-md leading-relaxed text-rose-100/90 text-sm xl:text-base">
Platform pemetaan cerdas untuk analisis spasial persebaran infrastruktur, demografi kemiskinan, dan evaluasi penyaluran bantuan secara real-time.
<h1 class="font-heading text-2xl font-bold tracking-tight text-white lg:text-3xl">WebGIS Geospasial</h1>
<p class="mt-2 text-sm leading-relaxed text-white/80">
Platform pemetaan cerdas untuk analisis spasial persebaran infrastruktur dan demografi kemiskinan.
</p>
</div>
</div>
</section>
<!-- Right: Login Form -->
<section class="flex w-full lg:w-1/2 h-full overflow-y-auto p-6">
<div class="w-full max-w-sm sm:max-w-md m-auto">
<!-- Mobile branding -->
<div class="mb-10 flex flex-col items-center gap-3 lg:hidden">
<div class="flex h-12 w-12 items-center justify-center rounded-2xl bg-gradient-to-br from-primary to-rose-700 text-white shadow-md shadow-primary/20">
<svg viewBox="0 0 24 24" fill="none" class="h-6 w-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<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" />
<!-- Bottom / Public Shortcuts -->
<div>
<h2 class="mb-3 flex items-center gap-2 text-sm font-bold text-white/90">
<svg viewBox="0 0 24 24" fill="none" class="h-4.5 w-4.5 text-rose-300" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M2 12h4l2-9 5 18 3-10h4"></path>
</svg>
</div>
<div class="text-center">
<h1 class="font-heading text-lg font-bold text-foreground">WebGIS Geospasial</h1>
<p class="text-xs font-medium text-muted-foreground uppercase tracking-wider">Kementerian Analisis Spasial</p>
Project Kelas (Akses Publik):
</h2>
<div class="flex flex-col gap-3">
<a href="index.php?modul=spbu" class="group flex items-center gap-3 rounded-xl border border-white/10 bg-white/5 px-4 py-3 text-sm font-bold text-white transition-all hover:-translate-y-0.5 hover:border-white/30 hover:bg-white/20">
<span class="text-xl transition-transform group-hover:scale-110">⛽</span>
Peta Lokasi SPBU
</a>
<a href="index.php?modul=tematik" class="group flex items-center gap-3 rounded-xl border border-white/10 bg-white/5 px-4 py-3 text-sm font-bold text-white transition-all hover:-translate-y-0.5 hover:border-white/30 hover:bg-white/20">
<span class="text-xl transition-transform group-hover:scale-110">🗺️</span>
Peta Tematik
</a>
<a href="index.php?modul=digitasi" class="group flex items-center gap-3 rounded-xl border border-white/10 bg-white/5 px-4 py-3 text-sm font-bold text-white transition-all hover:-translate-y-0.5 hover:border-white/30 hover:bg-white/20">
<span class="text-xl transition-transform group-hover:scale-110">📐</span>
Digitasi Lahan Kota
</a>
</div>
</div>
</div>
<!-- Header -->
<div class="mb-8">
<h2 class="font-heading text-2xl font-bold tracking-tight text-foreground sm:text-3xl">Selamat Datang Kembali</h2>
<p class="mt-2 text-sm text-muted-foreground">Silakan masuk menggunakan kredensial Anda untuk melanjutkan ke dashboard.</p>
<!-- RIGHT SECTION: Login Form -->
<div class="flex flex-col justify-center bg-white/95 p-8 lg:w-1/2 lg:p-12">
<div class="mb-6 text-center">
<h2 class="font-heading text-2xl font-bold tracking-tight text-foreground sm:text-3xl">Login Aplikasi Kemiskinan</h2>
<p class="mt-2 text-sm leading-relaxed text-muted-foreground">
Silakan masuk untuk mengakses pusat kendali data kemiskinan, memverifikasi bantuan, dan melihat statistik penduduk miskin.
</p>
</div>
<!-- Card -->
<div class="rounded-2xl border border-white/60 bg-white/70 p-6 shadow-[0_8px_30px_rgb(0,0,0,0.04)] backdrop-blur-xl sm:p-8">
<form action="login.php" method="POST" class="flex flex-col gap-5">
<!-- Input Email / Username -->
<div class="group">
<label for="username" class="mb-1.5 block text-sm font-semibold text-foreground group-focus-within:text-primary transition-colors">
Email atau Username
</label>
<div class="relative">
<div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3.5 text-muted-foreground group-focus-within:text-primary transition-colors">
<svg viewBox="0 0 24 24" fill="none" class="h-4.5 w-4.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"></path>
<circle cx="12" cy="7" r="4"></circle>
</svg>
</div>
<input type="text" id="username" name="username" class="block w-full rounded-xl border border-border bg-white py-2.5 pl-10 pr-3 text-sm text-foreground transition-all focus:outline-none focus-visible:border-primary focus-visible:ring-4 focus-visible:ring-primary/20 hover:border-primary/60" placeholder="admin@domain.com" required autocomplete="username">
<form action="login.php" method="POST" class="flex flex-col gap-4">
<!-- Input Email / Username -->
<div class="group">
<label for="username" class="mb-1 block text-xs font-semibold text-foreground group-focus-within:text-primary transition-colors">Email atau Username</label>
<div class="relative">
<div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-muted-foreground group-focus-within:text-primary transition-colors">
<svg viewBox="0 0 24 24" fill="none" class="h-4.5 w-4.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"></path>
<circle cx="12" cy="7" r="4"></circle>
</svg>
</div>
<input type="text" id="username" name="username" class="block w-full rounded-lg border border-border bg-white py-2 pl-9 pr-3 text-sm transition-all focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 hover:border-primary/60" placeholder="admin" required autocomplete="username">
</div>
</div>
<!-- Input Password -->
<div class="group">
<label for="password" class="mb-1.5 block text-sm font-semibold text-foreground group-focus-within:text-primary transition-colors">
Kata Sandi
</label>
<div class="relative">
<div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3.5 text-muted-foreground group-focus-within:text-primary transition-colors">
<svg viewBox="0 0 24 24" fill="none" class="h-4.5 w-4.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
</svg>
</div>
<input type="password" id="password" name="password" class="block w-full rounded-xl border border-border bg-white py-2.5 pl-10 pr-10 text-sm text-foreground transition-all focus:outline-none focus-visible:border-primary focus-visible:ring-4 focus-visible:ring-primary/20 hover:border-primary/60" placeholder="••••••••" required autocomplete="current-password">
<button type="button" id="togglePassword" class="absolute inset-y-0 right-0 flex items-center pr-3.5 text-muted-foreground hover:text-foreground focus:outline-none" aria-label="Toggle password visibility">
<svg id="eyeIcon" viewBox="0 0 24 24" fill="none" class="h-4.5 w-4.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
<circle cx="12" cy="12" r="3"></circle>
</svg>
</button>
<!-- Input Password -->
<div class="group">
<label for="password" class="mb-1 block text-xs font-semibold text-foreground group-focus-within:text-primary transition-colors">Kata Sandi</label>
<div class="relative">
<div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3 text-muted-foreground group-focus-within:text-primary transition-colors">
<svg viewBox="0 0 24 24" fill="none" class="h-4.5 w-4.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect>
<path d="M7 11V7a5 5 0 0 1 10 0v4"></path>
</svg>
</div>
</div>
<!-- Options -->
<div class="flex items-center justify-between mt-1">
<label class="flex items-center gap-2 cursor-pointer group">
<input type="checkbox" name="remember" class="h-4 w-4 rounded border-border text-primary shadow-sm transition-all focus:ring-primary focus:ring-offset-0 disabled:cursor-not-allowed disabled:opacity-50">
<span class="text-sm font-medium text-muted-foreground group-hover:text-foreground transition-colors">Ingat saya</span>
</label>
<a href="#" class="text-sm font-semibold text-primary transition-colors hover:text-primary/80">
Lupa sandi?
</a>
</div>
<!-- Submit -->
<button type="submit" class="group mt-1 flex h-12 items-center justify-center gap-2 rounded-xl bg-primary text-sm font-semibold text-white shadow-lg shadow-primary/25 transition-all duration-300 hover:-translate-y-0.5 hover:bg-rose-700 hover:shadow-xl hover:shadow-primary/35 active:translate-y-0">
Masuk
<svg class="h-4 w-4 transition-transform duration-300 group-hover:translate-x-1 text-white" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="5" y1="12" x2="19" y2="12"></line>
<polyline points="12 5 19 12 12 19"></polyline>
</svg>
</button>
</form>
<div class="mt-6 text-center text-sm text-muted-foreground">
Belum punya akun? <a href="register.php" class="font-semibold text-primary hover:underline">Daftar sekarang</a>
</div>
<?php if ($show_demo === 1): ?>
<!-- Demo accounts helper -->
<div class="mt-7 rounded-xl border border-border/70 bg-gray-50 p-4">
<div class="mb-3 flex items-center gap-2">
<span class="h-1.5 w-1.5 rounded-full bg-primary"></span>
<p class="text-xs font-bold uppercase tracking-wide text-foreground">Info Akun Demo</p>
<span class="text-[11px] font-medium text-muted-foreground">· klik untuk mengisi</span>
</div>
<div class="flex flex-col gap-1.5">
<button type="button" onclick="fillDemo('admin', 'password')" class="group flex cursor-pointer items-center justify-between gap-3 rounded-lg border border-transparent bg-white/60 px-3 py-2 text-left transition-all hover:border-primary/30 hover:bg-white hover:shadow-sm w-full">
<span class="flex items-center gap-2.5">
<span aria-hidden="true" class="text-sm leading-none">👑</span>
<span class="text-xs font-semibold text-foreground">Admin</span>
</span>
<span class="font-mono text-[11px] text-muted-foreground transition-colors group-hover:text-primary">
admin · password
</span>
</button>
<button type="button" onclick="fillDemo('petugas', 'password')" class="group flex cursor-pointer items-center justify-between gap-3 rounded-lg border border-transparent bg-white/60 px-3 py-2 text-left transition-all hover:border-primary/30 hover:bg-white hover:shadow-sm w-full">
<span class="flex items-center gap-2.5">
<span aria-hidden="true" class="text-sm leading-none">📝</span>
<span class="text-xs font-semibold text-foreground">Petugas</span>
</span>
<span class="font-mono text-[11px] text-muted-foreground transition-colors group-hover:text-primary">
petugas · password
</span>
</button>
<button type="button" onclick="fillDemo('guest', 'password')" class="group flex cursor-pointer items-center justify-between gap-3 rounded-lg border border-transparent bg-white/60 px-3 py-2 text-left transition-all hover:border-primary/30 hover:bg-white hover:shadow-sm w-full">
<span class="flex items-center gap-2.5">
<span aria-hidden="true" class="text-sm leading-none">👁️</span>
<span class="text-xs font-semibold text-foreground">Guest</span>
</span>
<span class="font-mono text-[11px] text-muted-foreground transition-colors group-hover:text-primary">
guest · password
</span>
<input type="password" id="password" name="password" class="block w-full rounded-lg border border-border bg-white py-2 pl-9 pr-9 text-sm transition-all focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20 hover:border-primary/60" placeholder="••••••••" required autocomplete="current-password">
<button type="button" id="togglePassword" class="absolute inset-y-0 right-0 flex items-center pr-3 text-muted-foreground hover:text-foreground focus:outline-none">
<svg id="eyeIcon" viewBox="0 0 24 24" fill="none" class="h-4 w-4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
<circle cx="12" cy="12" r="3"></circle>
</svg>
</button>
</div>
</div>
<?php endif; ?>
<!-- Options -->
<div class="flex items-center justify-between mt-1">
<label class="flex items-center gap-2 cursor-pointer group">
<input type="checkbox" name="remember" class="h-3.5 w-3.5 rounded border-border text-primary shadow-sm focus:ring-primary focus:ring-offset-0">
<span class="text-xs font-medium text-muted-foreground group-hover:text-foreground transition-colors">Ingat saya</span>
</label>
<a href="#" class="text-xs font-semibold text-primary hover:text-primary/80">Lupa sandi?</a>
</div>
<!-- Submit -->
<button type="submit" class="group mt-2 flex h-10 items-center justify-center gap-2 rounded-lg bg-primary text-sm font-bold text-white shadow-md shadow-primary/25 transition-all hover:-translate-y-0.5 hover:bg-rose-700 hover:shadow-lg active:translate-y-0">
Masuk
<svg class="h-4 w-4 transition-transform group-hover:translate-x-1" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>
</button>
</form>
<div class="mt-4 text-center text-xs text-muted-foreground">
Belum punya akun? <a href="register.php" class="font-semibold text-primary hover:underline">Daftar sekarang</a>
</div>
<p class="mt-6 text-center text-xs text-muted-foreground">
&copy; <script>document.write(new Date().getFullYear())</script> WebGIS Geospasial &middot; Kementerian Analisis Spasial
<?php if ($show_demo === 1): ?>
<!-- Inline Demo Accounts -->
<div class="mt-5 flex items-center justify-center gap-2 text-xs">
<span class="font-medium text-muted-foreground">Isi Cepat Demo:</span>
<button type="button" onclick="fillDemo('admin', 'password')" class="rounded bg-rose-100 px-2 py-1 font-semibold text-rose-700 transition hover:bg-rose-200">👑 Admin</button>
<button type="button" onclick="fillDemo('petugas', 'password')" class="rounded bg-slate-100 px-2 py-1 font-semibold text-slate-700 transition hover:bg-slate-200">📝 Petugas</button>
<button type="button" onclick="fillDemo('guest', 'password')" class="rounded bg-slate-100 px-2 py-1 font-semibold text-slate-700 transition hover:bg-slate-200">👁️ Guest</button>
</div>
<?php endif; ?>
<p class="mt-8 text-center text-[10px] text-muted-foreground uppercase tracking-wider">
&copy; <script>document.write(new Date().getFullYear())</script> Kementerian Analisis Spasial
</p>
</div>
</section>
</div>
</main>
<script>