webdlh-net/Views/Shared/Partials/_MegaMenu.cshtml

@using InfiniLore.Lucide
@addTagHelper *, InfiniLore.Lucide

<!-- Mega Menu 1: Program -->
<div id="mega-menu-1" class="hidden absolute left-0 w-full bg-white shadow-lg border-t border-gray-200 transition-all duration-300 z-40">
    <div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 md:grid-cols-3 gap-4">
        <div class="space-y-3">
            <a href="@Url.Action("Udara", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
                <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="wind"></i></div>
                <div>
                    <div class="font-medium text-gray-900 hover:text-orange-700">Udara</div>
                    <p class="text-sm text-gray-500">Pengelolaan dan pengawasan kualitas udara.</p>
                </div>
            </a>
            <a href="@Url.Action("Sampah", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
                <div class="bg-orange-100 rounded-full p-2">
                 <i class="w-5 h-5 text-orange-600" data-lucide="trash"></i>
                </div>
                <div>
                    <div class="font-medium text-gray-900 hover:text-orange-700">Sampah</div>
                    <p class="text-sm text-gray-500">Pengawasan kepatuhan lingkungan.</p>
                </div>
            </a>
            <a href="@Url.Action("Anggaran", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
                <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="banknote"></i></div>
                <div>
                    <div class="font-medium text-gray-900 hover:text-orange-700">Anggaran</div>
                    <p class="text-sm text-gray-500">Informasi mengenai anggaran DLH.</p>
                </div>
            </a>
        </div>

        <div class="space-y-3">
            <a href="@Url.Action("Air", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
                <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="droplet"></i></div>
                <div>
                    <div class="font-medium text-gray-900 hover:text-orange-700">Air</div>
                    <p class="text-sm text-gray-500">Pengelolaan dan pelestarian air.</p>
                </div>
            </a>
            <a href="@Url.Action("LKIP", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
                <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="notebook-text"></i></div>
                <div>
                    <div class="font-medium text-gray-900 hover:text-orange-700">LKIP</div>
                    <p class="text-sm text-gray-500">Laporan Kinerja Instansi Pemerintah.</p>
                </div>
            </a>
            <a href="@Url.Action("Pengawasan", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
                <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="eye"></i></div>
                <div>
                    <div class="font-medium text-gray-900 hover:text-orange-700">Pengawasan</div>
                    <p class="text-sm text-gray-500">Komitmen pencapaian kinerja lingkungan.</p>
                </div>
            </a>
        </div>

        <div class="space-y-3">
            <a href="@Url.Action("PerjanjianKinerja", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
                <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="file-text"></i></div>
                <div>
                    <div class="font-medium text-gray-900 hover:text-orange-700">Perjanjian Kinerja</div>
                    <p class="text-sm text-gray-500">Upaya pengelolaan sampah terintegrasi.</p>
                </div>
            </a>
            <a href="@Url.Action("RencanaStrategis", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
                <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="target"></i></div>
                <div>
                    <div class="font-medium text-gray-900 hover:text-orange-700">Rencana Strategis</div>
                    <p class="text-sm text-gray-500">Dokumen perencanaan strategis DLH.</p>
                </div>
            </a>
        </div>
    </div>
</div>

<partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu2-Profil.cshtml" />
<partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu3-PublikasiData.cshtml" />
<partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu4-Layanan.cshtml" />
<partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu5-SeputarDLH.cshtml" />