264 lines
9.4 KiB
Plaintext
264 lines
9.4 KiB
Plaintext
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>@ViewData["Title"] - kehati</title>
|
|
<meta property="og:description" content="Jelajahi flora, fauna, dan lokasi konservasi di Jakarta bersama Dinas Lingkungan Hidup." />
|
|
|
|
<meta property="og:type" content="website" />
|
|
|
|
<meta property="og:site_name" content="Kehati Jakarta" />
|
|
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<script type="importmap"></script>
|
|
<link rel="stylesheet" href="~/css/app.css" />
|
|
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
|
|
<link href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
|
|
</head>
|
|
<body>
|
|
@{
|
|
var currentPath = Context.Request.Path.Value?.ToLower();
|
|
}
|
|
|
|
<header class="sticky top-0 z-40 border-b border-border/60 bg-background/80 backdrop-blur-md">
|
|
<div class="mx-auto flex h-16 max-w-7xl items-center justify-between px-4 sm:px-6 lg:px-8">
|
|
|
|
<!-- Logo -->
|
|
<a asp-controller="Home"
|
|
asp-action="Index"
|
|
class="group flex items-center gap-2.5">
|
|
|
|
<span class="flex h-9 w-9 items-center justify-center rounded-lg bg-primary text-primary-foreground shadow-sm transition-transform group-hover:scale-105">
|
|
|
|
<!-- Lucide Leaf -->
|
|
<i data-lucide="leaf" class="h-5 w-5"></i>
|
|
|
|
</span>
|
|
|
|
<span class="flex flex-col leading-tight">
|
|
<span class="font-serif text-base font-semibold text-foreground">
|
|
Kehati Jakarta
|
|
</span>
|
|
|
|
<span class="text-[10px] uppercase tracking-widest text-muted-foreground">
|
|
Dinas Lingkungan Hidup
|
|
</span>
|
|
</span>
|
|
</a>
|
|
|
|
<!-- Desktop Menu -->
|
|
<nav class="hidden items-center gap-1 md:flex">
|
|
|
|
<a asp-controller="Home"
|
|
asp-action="Index"
|
|
class="rounded-lg px-3.5 py-2 text-sm font-medium transition-colors hover:bg-secondary hover:text-foreground @(currentPath == "/" ? "bg-secondary text-foreground" : "text-muted-foreground")">
|
|
Beranda
|
|
</a>
|
|
|
|
<a asp-controller="Lokasi"
|
|
asp-action="Index"
|
|
class="rounded-lg px-3.5 py-2 text-sm font-medium transition-colors hover:bg-secondary hover:text-foreground @(currentPath != null && currentPath.StartsWith("/lokasi") ? "bg-secondary text-foreground" : "text-muted-foreground")">
|
|
Lokasi
|
|
</a>
|
|
|
|
<a asp-controller="Katalog"
|
|
asp-action="Index"
|
|
class="rounded-lg px-3.5 py-2 text-sm font-medium transition-colors hover:bg-secondary hover:text-foreground @(currentPath != null && currentPath.StartsWith("/katalog") ? "bg-secondary text-foreground" : "text-muted-foreground")">
|
|
Katalog
|
|
</a>
|
|
|
|
<a asp-controller="Tentang"
|
|
asp-action="Index"
|
|
class="rounded-lg px-3.5 py-2 text-sm font-medium transition-colors hover:bg-secondary hover:text-foreground @(currentPath != null && currentPath.StartsWith("/tentang") ? "bg-secondary text-foreground" : "text-muted-foreground")">
|
|
Tentang
|
|
</a>
|
|
|
|
</nav>
|
|
|
|
<!-- Mobile Button -->
|
|
<button id="menuButton"
|
|
class="rounded-lg p-2 text-foreground hover:bg-secondary md:hidden"
|
|
aria-label="Menu">
|
|
|
|
<i data-lucide="menu" id="menuIcon" class="h-5 w-5"></i>
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
<!-- Mobile Menu -->
|
|
<div id="mobileMenu"
|
|
class="hidden border-t border-border/60 bg-background md:hidden">
|
|
|
|
<nav class="flex flex-col p-3">
|
|
|
|
<a asp-controller="Home"
|
|
asp-action="Index"
|
|
class="rounded-lg px-3 py-2.5 text-sm font-medium hover:bg-secondary">
|
|
Beranda
|
|
</a>
|
|
|
|
<a asp-controller="Lokasi"
|
|
asp-action="Index"
|
|
class="rounded-lg px-3 py-2.5 text-sm font-medium hover:bg-secondary">
|
|
Lokasi
|
|
</a>
|
|
|
|
<a asp-controller="Katalog"
|
|
asp-action="Index"
|
|
class="rounded-lg px-3 py-2.5 text-sm font-medium hover:bg-secondary">
|
|
Katalog
|
|
</a>
|
|
|
|
<a asp-controller="Tentang"
|
|
asp-action="Index"
|
|
class="rounded-lg px-3 py-2.5 text-sm font-medium hover:bg-secondary">
|
|
Tentang
|
|
</a>
|
|
|
|
</nav>
|
|
|
|
</div>
|
|
</header>
|
|
@RenderBody()
|
|
<footer class="mt-24 border-t border-border/60 bg-secondary/40">
|
|
<div class="mx-auto max-w-7xl px-4 py-12 sm:px-6 lg:px-8">
|
|
<div class="grid gap-8 md:grid-cols-3">
|
|
|
|
<!-- Brand -->
|
|
<div>
|
|
<div class="flex items-center gap-2.5">
|
|
|
|
<span class="flex h-9 w-9 items-center justify-center rounded-lg bg-primary text-primary-foreground">
|
|
|
|
<i data-lucide="leaf" class="h-5 w-5"></i>
|
|
|
|
</span>
|
|
|
|
<span class="font-serif text-lg font-semibold">
|
|
Kehati Jakarta
|
|
</span>
|
|
|
|
</div>
|
|
|
|
<p class="mt-4 max-w-sm text-sm text-muted-foreground">
|
|
Portal keanekaragaman hayati Jakarta oleh Dinas Lingkungan Hidup DKI Jakarta.
|
|
Menjaga alam untuk generasi berikutnya.
|
|
</p>
|
|
|
|
</div>
|
|
|
|
|
|
<!-- Menu -->
|
|
<div>
|
|
|
|
<h4 class="text-sm font-semibold text-foreground">
|
|
Jelajahi
|
|
</h4>
|
|
|
|
<ul class="mt-4 space-y-2 text-sm text-muted-foreground">
|
|
|
|
<li>
|
|
<a asp-controller="Home"
|
|
asp-action="Index"
|
|
class="hover:text-foreground">
|
|
Beranda
|
|
</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a asp-controller="Lokasi"
|
|
asp-action="Index"
|
|
class="hover:text-foreground">
|
|
Lokasi
|
|
</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a asp-controller="Katalog"
|
|
asp-action="Index"
|
|
class="hover:text-foreground">
|
|
Katalog
|
|
</a>
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
|
|
<!-- Kontak -->
|
|
<div>
|
|
|
|
<h4 class="text-sm font-semibold text-foreground">
|
|
Kontak
|
|
</h4>
|
|
|
|
<ul class="mt-4 space-y-2 text-sm text-muted-foreground">
|
|
|
|
<li>
|
|
Dinas Lingkungan Hidup DKI Jakarta
|
|
</li>
|
|
|
|
<li>
|
|
Jl. Mandala V No.67, Jakarta Selatan
|
|
</li>
|
|
|
|
<li>
|
|
lingkunganhidup.jakarta.go.id
|
|
</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
<!-- Copyright -->
|
|
<div class="mt-10 border-t border-border/60 pt-6 text-xs text-muted-foreground">
|
|
|
|
© @DateTime.Now.Year
|
|
Dinas Lingkungan Hidup DKI Jakarta.
|
|
Seluruh hak cipta dilindungi.
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</footer>
|
|
<script src="~/lib/jquery/dist/jquery.min.js"></script>
|
|
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="~/js/site.js" asp-append-version="true"></script>
|
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
|
|
<script src="https://unpkg.com/lucide@latest"></script>
|
|
<script>
|
|
const btn = document.getElementById('menuButton');
|
|
const menu = document.getElementById('mobileMenu');
|
|
const icon = document.getElementById('menuIcon');
|
|
|
|
btn.addEventListener('click', () => {
|
|
|
|
menu.classList.toggle('hidden');
|
|
|
|
if (menu.classList.contains('hidden')) {
|
|
icon.setAttribute('data-lucide', 'menu');
|
|
} else {
|
|
icon.setAttribute('data-lucide', 'x');
|
|
}
|
|
|
|
lucide.createIcons();
|
|
});
|
|
|
|
lucide.createIcons();
|
|
</script>
|
|
@await RenderSectionAsync("Scripts", required: false)
|
|
</body>
|
|
</html>
|