amar
/
webdlh-net
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update Layanan

main
marszayn 2025-06-12 12:49:08 +07:00
parent 854ebf398c
commit 484f048259
38 changed files with 1670 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
Controllers/LayananController.cs
View File

@ -2,8 +2,59 @@ using Microsoft.AspNetCore.Mvc;
namespace MyApp.Namespace
{
[Route("layanan")]
public class LayananController : Controller
{
[HttpGet("amdal")]
public IActionResult Amdal()
{
return View();
}
[HttpGet("ppid")]
public IActionResult Ppid()
{
return View();
}
[HttpGet("ewaste")]
public IActionResult Ewaste()
{
return View();
}
[HttpGet("lab")]
public IActionResult Lab()
{
return View();
}
[HttpGet("bulky-waste")]
public IActionResult BulkyWaste()
{
return View();
}
[HttpGet("bus-toilet")]
public IActionResult BusToilet()
{
return View();
}
[HttpGet("bps-rw")]
public IActionResult Bpsrw()
{
return View();
}
[HttpGet("whistleblowing")]
public IActionResult Whistleblowing()
{
return View();
}
// GET: LayananController
public ActionResult Index()
{

129
Views/Layanan/Amdal.cshtml 100644
View File

@ -0,0 +1,129 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Amdal - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Analisis Mengenai Dampak Lingkungan untuk menilai dan meminimalkan dampak negatif proyek terhadap lingkungan hidup.";
ViewData["Keywords"] = "Amdal, Analisis Mengenai Dampak Lingkungan, Kajian Lingkungan, Izin Lingkungan, Dokumen Lingkungan, UKL-UPL, RKL-RPL, Studi Kelayakan Lingkungan, Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgTitle"] = "Amdal - Analisis Mengenai Dampak Lingkungan | Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Layanan Amdal untuk analisis dampak lingkungan proyek pembangunan. Konsultasi dokumen lingkungan, izin lingkungan, dan studi kelayakan lingkungan di DKI Jakarta.";
ViewData["TwitterTitle"] = "Amdal - Analisis Mengenai Dampak Lingkungan | Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Layanan Amdal untuk analisis dampak lingkungan proyek pembangunan. Konsultasi dokumen lingkungan, izin lingkungan, dan studi kelayakan lingkungan di DKI Jakarta.";
// Breadcumb
ViewData["BreadcrumbText"] = "AMDAL";
ViewData["TitleBeforeHighlight"] = "ANALISIS MENGENAI";
ViewData["TitleHighlight"] = "DAMPAK LINGKUNGAN";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="container mx-auto max-w-6xl py-8">
<!-- Hero Section -->
<div class="text-center py-8">
<h2 class="text-3xl font-bold text-gray-800 mb-4">Layanan AMDAL</h2>
<p class="text-gray-600 max-w-2xl mx-auto leading-relaxed">
Analisis Mengenai Dampak Lingkungan untuk menilai dan meminimalkan dampak negatif proyek terhadap lingkungan hidup
</p>
</div>
<!-- Services Grid -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
<!-- Pengumuman AMDAL -->
<div class="group bg-white rounded-2xl shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 overflow-hidden">
<div class="p-6">
<div class="flex items-center justify-center w-12 h-12 bg-amber-100 rounded-xl mb-4 group-hover:bg-amber-600 transition-colors duration-300">
<i class="w-6 h-6 text-amber-600 group-hover:text-white transition-colors duration-300" data-lucide="badge-info"></i>
</div>
<h5 class="font-semibold text-lg mb-3 text-gray-800">Pengumuman AMDAL</h5>
<p class="text-gray-600 text-sm mb-4 leading-relaxed">Informasi terkini mengenai pengumuman dan pemberitahuan AMDAL</p>
<a href="https://lingkunganhidup.jakarta.go.id/files/amdal/PengumumanAMDAL_PMIKramat081122.pdf" target="_blank" class="block">
<button class="w-full bg-amber-600 hover:bg-amber-700 text-white font-medium py-3 rounded-xl transition-all duration-300 hover:shadow-lg cursor-pointer">
Lihat Detail
</button>
</a>
</div>
</div>
<!-- Konsultasi Online Amdal -->
<div class="group bg-white rounded-2xl shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 overflow-hidden">
<div class="p-6">
<div class="flex items-center justify-center w-12 h-12 bg-amber-100 rounded-xl mb-4 group-hover:bg-amber-600 transition-colors duration-300">
<i class="w-6 h-6 text-amber-600 group-hover:text-white transition-colors duration-300" data-lucide="video"></i>
</div>
<h5 class="font-semibold text-lg mb-3 text-gray-800">Konsultasi Online</h5>
<p class="text-gray-600 text-sm mb-4 leading-relaxed">Layanan konsultasi AMDAL secara online untuk kemudahan akses</p>
<a href="https://lingkunganhidup.jakarta.go.id/files/amdal/PengumumanAMDAL_PMIKramat081122.pdf" target="_blank" class="block">
<button class="w-full bg-amber-600 hover:bg-amber-700 text-white font-medium py-3 rounded-xl transition-all duration-300 hover:shadow-lg">
Mulai Konsultasi
</button>
</a>
</div>
</div>
<!-- Form Registrasi Konsultasi Tatap Muka -->
<div class="group bg-white rounded-2xl shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 overflow-hidden">
<div class="p-6">
<div class="flex items-center justify-center w-12 h-12 bg-amber-100 rounded-xl mb-4 group-hover:bg-amber-600 transition-colors duration-300">
<i class="w-6 h-6 text-amber-600 group-hover:text-white transition-colors duration-300" data-lucide="users"></i>
</div>
<h5 class="font-semibold text-lg mb-3 text-gray-800">Konsultasi Tatap Muka</h5>
<p class="text-gray-600 text-sm mb-4 leading-relaxed">Registrasi untuk konsultasi langsung dengan tim ahli</p>
<a href="#" class="block">
<button class="w-full bg-amber-600 hover:bg-amber-700 text-white font-medium py-3 rounded-xl transition-all duration-300 hover:shadow-lg">
Daftar Sekarang
</button>
</a>
</div>
</div>
<!-- Jadwal Pembahasan Dokumen Lingkungan -->
<div class="group bg-white rounded-2xl shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 overflow-hidden">
<div class="p-6">
<div class="flex items-center justify-center w-12 h-12 bg-amber-100 rounded-xl mb-4 group-hover:bg-amber-600 transition-colors duration-300">
<i class="w-6 h-6 text-amber-600 group-hover:text-white transition-colors duration-300" data-lucide="calendar-days"></i>
</div>
<h5 class="font-semibold text-lg mb-3 text-gray-800">Jadwal Pembahasan</h5>
<p class="text-gray-600 text-sm mb-4 leading-relaxed">Timeline pembahasan dokumen lingkungan yang sedang berlangsung</p>
<a href="https://docs.google.com/spreadsheets/d/11hbR_vXeeKlBH1dT8flvyCzxiiVSwIFkngO-4ANAVAg/edit?gid=0#gid=0" target="_blank" class="block">
<button class="w-full bg-amber-600 hover:bg-amber-700 text-white font-medium py-3 rounded-xl transition-all duration-300 hover:shadow-lg">
Lihat Jadwal
</button>
</a>
</div>
</div>
<!-- Proses Persetujuan Lingkungan -->
<div class="group bg-white rounded-2xl shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 overflow-hidden">
<div class="p-6">
<div class="flex items-center justify-center w-12 h-12 bg-amber-100 rounded-xl mb-4 group-hover:bg-amber-600 transition-colors duration-300">
<i class="w-6 h-6 text-amber-600 group-hover:text-white transition-colors duration-300" data-lucide="clipboard-check"></i>
</div>
<h5 class="font-semibold text-lg mb-3 text-gray-800">Proses Persetujuan Lingkungan</h5>
<p class="text-gray-600 text-sm mb-4 leading-relaxed">Status dan tahapan Persetujuan Dokumen Lingkungan</p>
<a href="https://docs.google.com/spreadsheets/d/19d28Jre-0iC-KPOGzgWlPkP-aGctGP8NUcZ96M81VKE/edit?gid=1567129330#gid=1567129330" target="_blank" class="block">
<button class="w-full bg-amber-600 hover:bg-amber-700 text-white font-medium py-3 rounded-xl transition-all duration-300 hover:shadow-lg">
Cek Status
</button>
</a>
</div>
</div>
<!-- FAQ -->
<div class="group bg-white rounded-2xl shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 overflow-hidden">
<div class="p-6">
<div class="flex items-center justify-center w-12 h-12 bg-amber-100 rounded-xl mb-4 group-hover:bg-amber-600 transition-colors duration-300">
<i class="w-6 h-6 text-amber-600 group-hover:text-white transition-colors duration-300" data-lucide="help-circle"></i>
</div>
<h5 class="font-semibold text-lg mb-3 text-gray-800">FAQ</h5>
<p class="text-gray-600 text-sm mb-4 leading-relaxed">Pertanyaan yang sering diajukan seputar layanan AMDAL</p>
<a href="#" class="block">
<button class="w-full bg-amber-600 hover:bg-amber-700 text-white font-medium py-3 rounded-xl transition-all duration-300 hover:shadow-lg">
Lihat FAQ
</button>
</a>
</div>
</div>
</div>
</div>

213
Views/Layanan/BulkyWaste.cshtml 100644
View File

@ -0,0 +1,213 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Bulky Waste - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Layanan pengelolaan sampah besar";
ViewData["Keywords"] = "Bulky Waste, Sampah Besar, Pengelolaan Sampah, Daur Ulang, Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgTitle"] = "Bulky Waste - Layanan Pengelolaan Sampah Besar | Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Layanan Bulky Waste untuk pengelolaan sampah besar. Solusi pengolahan sampah rumah tangga berukuran besar, furniture bekas, dan barang besar lainnya di DKI Jakarta.";
ViewData["TwitterTitle"] = "Bulky Waste - Layanan Pengelolaan Sampah Besar | Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Layanan Bulky Waste untuk pengelolaan sampah besar. Solusi pengolahan sampah rumah tangga berukuran besar, furniture bekas, dan barang besar lainnya di DKI Jakarta.";
// Breadcumb
ViewData["BreadcrumbText"] = "Bulky Waste";
ViewData["TitleBeforeHighlight"] = "Layanan Pengelolaan";
ViewData["TitleHighlight"] = "Sampah Besar";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="container mx-auto max-w-6xl py-8">
<!-- Hero Section -->
<div class="text-center py-8">
<h2 class="text-3xl font-bold text-gray-800 mb-4">Layanan Bulky Waste</h2>
<p class="text-gray-600 max-w-2xl mx-auto leading-relaxed">
Layanan pengelolaan sampah besar untuk mengurangi dampak lingkungan dari limbah rumah tangga berukuran besar.
</p>
</div>
<div class="grid grid-cols-1 lg:grid-cols-12 gap-8">
<div class="lg:col-span-12">
<div class="relative bg-gradient-to-br from-orange-500 via-orange-600 to-red-500 rounded-2xl p-8 text-white overflow-hidden">
<div class="absolute inset-0 opacity-10">
<svg class="w-full h-full" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<defs>
<pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse">
<path d="M 10 0 L 0 0 0 10" fill="none" stroke="white" stroke-width="0.5" opacity="0.3"/>
</pattern>
</defs>
<rect width="100%" height="100%" fill="url(#grid)"/>
</svg>
</div>
<div class="relative flex flex-col lg:flex-row lg:items-center justify-between">
<div class="lg:flex-1 mb-6 lg:mb-0">
<div class="flex items-center mb-4">
<div class="bg-white/20 backdrop-blur-sm rounded-full p-3 mr-4">
<i data-lucide="star" class="w-8 h-8"></i>
</div>
<h3 class="text-2xl font-bold">Halo Sahabat Lingkungan! 👋</h3>
</div>
<p class="text-lg leading-relaxed text-white/90">
Punya sampah berukuran besar? Kami siap membantu Anda mengelolanya dengan tepat dan ramah lingkungan.
</p>
</div>
<div class="lg:ml-8">
<a href="https://docs.google.com/forms/d/e/1FAIpQLSe960f7Ll5PZPuADP5zdGTfTTHQemvUMXoy62wGO9v40eR5gw/viewform" target="_blank" class="group">
<button class="bg-white text-orange-600 px-8 py-4 rounded-xl font-semibold text-lg hover:bg-gray-50 transition-all duration-300 transform hover:scale-105 shadow-xl hover:shadow-2xl flex items-center">
<span>Daftar Sekarang</span>
<i data-lucide="arrow-right" class="w-5 h-5 ml-2 group-hover:translate-x-1 transition-transform"></i>
</button>
</a>
</div>
</div>
</div>
</div>
<!-- Criteria Section -->
<div class="lg:col-span-6">
<div class="bg-white rounded-2xl p-8 shadow-xl hover:shadow-2xl transition-all duration-300 border border-gray-100 h-full">
<div class="flex items-center mb-6">
<div class="bg-oren rounded-xl p-3 mr-4">
<i data-lucide="user-round" class="w-8 h-8 text-white"></i>
</div>
<h2 class="text-2xl font-bold text-gray-800">Kriteria Pemohon</h2>
</div>
<div class="space-y-4">
<div class="flex items-center p-4 bg-orange-50 rounded-xl border-l-4 border-orange-500">
<div class="bg-orange-500 rounded-full p-2 mr-4">
<i data-lucide="id-card" class="w-5 h-5 text-white"></i>
</div>
<span class="font-medium text-gray-700">Warga DKI Jakarta (dibuktikan dengan KTP)</span>
</div>
<div class="flex items-center p-4 bg-orange-50 rounded-xl border-l-4 border-orange-500">
<div class="bg-orange-500 rounded-full p-2 mr-4">
<i data-lucide="user" class="w-5 h-5 text-white"></i>
</div>
<span class="font-medium text-gray-700">Perorangan (bukan instansi)</span>
</div>
</div>
</div>
</div>
<div class="lg:col-span-6">
<div class="bg-white rounded-2xl p-8 shadow-xl hover:shadow-2xl transition-all duration-300 border border-gray-100 h-full">
<div class="flex items-center mb-6">
<div class="bg-gradient-to-br from-green-500 to-emerald-500 rounded-xl p-3 mr-4">
<i data-lucide="check-circle" class="w-8 h-8 text-white"></i>
</div>
<h2 class="text-2xl font-bold text-gray-800">Kriteria Pra Kondisi</h2>
</div>
<div class="space-y-4">
<div class="flex items-center p-4 bg-green-50 rounded-xl border-l-4 border-green-500">
<div class="bg-green-500 rounded-full p-2 mr-4">
<i data-lucide="ruler" class="w-5 h-5 text-white"></i>
</div>
<span class="font-medium text-gray-700">Dimensi sampah maksimal 2 x 3 x 1.5 m</span>
</div>
<div class="flex items-center p-4 bg-green-50 rounded-xl border-l-4 border-green-500">
<div class="bg-green-500 rounded-full p-2 mr-4">
<i data-lucide="wrench" class="w-5 h-5 text-white"></i>
</div>
<span class="font-medium text-gray-700">Dalam kondisi sudah dibongkar</span>
</div>
</div>
</div>
</div>
<!-- Waste Types Section -->
<div class="lg:col-span-6">
<div class="bg-white rounded-2xl p-8 shadow-xl hover:shadow-2xl transition-all duration-300 border border-gray-100">
<div class="flex items-center mb-8">
<div class="bg-oren rounded-xl p-3 mr-4">
<i data-lucide="trash-2" class="w-8 h-8 text-white"></i>
</div>
<h2 class="text-2xl font-bold text-gray-800">Jenis Sampah yang Dilayani</h2>
</div>
<div class="grid grid-cols-2 sm:grid-cols-2 lg:grid-cols-3 gap-6">
<div class="group bg-gradient-to-br from-orange-50 to-red-50 border-2 border-orange-200 rounded-xl p-3 hover:border-orange-400 transition-all duration-300 hover:shadow-lg">
<div class="flex flex-col items-center text-center gap-3">
<div class="bg-oren text-white rounded-full w-12 h-12 flex items-center justify-center group-hover:scale-110 transition-transform">
<i data-lucide="bed" class="w-6 h-6"></i>
</div>
<span class="font-semibold text-gray-800 text-sm">Tempat tidur / Kasur</span>
</div>
</div>
<div class="group bg-gradient-to-br from-orange-50 to-red-50 border-2 border-orange-200 rounded-xl p-3 hover:border-orange-400 transition-all duration-300 hover:shadow-lg">
<div class="flex flex-col items-center text-center gap-3">
<div class="bg-oren text-white rounded-full w-12 h-12 flex items-center justify-center group-hover:scale-110 transition-transform">
<i data-lucide="archive" class="w-6 h-6"></i>
</div>
<span class="font-semibold text-gray-800 text-sm">Rak / Cabinet / Lemari</span>
</div>
</div>
<div class="group bg-gradient-to-br from-orange-50 to-red-50 border-2 border-orange-200 rounded-xl p-3 hover:border-orange-400 transition-all duration-300 hover:shadow-lg">
<div class="flex flex-col items-center text-center gap-3">
<div class="bg-oren text-white rounded-full w-12 h-12 flex items-center justify-center group-hover:scale-110 transition-transform">
<i data-lucide="shopping-cart" class="w-6 h-6"></i>
</div>
<span class="font-semibold text-gray-800 text-sm">Troli / Gerobak</span>
</div>
</div>
<div class="group bg-gradient-to-br from-orange-50 to-red-50 border-2 border-orange-200 rounded-xl p-3 hover:border-orange-400 transition-all duration-300 hover:shadow-lg">
<div class="flex flex-col items-center text-center gap-3">
<div class="bg-oren text-white rounded-full w-12 h-12 flex items-center justify-center group-hover:scale-110 transition-transform">
<i data-lucide="sofa" class="w-6 h-6"></i>
</div>
<span class="font-semibold text-gray-800 text-sm">Kursi / Sofa / Bangku</span>
</div>
</div>
<div class="group bg-gradient-to-br from-orange-50 to-red-50 border-2 border-orange-200 rounded-xl p-3 hover:border-orange-400 transition-all duration-300 hover:shadow-lg">
<div class="flex flex-col items-center text-center gap-3">
<div class="bg-oren text-white rounded-full w-12 h-12 flex items-center justify-center group-hover:scale-110 transition-transform">
<i data-lucide="table" class="w-6 h-6"></i>
</div>
<span class="font-semibold text-gray-800 text-sm">Meja Makan</span>
</div>
</div>
<div class="group bg-gradient-to-br from-orange-50 to-red-50 border-2 border-orange-200 rounded-xl p-3 hover:border-orange-400 transition-all duration-300 hover:shadow-lg">
<div class="flex flex-col items-center text-center gap-3">
<div class="bg-oren text-white rounded-full w-12 h-12 flex items-center justify-center group-hover:scale-110 transition-transform">
<i data-lucide="bike" class="w-6 h-6"></i>
</div>
<span class="font-semibold text-gray-800 text-sm">Sepeda</span>
</div>
</div>
</div>
</div>
</div>
<!-- Process Section -->
<div class="lg:col-span-6">
<div class="bg-white rounded-2xl p-8 shadow-xl hover:shadow-2xl transition-all duration-300 border border-gray-100 h-full">
<div class="flex items-center mb-8">
<div class="bg-gradient-to-br from-teal-500 to-cyan-500 rounded-xl p-3 mr-4">
<i data-lucide="repeat" class="w-8 h-8 text-white"></i>
</div>
<h2 class="text-2xl font-bold text-gray-800">Proses Penjemputan</h2>
</div>
<div class="space-y-6">
<div class="flex items-center p-4 bg-teal-50 rounded-xl border-l-4 border-teal-500">
<div class="bg-teal-500 rounded-full p-2 mr-4 mt-1">
<i data-lucide="map-pin" class="w-5 h-5 text-white"></i>
</div>
<span class="font-medium text-gray-700 leading-relaxed">Petugas akan menjemput sampah langsung ke lokasi Anda</span>
</div>
<div class="flex items-center p-4 bg-teal-50 rounded-xl border-l-4 border-teal-500">
<div class="bg-teal-500 rounded-full p-2 mr-4 mt-1">
<i data-lucide="form-input" class="w-5 h-5 text-white"></i>
</div>
<span class="font-medium text-gray-700 leading-relaxed">Pendaftaran dapat dilakukan dengan mengisi Google Form</span>
</div>
</div>
</div>
</div>
</div></div>

287
Views/Layanan/BusToilet.cshtml 100644
View File

@ -0,0 +1,287 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Bus Toilet - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Layanan Bus Toilet untuk mendukung acara dan kegiatan di DKI Jakarta dengan fasilitas lengkap dan modern";
ViewData["Keywords"] = "Bus Toilet, Toilet Portable, DLH, Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgTitle"] = "Bus Toilet - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Layanan Bus Toilet untuk mendukung acara dan kegiatan di DKI Jakarta dengan fasilitas lengkap dan modern";
ViewData["TwitterTitle"] = "Bus Toilet - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Layanan Bus Toilet untuk mendukung acara dan kegiatan di DKI Jakarta dengan fasilitas lengkap dan modern";
// Breadcumb
ViewData["BreadcrumbText"] = "Bus Toilet";
ViewData["TitleBeforeHighlight"] = "Bus";
ViewData["TitleHighlight"] = "Toilet";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="container mx-auto max-w-6xl md:px-0 px-4 py-8">
<!-- Hero Section -->
<div class="text-center py-8">
<h2 class="text-3xl font-bold text-gray-800 mb-4">Layanan Bus Toilet</h2>
<p class="text-gray-600 max-w-2xl mx-auto leading-relaxed">
Dinas Lingkungan Hidup Provinsi DKI Jakarta menyediakan layanan Bus Toilet untuk mendukung berbagai acara dan kegiatan di wilayah DKI Jakarta. Bus toilet ini dilengkapi dengan fasilitas modern dan lengkap untuk memberikan kenyamanan maksimal bagi pengguna, termasuk AC, exhaust fan, wastafel, dan berbagai fasilitas pendukung lainnya.
</p>
</div>
<!-- Service Information Cards -->
<div class="grid md:grid-cols-3 gap-6 mb-12">
<!-- How to Request -->
<div class="bg-white rounded-lg shadow-lg p-6 hover:shadow-xl transition-shadow duration-300">
<div class="flex items-center justify-center w-12 h-12 bg-blue-100 rounded-lg mb-4">
<i class="w-6 h-6 text-blue-600" data-lucide="clipboard-list"></i>
</div>
<h3 class="text-lg font-semibold text-gray-800 mb-3">Cara Memperoleh Layanan</h3>
<p class="text-gray-600 mb-4">Menyampaikan surat tertulis (satu minggu sebelum penyelenggaraan acara) kepada:</p>
<div class="bg-gray-50 p-3 rounded-lg">
<p class="text-sm font-semibold text-gray-800">Kepala Dinas Lingkungan Hidup Provinsi DKI Jakarta</p>
<p class="text-sm text-gray-600">Jl. Mandala V No. 67, Cililitan<br>Jakarta Timur</p>
</div>
</div>
<!-- Service Cost -->
<div class="bg-white rounded-lg shadow-lg p-6 hover:shadow-xl transition-shadow duration-300">
<div class="flex items-center justify-center w-12 h-12 bg-green-100 rounded-lg mb-4">
<i class="w-6 h-6 text-green-600" data-lucide="circle-dollar-sign"></i>
</div>
<h3 class="text-lg font-semibold text-gray-800 mb-3">Biaya Layanan</h3>
<p class="text-gray-600 mb-4">Berdasarkan Peraturan Daerah Provinsi DKI Jakarta Nomor 1 Tahun 2015 Tentang Retribusi Daerah:</p>
<div class="bg-amber-50 border-l-4 border-amber-400 p-4 rounded">
<p class="font-semibold text-amber-800">Retribusi Per Unit/Hari:</p>
<p class="text-lg font-bold text-amber-900">Rp 400.000,00</p>
<p class="text-sm text-amber-700">(empat ratus ribu rupiah)</p>
</div>
</div>
<!-- Service Hours -->
<div class="bg-white rounded-lg shadow-lg p-6 hover:shadow-xl transition-shadow duration-300">
<div class="flex items-center justify-center w-12 h-12 bg-purple-100 rounded-lg mb-4">
<i class="w-6 h-6 text-purple-600" data-lucide="clock"></i>
</div>
<h3 class="text-lg font-semibold text-gray-800 mb-3">Jam Pelayanan</h3>
<div class="flex items-center mb-4">
<svg class="w-5 h-5 text-yellow-500 mr-2" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z" clip-rule="evenodd"></path>
</svg>
<span class="text-lg font-semibold text-gray-800">Pukul 07.30 - 15.00 WIB</span>
</div>
<p class="text-sm text-gray-500">* Berlaku untuk pengajuan surat permohonan</p>
</div>
</div>
<!-- Facilities Section -->
<section class="mb-12">
<h2 class="text-2xl font-bold text-gray-800 mb-6">Fasilitas Bus Toilet VIP</h2>
<div class="grid grid-cols-2 md:grid-cols-4 gap-4">
<div class="bg-blue-50 border border-blue-200 rounded-lg p-4 text-center hover:bg-blue-100 transition-colors">
<i class="w-8 h-8 text-blue-600 mx-auto mb-2" data-lucide="air-vent"></i>
<span class="text-sm font-medium text-blue-800">Air Conditioner (AC)</span>
</div>
<div class="bg-green-50 border border-green-200 rounded-lg p-4 text-center hover:bg-green-100 transition-colors">
<i class="w-8 h-8 text-green-600 mx-auto mb-2" data-lucide="fan"></i>
<span class="text-sm font-medium text-green-800">Exhaust Fan</span>
</div>
<div class="bg-purple-50 border border-purple-200 rounded-lg p-4 text-center hover:bg-purple-100 transition-colors">
<i class="w-8 h-8 text-purple-600 mx-auto mb-2" data-lucide="toilet"></i>
<span class="text-sm font-medium text-purple-800">Kloset Duduk</span>
</div>
<div class="bg-indigo-50 border border-indigo-200 rounded-lg p-4 text-center hover:bg-indigo-100 transition-colors">
<i class="w-8 h-8 text-indigo-600 mx-auto mb-2" data-lucide="toilet"></i>
<span class="text-sm font-medium text-indigo-800">Urinoir</span>
</div>
<div class="bg-cyan-50 border border-cyan-200 rounded-lg p-4 text-center hover:bg-cyan-100 transition-colors">
<i class="w-8 h-8 text-cyan-600 mx-auto mb-2" data-lucide="droplets"></i>
<span class="text-sm font-medium text-cyan-800">Wastafel</span>
</div>
<div class="bg-pink-50 border border-pink-200 rounded-lg p-4 text-center hover:bg-pink-100 transition-colors">
<i class="w-8 h-8 text-pink-600 mx-auto mb-2" data-lucide="wind"></i>
<span class="text-sm font-medium text-pink-800">Mesin Pengering Tangan</span>
</div>
<div class="bg-yellow-50 border border-yellow-200 rounded-lg p-4 text-center hover:bg-yellow-100 transition-colors">
<i class="w-8 h-8 text-yellow-600 mx-auto mb-2" data-lucide="file-text"></i>
<span class="text-sm font-medium text-yellow-800">Tissue</span>
</div>
<div class="bg-teal-50 border border-teal-200 rounded-lg p-4 text-center hover:bg-teal-100 transition-colors">
<i class="w-8 h-8 text-teal-600 mx-auto mb-2" data-lucide="soap-dispenser-droplet"></i>
<span class="text-sm font-medium text-teal-800">Sabun Cuci Tangan</span>
</div>
</div>
</section>
<!-- Service Areas -->
<section class="mb-12">
<h2 class="text-2xl font-bold text-gray-800 mb-6">Wilayah Layanan</h2>
<div class="grid md:grid-cols-5 gap-4">
<div class="bg-white border border-gray-200 rounded-lg p-4 text-center hover:shadow-md transition-shadow">
<svg class="w-6 h-6 text-red-500 mx-auto mb-2" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd"></path>
</svg>
<span class="text-sm font-medium text-gray-800">Jakarta Pusat</span>
</div>
<div class="bg-white border border-gray-200 rounded-lg p-4 text-center hover:shadow-md transition-shadow">
<svg class="w-6 h-6 text-red-500 mx-auto mb-2" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd"></path>
</svg>
<span class="text-sm font-medium text-gray-800">Jakarta Utara</span>
</div>
<div class="bg-white border border-gray-200 rounded-lg p-4 text-center hover:shadow-md transition-shadow">
<svg class="w-6 h-6 text-red-500 mx-auto mb-2" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd"></path>
</svg>
<span class="text-sm font-medium text-gray-800">Jakarta Barat</span>
</div>
<div class="bg-white border border-gray-200 rounded-lg p-4 text-center hover:shadow-md transition-shadow">
<svg class="w-6 h-6 text-red-500 mx-auto mb-2" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd"></path>
</svg>
<span class="text-sm font-medium text-gray-800">Jakarta Selatan</span>
</div>
<div class="bg-white border border-gray-200 rounded-lg p-4 text-center hover:shadow-md transition-shadow">
<svg class="w-6 h-6 text-red-500 mx-auto mb-2" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M5.05 4.05a7 7 0 119.9 9.9L10 18.9l-4.95-4.95a7 7 0 010-9.9zM10 11a2 2 0 100-4 2 2 0 000 4z" clip-rule="evenodd"></path>
</svg>
<span class="text-sm font-medium text-gray-800">Jakarta Timur</span>
</div>
</div>
</section>
<!-- Past Events -->
<section class="mb-12">
<h2 class="text-2xl font-bold text-gray-800 mb-6">Telah Melayani Event</h2>
<div class="grid md:grid-cols-2 gap-6">
<div class="bg-white rounded-lg shadow-md p-6">
<ul class="space-y-3">
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Asian Games 2018</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Asian Para Games 2018</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">HUT KORPASUS 2019 ke-67</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Pameran INACRAFT - JICC 2019</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Festival Palang Pintu Kemang</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Markas Komando Korps Marinir</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Bawaslu Provinsi DKI Jakarta</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">MRT - Jakarta</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Mabes TNI Cilangkap</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Komite Intelijen Daerah - DKI Jakarta</span>
</li>
</ul>
</div>
<div class="bg-white rounded-lg shadow-md p-6">
<ul class="space-y-3">
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Komisi Pemilihan Umum - Debat Capres/Cawapres 2019</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Pangkalan Skadron 45 Lanud Halim Perdana Kusuma</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Departemen Luar Negeri</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Departemen Dalam Negeri</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Monumen Nasional (Monas)</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Taman Marga Satwa Ragunan</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Kawasan Kota Tua, Jakarta Barat</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Kartini Run</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Pameran Flora dan Fauna - Lapangan Banteng</span>
</li>
<li class="flex items-center">
<svg class="w-4 h-4 text-green-500 mr-3" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path>
</svg>
<span class="text-gray-700">Dan Event Lainnya</span>
</li>
</ul>
</div>
</div>
</section>
</div>

202
Views/Layanan/Lab.cshtml 100644
View File

@ -0,0 +1,202 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Uji Sampel Laboratorium - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Layanan uji sampel laboratorium untuk analisis kualitas air, udara, dan tanah oleh Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Keywords"] = "Uji Sampel Laboratorium, DLH, Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgTitle"] = "Uji Sampel Laboratorium - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Layanan uji sampel laboratorium untuk analisis kualitas air, udara, dan tanah oleh Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterTitle"] = "Uji Sampel Laboratorium - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Layanan uji sampel laboratorium untuk analisis kualitas air, udara, dan tanah oleh Dinas Lingkungan Hidup DKI Jakarta";
// Breadcumb
ViewData["BreadcrumbText"] = "Uji Sampel Laboratorium";
ViewData["TitleBeforeHighlight"] = "Uji Sampel";
ViewData["TitleHighlight"] = "Laboratorium";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="container mx-auto max-w-6xl py-8">
<!-- Hero Section -->
<div class="text-center py-8">
<h2 class="text-3xl font-bold text-gray-800 mb-4">Layanan Uji Sampel Laboratorium</h2>
<p class="text-gray-600 max-w-2xl mx-auto leading-relaxed">
Laboratorium Lingkungan Hidup Daerah (LLHD) merupakan salah satu Unit Pelaksana Teknis (UPT) di Dinas Lingkungan Hidup Provinsi DKI Jakarta yang mempunyai tugas melaksanakan pengambilan contoh uji, pengujian, dan analisis lingkungan secara laboratoris. Laboratorium Lingkungan Hidup Daerah telah diakreditasi oleh Komite Akreditasi Nasional (KAN) dengan standar ISO/IEC 17025:2017 sejak 2002 dan terintegrasi sebagai “Laboratorium Lingkungan” oleh Kementerian Lingkungan Hidup/ Badan Pengendalian Lingkungan Hidup sejak 2011 yang menegaskan bahwa LLHD memiliki kompetensi pengujian berbasis standar internasional. </p>
</p>
</div>
<!-- Tutorial Video Section -->
<div class="mb-12">
<h2 class="text-2xl font-bold text-gray-800 mb-6">Tutorial Video</h2>
<div class="grid md:grid-cols-2 gap-6">
<div class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300">
<div class="aspect-video">
<iframe src="https://www.youtube.com/embed/KIB0Q2gvLKw"
title="Cara Pembuatan Akun"
allowfullscreen
class="w-full h-full">
</iframe>
</div>
<div class="p-4 text-center">
<h5 class="font-semibold text-gray-800">Cara Pembuatan Akun</h5>
</div>
</div>
<div class="bg-white rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-300">
<div class="aspect-video">
<iframe src="https://www.youtube.com/embed/wO3abCNqqUU"
title="Cara Pengajuan Layanan"
allowfullscreen
class="w-full h-full">
</iframe>
</div>
<div class="p-4 text-center">
<h5 class="font-semibold text-gray-800">Cara Pengajuan Layanan</h5>
</div>
</div>
</div>
</div>
<!-- Services Section -->
<div class="grid md:grid-cols-2 gap-8 mb-12">
<div>
<h2 class="text-2xl font-bold text-gray-800 mb-6">Layanan Pengujian Air</h2>
<div class="bg-white rounded-lg shadow-md p-6">
<div class="grid grid-cols-3 gap-3 mb-4">
<div class="flex items-center p-3 bg-blue-50 rounded-lg border-l-4 border-blue-500">
<i data-lucide="droplets" class="w-5 h-5 text-blue-600 mr-3"></i>
<span class="text-gray-700">Air Limbah</span>
</div>
<div class="flex items-center p-3 bg-blue-50 rounded-lg border-l-4 border-blue-500">
<i data-lucide="waves" class="w-5 h-5 text-blue-600 mr-3"></i>
<span class="text-gray-700">Air Sungai</span>
</div>
<div class="flex items-center p-3 bg-blue-50 rounded-lg border-l-4 border-blue-500">
<i data-lucide="droplet" class="w-5 h-5 text-blue-600 mr-3"></i>
<span class="text-gray-700">Air Situ</span>
</div>
</div>
<div class="grid grid-cols-2 gap-3">
<div class="flex items-center p-3 bg-blue-50 rounded-lg border-l-4 border-blue-500">
<i data-lucide="earth" class="w-5 h-5 text-blue-600 mr-3"></i>
<span class="text-gray-700">Air Tanah</span>
</div>
<div class="flex items-center p-3 bg-blue-50 rounded-lg border-l-4 border-blue-500">
<i data-lucide="candy-cane" class="w-5 h-5 text-blue-600 mr-3"></i>
<span class="text-gray-700">Air Perpipaan</span>
</div>
</div>
</div>
</div>
<div>
<h2 class="text-2xl font-bold text-gray-800 mb-6">Layanan Pengujian Udara</h2>
<div class="bg-white rounded-lg shadow-md p-6">
<div class="grid grid-cols-3 gap-3 mb-4">
<div class="flex items-center p-3 bg-green-50 rounded-lg border-l-4 border-green-500">
<i data-lucide="wind" class="w-5 h-5 text-green-600 mr-3"></i>
<span class="text-gray-700">Ambient</span>
</div>
<div class="flex items-center p-3 bg-green-50 rounded-lg border-l-4 border-green-500">
<i data-lucide="home" class="w-5 h-5 text-green-600 mr-3"></i>
<span class="text-gray-700">Kualitas Udara Dalam Ruangan</span>
</div>
<div class="flex items-center p-3 bg-green-50 rounded-lg border-l-4 border-green-500">
<i data-lucide="car" class="w-5 h-5 text-green-600 mr-3"></i>
<span class="text-gray-700">Emisi Sumber Bergerak</span>
</div>
</div>
<div class="grid grid-cols-2 gap-3">
<div class="flex items-center p-3 bg-green-50 rounded-lg border-l-4 border-green-500">
<i data-lucide="factory" class="w-5 h-5 text-green-600 mr-3"></i>
<span class="text-gray-700">Emisi Sumber Tidak Bergerak</span>
</div>
<div class="flex items-center p-3 bg-green-50 rounded-lg border-l-4 border-green-500">
<i data-lucide="volume-2" class="w-5 h-5 text-green-600 mr-3"></i>
<span class="text-gray-700">Kebisingan dan Getaran</span>
</div>
</div>
</div>
</div>
</div>
<!-- Schedule and Contact Section -->
<div class="grid md:grid-cols-2 gap-8 mb-12">
<div>
<h2 class="text-2xl font-bold text-gray-800 mb-6">Jadwal Pelayanan</h2>
<div class="bg-white rounded-lg shadow-md p-6">
<div class="space-y-4">
<div class="p-4 bg-orange-50 rounded-lg border-l-4 border-orange-500">
<div class="font-semibold text-gray-800">Selasa - Kamis:</div>
<div class="text-gray-600">08.00 – 14.00 WIB</div>
</div>
<div class="p-4 bg-orange-50 rounded-lg border-l-4 border-orange-500">
<div class="font-semibold text-gray-800">Jumat:</div>
<div class="text-gray-600">08.00 – 14.00 WIB</div>
<div class="text-sm text-gray-500 mt-1">
(khusus hari Jumat tidak menerima parameter mikrobiologi)
</div>
</div>
</div>
</div>
</div>
<div>
<h2 class="text-2xl font-bold text-gray-800 mb-6">Informasi Kontak</h2>
<div class="bg-white rounded-lg shadow-md p-6">
<div class="space-y-4">
<div>
<div class="font-semibold text-gray-800">UPT LLHD Provinsi DKI Jakarta</div>
<div class="text-gray-600">Jl. Casablanca Kav. 1</div>
<div class="text-gray-600">Kuningan, Jakarta Selatan</div>
</div>
<div>
<div class="font-semibold text-gray-800">Customer Service (Dasalewa):</div>
<a href="tel:+6281511930751" class="text-blue-600 hover:text-blue-800">+62 815-1193-0751</a>
<span class="text-sm text-gray-500">(text only)</span>
</div>
<div>
<div class="font-semibold text-gray-800">Telepon:</div>
<a href="tel:+622152921061" class="text-blue-600 hover:text-blue-800">+62-21-52921061</a>
</div>
<div>
<div class="font-semibold text-gray-800">Fax:</div>
<div class="text-gray-600">+62-21-5265309, +62-21-52920263</div>
</div>
</div>
</div>
</div>
</div>
<!-- Online System Section -->
<div class="mb-8">
<h2 class="text-2xl font-bold text-gray-800 mb-6">Sistem Informasi Online (Sibolink)</h2>
<div class="bg-white rounded-lg shadow-md p-6">
<p class="text-gray-600 mb-4">
Layanan pengujian dapat diakses melalui Sibolink (Sistem Informasi Laboratorium Lingkungan) di
<a href="https://llhd.jakarta.go.id" class="text-blue-600 hover:text-blue-800 font-medium">llhd.jakarta.go.id</a>
</p>
<p class="text-gray-800 font-semibold mb-4">Fitur yang tersedia:</p>
<ul class="grid md:grid-cols-2 gap-3 mb-6">
<li class="flex items-center p-3 bg-purple-50 rounded-lg border-l-4 border-purple-500">
<span class="text-gray-700">Pendaftaran akun online</span>
</li>
<li class="flex items-center p-3 bg-purple-50 rounded-lg border-l-4 border-purple-500">
<span class="text-gray-700">Pengajuan layanan pengujian</span>
</li>
<li class="flex items-center p-3 bg-purple-50 rounded-lg border-l-4 border-purple-500">
<span class="text-gray-700">Laporan Hasil Uji (LHU) digital</span>
</li>
<li class="flex items-center p-3 bg-purple-50 rounded-lg border-l-4 border-purple-500">
<span class="text-gray-700">Tracking status pengujian</span>
</li>
</ul>
<a href="https://www.youtube.com/@@laboratoriumlingkunganjakarta"
class="inline-block bg-red-600 hover:bg-red-700 text-white font-semibold py-3 px-6 rounded-lg transition-colors duration-300"
target="_blank">
Kunjungi Channel YouTube Kami
</a>
</div>
</div>
</div>

264
Views/Layanan/Ppid.cshtml 100644
View File

@ -0,0 +1,264 @@
@{
Layout = "_Layout";
ViewData["Title"] = "PPID - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Pejabat Pengelola Informasi dan Dokumentasi";
ViewData["Keywords"] = "PPID, Pejabat Pengelola Informasi dan Dokumentasi, Keterbukaan Informasi Publik, Dokumen Publik, Informasi Lingkungan Hidup, Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgTitle"] = "PPID - Pejabat Pengelola Informasi dan Dokumentasi | Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Layanan PPID untuk pengelolaan informasi dan dokumentasi publik bidang lingkungan hidup. Akses informasi transparansi, dokumen kebijakan, dan data lingkungan DKI Jakarta.";
ViewData["TwitterTitle"] = "PPID - Pejabat Pengelola Informasi dan Dokumentasi | Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Layanan PPID untuk pengelolaan informasi dan dokumentasi publik bidang lingkungan hidup. Akses informasi transparansi, dokumen kebijakan, dan data lingkungan DKI Jakarta.";
// Breadcumb
ViewData["BreadcrumbText"] = "PPID";
ViewData["TitleBeforeHighlight"] = "Pejabat Pengelola";
ViewData["TitleHighlight"] = "Informasi dan Dokumentasi";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="bg-white">
<section class="container mx-auto px-6 lg:px-12 py-16">
<div class="max-w-6xl mx-auto space-y-12">
<!-- Hero Section -->
<div class="text-center py-8">
<h2 class="text-3xl font-bold text-gray-800 mb-4">PPID</h2>
<p class="text-gray-600 max-w-2xl mx-auto leading-relaxed">
Layanan PPID untuk pengelolaan informasi dan dokumentasi publik bidang lingkungan hidup. Akses informasi transparansi, dokumen kebijakan, dan data lingkungan DKI Jakarta.
</p>
</div>
<!-- Accordion Container -->
<div class="bg-white rounded-3xl shadow-2xl p-8 lg:p-12 border border-gray-100 space-y-4">
<!-- Profil PPID -->
<div class="border border-gray-200 rounded-xl overflow-hidden">
<button class="w-full px-6 py-4 text-left bg-gradient-to-r from-green-50 to-red-50 hover:from-green-100 hover:to-cyan-100 transition-colors duration-200 flex items-center justify-between"
onclick="toggleAccordion('profilPPID')">
<div class="flex items-center space-x-3">
<i class="text-orange-600" data-lucide="building"></i>
<h3 class="text-lg font-semibold text-gray-800">Profil PPID</h3>
</div>
<i class="text-orange-600 transition-transform duration-200" data-lucide="chevron-down" id="profilPPID-icon"></i>
</button>
<div id="profilPPID" class="hidden px-6 py-4 bg-white">
<p class="text-gray-700 leading-relaxed text-md mb-6">Undang-Undang Nomor 14 Tahun 2008 tentang Keterbukaan Informasi Publik (KIP) merupakan pedoman hukum bagi publik untuk mendapatkan hak atas informasi. Undang-Undang KIP tersebut juga menjelaskan kewajiban Badan Publik dalam menyediakan dan melayani permohonan informasi publik secara cepat dan tepat waktu.</p>
<p class="text-gray-700 leading-relaxed text-md mb-6">Selanjutnya dalam Peraturan Pemerintah Republik Indonesia Nomor 61 Tahun 2010 tentang Pelaksanaan UU KIP pada pasal 1 juga mengamanatkan bahwa Badan Publik harus menetapkan Pejabat Pengelola Informasi dan Dokumentasi (PPID) yang bertanggung jawab dalam bidang penyimpanan, pendokumentasian, penyediaan, dan/atau pelayanan informasi di Badan Publik.</p>
<p class="text-gray-700 leading-relaxed text-md">Keterbukaan informasi publik pada Badan Pengelolaan Keuangan Daerah Provinsi DKI Jakarta merupakan langkah yang digunakan untuk mewujudkan tata kelola pemerintahan yang baik. Oleh karena itu Undang-undang 14 Tahun 2008 tentang Keterbukaan Informasi Publik sangat perlu di implementasikan. Sehingga menjadi dasar pengelolaan dan pelayanan informasi publik oleh Pejabat Pengelola Informasi dan Dokumentasi (PPID) di lingkungan Provinsi DKI Jakarta.</p>
</div>
</div>
<!-- Visi dan Misi PPID -->
<div class="border border-gray-200 rounded-xl overflow-hidden">
<button class="w-full px-6 py-4 text-left bg-gradient-to-r from-green-50 to-red-50 hover:from-green-100 hover:to-cyan-100 transition-colors duration-200 flex items-center justify-between"
onclick="toggleAccordion('visiMisi')">
<div class="flex items-center space-x-3">
<i class="text-orange-600" data-lucide="target"></i>
<h3 class="text-lg font-semibold text-gray-800">VISI dan MISI PPID</h3>
</div>
<i class="text-orange-600 transition-transform duration-200" data-lucide="chevron-down" id="visiMisi-icon"></i>
</button>
<div id="visiMisi" class="hidden px-6 py-4 bg-white">
<div class="mb-6">
<h5 class="text-lg font-semibold text-orange-600 mb-3">VISI:</h5>
<p class="font-semibold text-gray-800">Jakarta kota maju, lestari dan berbudaya yang warganya terlibat dalam mewujudkan keberadaban, keadilan dan kesejahteraan bagi semua.</p>
</div>
<div>
<h5 class="text-lg font-semibold text-orange-600 mb-3">MISI:</h5>
<div class="grid gap-3">
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">1</span>
<p class="text-gray-700 text-sm">Menjadikan Jakarta kota yang aman, sehat, cerdas, berbudaya dengan memperkuat nilai-nilai keluarga dan memberikan ruang kreativitas melalui kepemimpinan yang melibatkan, menggerakkan dan memanusiakan.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">2</span>
<p class="text-gray-700 text-sm">Menjadikan Jakarta kota yang memajukan kesejahteraan umum melalui terciptanya lapangan kerja, kestabilan dan keterjangkauan kebutuhan pokok, meningkatnya keadilan sosial, percepatan pembangunan infrastruktur, kemudahan investasi dan berbisnis, serta perbaikan pengelolaan tata ruang.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">3</span>
<p class="text-gray-700 text-sm">Menjadikan Jakarta tempat wahana aparatur negara yang berkarya, mengabdi, melayani, serta menyelesaikan berbagai permasalahan kota dan warga, secara efektif, meritokratis dan berintegritas.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">4</span>
<p class="text-gray-700 text-sm">Menjadikan Jakarta kota yang lestari, dengan pembangunan dan tata kehidupan yang memperkuat daya dukung lingkungan dan sosial.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">5</span>
<p class="text-gray-700 text-sm">Menjadikan Jakarta ibukota yang dinamis sebagai simpul kemajuan Indonesia yang bercirikan keadilan, kebangsaan dan kebhinekaan.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Tugas PPID -->
<div class="border border-gray-200 rounded-xl overflow-hidden">
<button class="w-full px-6 py-4 text-left bg-gradient-to-r from-green-50 to-red-50 hover:from-green-100 hover:to-cyan-100 transition-colors duration-200 flex items-center justify-between"
onclick="toggleAccordion('tugasPPID')">
<div class="flex items-center space-x-3">
<i class="text-orange-600" data-lucide="briefcase"></i>
<h3 class="text-lg font-semibold text-gray-800">TUGAS PPID</h3>
</div>
<i class="text-orange-600 transition-transform duration-200" data-lucide="chevron-down" id="tugasPPID-icon"></i>
</button>
<div id="tugasPPID" class="hidden px-6 py-4 bg-white">
<h5 class="text-lg font-semibold text-orange-600 mb-4">TUGAS DAN WEWENANG PPID</h5>
<p class="text-gray-700 leading-relaxed text-md mb-6">Fungsi:</p>
<div class="grid gap-3">
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">1</span>
<p class="text-gray-700 text-sm">Melaksanakan kebijakan layanan yang sudah ditetapkan.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">2</span>
<p class="text-gray-700 text-sm">Melakukan klasifikasi informasi.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">3</span>
<p class="text-gray-700 text-sm">Melakukan koordinasi untuk pengumpulan bahan informasi dan dokumentasi yang ada di lingkungannya.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">4</span>
<p class="text-gray-700 text-sm">Menyediakan dan memberi pelayanan informasi yang ada di lingkungan kepada publik.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">5</span>
<p class="text-gray-700 text-sm">Melakukan verifikasi bahan informasi publik yang ada di lingkungannya.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">6</span>
<p class="text-gray-700 text-sm">Sebagai media informasi yang mudah diakses oleh masyarakat.</p>
</div>
</div>
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-start space-x-3">
<span class="flex-shrink-0 w-6 h-6 bg-orange-500 text-white rounded-full flex items-center justify-center text-xs font-bold">7</span>
<p class="text-gray-700 text-sm">Memberikan laporan tentang pengelolaan informasi yang ada di lingkungan kepada PPID utama secara berkala.</p>
</div>
</div>
</div>
</div>
</div>
<!-- Alur Permohonan Informasi -->
<div class="border border-gray-200 rounded-xl overflow-hidden">
<button class="w-full px-6 py-4 text-left bg-gradient-to-r from-green-50 to-red-50 hover:from-green-100 hover:to-cyan-100 transition-colors duration-200 flex items-center justify-between"
onclick="toggleAccordion('alurPermohonan')">
<div class="flex items-center space-x-3">
<i class="text-orange-600" data-lucide="info"></i>
<h3 class="text-lg font-semibold text-gray-800">Alur Permohonan Informasi</h3>
</div>
<i class="text-orange-600 transition-transform duration-200" data-lucide="chevron-down" id="alurPermohonan-icon"></i>
</button>
<div id="alurPermohonan" class="hidden px-6 py-4 bg-white">
<div class="bg-gradient-to-r from-orange-50 to-red-50 rounded-lg p-4 border-l-4 border-orange-500">
<div class="flex items-center space-x-3">
<i class="fas fa-info-circle text-orange-500"></i>
<img src="@Url.Content("~/assets/images/layanan/pemohon.png")" alt="">
</div>
</div>
</div>
</div>
<!-- Service Cards -->
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
<!-- Permohonan Informasi Card -->
<div class="group bg-white rounded-2xl shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 overflow-hidden">
<div class="p-6">
<div class="flex items-center justify-center w-12 h-12 bg-amber-100 rounded-xl mb-4 group-hover:bg-amber-600 transition-colors duration-300">
<i class="w-6 h-6 text-amber-600 group-hover:text-white transition-colors duration-300" data-lucide="file"></i>
</div>
<h5 class="font-semibold text-lg mb-3 text-gray-800">Permohonan Informasi</h5>
<p class="text-gray-600 text-sm mb-4 leading-relaxed">Ajukan permohonan informasi publik secara online dengan mudah dan cepat</p>
<a href="https://ppid.jakarta.go.id/permohonan-informasi" target="_blank" class="block">
<button class="w-full bg-amber-600 hover:bg-amber-700 text-white font-medium py-3 rounded-xl transition-all duration-300 hover:shadow-lg cursor-pointer">
Ajukan Permohonan
</button>
</a>
</div>
</div>
<!-- Daftar Informasi Card -->
<div class="group bg-white rounded-2xl shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 overflow-hidden">
<div class="p-6">
<div class="flex items-center justify-center w-12 h-12 bg-amber-100 rounded-xl mb-4 group-hover:bg-amber-600 transition-colors duration-300">
<i class="w-6 h-6 text-amber-600 group-hover:text-white transition-colors duration-300" data-lucide="database"></i>
</div>
<h5 class="font-semibold text-lg mb-3 text-gray-800">Daftar Informasi Publik</h5>
<p class="text-gray-600 text-sm mb-4 leading-relaxed">Akses berbagai informasi publik yang telah dikategorikan sesuai jenisnya</p>
<a href="https://ppid.jakarta.go.id/daftar-informasi-publik-ppid-perangkat-daerah" target="_blank" class="block">
<button class="w-full bg-amber-600 hover:bg-amber-700 text-white font-medium py-3 rounded-xl transition-all duration-300 hover:shadow-lg cursor-pointer">
Lihat Informasi
</button>
</a>
</div>
</div>
<!-- Statistik Card -->
<div class="group bg-white rounded-2xl shadow-sm hover:shadow-xl transition-all duration-300 border border-gray-100 overflow-hidden">
<div class="p-6">
<div class="flex items-center justify-center w-12 h-12 bg-amber-100 rounded-xl mb-4 group-hover:bg-amber-600 transition-colors duration-300">
<i class="w-6 h-6 text-amber-600 group-hover:text-white transition-colors duration-300" data-lucide="bar-chart-3"></i>
</div>
<h5 class="font-semibold text-lg mb-3 text-gray-800">Satu Data Jakarta</h5>
<p class="text-gray-600 text-sm mb-4 leading-relaxed">Pantau statistik layanan informasi publik secara real-time</p>
<a href="https://satudata.jakarta.go.id/home" target="_blank" class="block">
<button class="w-full bg-amber-600 hover:bg-amber-700 text-white font-medium py-3 rounded-xl transition-all duration-300 hover:shadow-lg cursor-pointer">
Lihat Statistik
</button>
</a>
</div>
</div>
        </div>
</div>
</div>
</section>
</div>
<script>
function toggleAccordion(targetId) {
const content = document.getElementById(targetId);
const icon = document.getElementById(targetId + '-icon');
if (content.classList.contains('hidden')) {
content.classList.remove('hidden');
icon.style.transform = 'rotate(180deg)';
} else {
content.classList.add('hidden');
icon.style.transform = 'rotate(0deg)';
}
}
// Show first accordion by default
document.addEventListener('DOMContentLoaded', function() {
const firstContent = document.getElementById('profilPPID');
const firstIcon = document.getElementById('profilPPID-icon');
firstContent.classList.remove('hidden');
firstIcon.style.transform = 'rotate(180deg)';
});
</script>

55
Views/Shared/Partials/MegaMenus/_MegaMenu4-Layanan.cshtml
View File

@ -3,25 +3,60 @@
<div id="mega-menu-4" 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">
<a href="#" 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-check"></i></div>
<a href="@Url.Action("Amdal", "Layanan")" 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="leaf"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">AMDAL</div>
<p class="text-sm text-gray-500">Analisis Dampak Lingkungan.</p>
</div>
</a>
<a href="#" 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>
<a href="@Url.Action("Ewaste", "Layanan")" 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="smartphone"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">PPID</div>
<p class="text-sm text-gray-500">Pejabat Pengelola Informasi dan Dokumentasi.</p>
<div class="font-medium text-gray-900 hover:text-orange-700">Penjemputan e-Waste</div>
<p class="text-sm text-gray-500">Layanan pengumpulan sampah elektronik.</p>
</div>
</a>
<a href="#" 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="truck"></i></div>
<a href="@Url.Action("Lab", "Layanan")" 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="flask-conical"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">Bulky Waste</div>
<p class="text-sm text-gray-500">Penjemputan sampah besar.</p>
<div class="font-medium text-gray-900 hover:text-orange-700">Uji Sampel Laboratorium</div>
<p class="text-sm text-gray-500">Pengujian kualitas lingkungan hidup.</p>
</div>
</a>
<a href="@Url.Action("BusToilet", "Layanan")" 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="bus"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">Bus Toilet</div>
<p class="text-sm text-gray-500">Fasilitas toilet keliling untuk kegiatan umum.</p>
</div>
</a>
<a href="@Url.Action("Bpsrw", "Layanan")" 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="database"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">BPSRW</div>
<p class="text-sm text-gray-500">Basis data lingkungan hidup tingkat Rukun Warga.</p>
</div>
</a>
<a href="@Url.Action("BulkyWaste", "Layanan")" 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-2"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">Bulky Waste</div>
<p class="text-sm text-gray-500">Layanan khusus pengangkutan sampah besar.</p>
</div>
</a>
<a href="@Url.Action("Ppid", "Layanan")" 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">PPID</div>
<p class="text-sm text-gray-500">Pejabat Pengelola Informasi dan Dokumentasi.</p>
</div>
</a>
<a href="@Url.Action("Whistleblowing", "Layanan")" 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="alert-triangle"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">Whistleblowing System</div>
<p class="text-sm text-gray-500">Sarana pelaporan pelanggaran terkait lingkungan.</p>
</div>
</a>
</div>

BIN
bin/Debug/net9.0/dlh-net.dll
View File

Binary file not shown.

BIN
bin/Debug/net9.0/dlh-net.exe
View File

Binary file not shown.

BIN
bin/Debug/net9.0/dlh-net.pdb
View File

Binary file not shown.

2
bin/Debug/net9.0/dlh-net.staticwebassets.endpoints.json
View File

File diff suppressed because one or more lines are too long

2
bin/Debug/net9.0/dlh-net.staticwebassets.runtime.json
View File

File diff suppressed because one or more lines are too long

BIN
obj/Debug/net9.0/apphost.exe
View File

Binary file not shown.

BIN
obj/Debug/net9.0/compressed/hc40dw3fux-ymjnsy4hf6.gz 100644
View File

Binary file not shown.

BIN
obj/Debug/net9.0/compressed/hc40dw3fux-zylckvraor.gz
View File

Binary file not shown.

2
obj/Debug/net9.0/dlh-net.AssemblyInfo.cs
View File

@ -13,7 +13,7 @@ using System.Reflection;
[assembly: System.Reflection.AssemblyCompanyAttribute("dlh-net")]
[assembly: System.Reflection.AssemblyConfigurationAttribute("Debug")]
[assembly: System.Reflection.AssemblyFileVersionAttribute("1.0.0.0")]
[assembly: System.Reflection.AssemblyInformationalVersionAttribute("1.0.0+955d33b8ea69d98d78e82ffca208ddddfd41981f")]
[assembly: System.Reflection.AssemblyInformationalVersionAttribute("1.0.0+854ebf398ca960fe17b41b1ef5ca4d8b7138c8fe")]
[assembly: System.Reflection.AssemblyProductAttribute("dlh-net")]
[assembly: System.Reflection.AssemblyTitleAttribute("dlh-net")]
[assembly: System.Reflection.AssemblyVersionAttribute("1.0.0.0")]

2
obj/Debug/net9.0/dlh-net.AssemblyInfoInputs.cache
View File

@ -1 +1 @@
4ac9e3a459e6d8a0b73029eacfae20325a8b2389bc255a63c5e57c58e4bd2aa0
c80e0e390873eb3277c7e8d1ec78cff7c786fdc6d279095127bd2d0c6f9fc73c

20
obj/Debug/net9.0/dlh-net.GeneratedMSBuildEditorConfig.editorconfig
View File

@ -76,6 +76,26 @@ build_metadata.AdditionalFiles.CssScope =
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcSG9tZVxQcml2YWN5LmNzaHRtbA==
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Layanan/Amdal.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcTGF5YW5hblxBbWRhbC5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Layanan/BulkyWaste.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcTGF5YW5hblxCdWxreVdhc3RlLmNzaHRtbA==
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Layanan/BusToilet.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcTGF5YW5hblxCdXNUb2lsZXQuY3NodG1s
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Layanan/Lab.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcTGF5YW5hblxMYWIuY3NodG1s
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Layanan/Ppid.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcTGF5YW5hblxQcGlkLmNzaHRtbA==
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Profil/Bidang.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHJvZmlsXEJpZGFuZy5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope =

2
obj/Debug/net9.0/dlh-net.csproj.CoreCompileInputs.cache
View File

@ -1 +1 @@
9938a07ca40d248667258ea8b9cefd0bc969dcb09678613f46307dc440d34a99
50797de467140eb544248ad24754b93b6bbfc6bde36940d84d2d2717837bbfd1

6
obj/Debug/net9.0/dlh-net.csproj.FileListAbsolute.txt
View File

@ -6436,4 +6436,8 @@ C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\6f3wiwkvri-daan8q7dzx.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\2dj0mvx8q4-e22e0zot4m.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\j77vh0nmhu-dj4s7pxa1c.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\ee9ns2s4jk-so55gvvuwj.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\hc40dw3fux-zylckvraor.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\rpswa.dswa.cache.json
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjimswa.dswa.cache.json
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmrazor.dswa.cache.json
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmcshtml.dswa.cache.json
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\hc40dw3fux-ymjnsy4hf6.gz

BIN
obj/Debug/net9.0/dlh-net.dll
View File

Binary file not shown.

BIN
obj/Debug/net9.0/dlh-net.pdb
View File

Binary file not shown.

2
obj/Debug/net9.0/rbcswa.dswa.cache.json
View File

File diff suppressed because one or more lines are too long

BIN
obj/Debug/net9.0/ref/dlh-net.dll
View File

Binary file not shown.

BIN
obj/Debug/net9.0/refint/dlh-net.dll
View File

Binary file not shown.

2
obj/Debug/net9.0/rjimswa.dswa.cache.json
View File

File diff suppressed because one or more lines are too long

2
obj/Debug/net9.0/rjsmcshtml.dswa.cache.json
View File

File diff suppressed because one or more lines are too long

2
obj/Debug/net9.0/rjsmrazor.dswa.cache.json
View File

File diff suppressed because one or more lines are too long

2
obj/Debug/net9.0/rpswa.dswa.cache.json
View File

File diff suppressed because one or more lines are too long

2
obj/Debug/net9.0/staticwebassets.build.endpoints.json
View File

File diff suppressed because one or more lines are too long

2
obj/Debug/net9.0/staticwebassets.build.json
View File

File diff suppressed because one or more lines are too long

2
obj/Debug/net9.0/staticwebassets.build.json.cache
View File

@ -1 +1 @@
0wWrfoM026XQKG6BeDhAtmr6FPGd4/tzsCdbVBbDe9w=
tYTHXdZlEpDTNz+PACFcSRSmqSA080IMHFUyXyZu0MQ=

2
obj/Debug/net9.0/staticwebassets.development.json
View File

File diff suppressed because one or more lines are too long

2
obj/dlh-net.csproj.nuget.dgspec.json
View File

@ -76,7 +76,7 @@
"privateAssets": "all"
}
},
"runtimeIdentifierGraphPath": "C:\\Program Files\\dotnet\\sdk\\9.0.300/PortableRuntimeIdentifierGraph.json"
"runtimeIdentifierGraphPath": "C:\\Program Files\\dotnet\\sdk\\9.0.301/PortableRuntimeIdentifierGraph.json"
}
}
}

2
obj/project.assets.json
View File

@ -12189,7 +12189,7 @@
"privateAssets": "all"
}
},
"runtimeIdentifierGraphPath": "C:\\Program Files\\dotnet\\sdk\\9.0.300/PortableRuntimeIdentifierGraph.json"
"runtimeIdentifierGraphPath": "C:\\Program Files\\dotnet\\sdk\\9.0.301/PortableRuntimeIdentifierGraph.json"
}
}
}

2
obj/project.nuget.cache
View File

@ -1,6 +1,6 @@
{
"version": 2,
"dgSpecHash": "IeOUb0hCokk=",
"dgSpecHash": "UqREtMUn6nA=",
"success": true,
"projectFilePath": "C:\\laragon\\www\\dlh-net\\dlh-net.csproj",
"expectedPackageFiles": [

BIN
wwwroot/assets/images/layanan/pemohon.png 100644
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 556 KiB

504
wwwroot/css/output.css
View File

@ -25,14 +25,19 @@
--color-amber-100: oklch(96.2% 0.059 95.617);
--color-amber-200: oklch(92.4% 0.12 95.746);
--color-amber-300: oklch(87.9% 0.169 91.605);
--color-amber-400: oklch(82.8% 0.189 84.429);
--color-amber-500: oklch(76.9% 0.188 70.08);
--color-amber-600: oklch(66.6% 0.179 58.318);
--color-amber-700: oklch(55.5% 0.163 48.998);
--color-amber-800: oklch(47.3% 0.137 46.201);
--color-amber-900: oklch(41.4% 0.112 45.904);
--color-yellow-50: oklch(98.7% 0.026 102.212);
--color-yellow-100: oklch(97.3% 0.071 103.193);
--color-yellow-200: oklch(94.5% 0.129 101.54);
--color-yellow-300: oklch(90.5% 0.182 98.111);
--color-yellow-400: oklch(85.2% 0.199 91.936);
--color-yellow-500: oklch(79.5% 0.184 86.047);
--color-yellow-600: oklch(68.1% 0.162 75.834);
--color-yellow-700: oklch(55.4% 0.135 66.442);
--color-yellow-800: oklch(47.6% 0.114 61.907);
--color-green-50: oklch(98.2% 0.018 155.826);
@ -53,6 +58,7 @@
--color-emerald-800: oklch(43.2% 0.095 166.913);
--color-teal-50: oklch(98.4% 0.014 180.72);
--color-teal-100: oklch(95.3% 0.051 180.801);
--color-teal-200: oklch(91% 0.096 180.426);
--color-teal-300: oklch(85.5% 0.138 181.071);
--color-teal-500: oklch(70.4% 0.14 182.503);
--color-teal-600: oklch(60% 0.118 184.704);
@ -60,6 +66,10 @@
--color-teal-800: oklch(43.7% 0.078 188.216);
--color-cyan-50: oklch(98.4% 0.019 200.873);
--color-cyan-100: oklch(95.6% 0.045 203.388);
--color-cyan-200: oklch(91.7% 0.08 205.041);
--color-cyan-500: oklch(71.5% 0.143 215.221);
--color-cyan-600: oklch(60.9% 0.126 221.723);
--color-cyan-800: oklch(45% 0.085 224.283);
--color-blue-50: oklch(97% 0.014 254.604);
--color-blue-100: oklch(93.2% 0.032 255.585);
--color-blue-200: oklch(88.2% 0.059 254.128);
@ -71,16 +81,32 @@
--color-blue-800: oklch(42.4% 0.199 265.638);
--color-blue-900: oklch(37.9% 0.146 265.522);
--color-indigo-50: oklch(96.2% 0.018 272.314);
--color-indigo-100: oklch(93% 0.034 272.788);
--color-indigo-200: oklch(87% 0.065 274.039);
--color-indigo-600: oklch(51.1% 0.262 276.966);
--color-indigo-800: oklch(39.8% 0.195 277.366);
--color-purple-50: oklch(97.7% 0.014 308.299);
--color-purple-100: oklch(94.6% 0.033 307.174);
--color-purple-200: oklch(90.2% 0.063 306.703);
--color-purple-500: oklch(62.7% 0.265 303.9);
--color-purple-600: oklch(55.8% 0.288 302.321);
--color-purple-700: oklch(49.6% 0.265 301.924);
--color-purple-800: oklch(43.8% 0.218 303.724);
--color-pink-50: oklch(97.1% 0.014 343.198);
--color-pink-100: oklch(94.8% 0.028 342.258);
--color-pink-200: oklch(89.9% 0.061 343.231);
--color-pink-500: oklch(65.6% 0.241 354.308);
--color-pink-600: oklch(59.2% 0.249 0.584);
--color-pink-700: oklch(52.5% 0.223 3.958);
--color-pink-800: oklch(45.9% 0.187 3.815);
--color-rose-100: oklch(94.1% 0.03 12.58);
--color-rose-600: oklch(58.6% 0.253 17.585);
--color-rose-700: oklch(51.4% 0.222 16.935);
--color-slate-50: oklch(98.4% 0.003 247.858);
--color-slate-100: oklch(96.8% 0.007 247.896);
--color-slate-300: oklch(86.9% 0.022 252.894);
--color-slate-600: oklch(44.6% 0.043 257.281);
--color-slate-700: oklch(37.2% 0.044 257.287);
--color-gray-50: oklch(98.5% 0.002 247.839);
--color-gray-100: oklch(96.7% 0.003 264.542);
--color-gray-200: oklch(92.8% 0.006 264.531);
@ -140,7 +166,6 @@
--tracking-widest: 0.1em;
--leading-tight: 1.25;
--leading-relaxed: 1.625;
--radius-sm: 0.25rem;
--radius-md: 0.375rem;
--radius-lg: 0.5rem;
--radius-xl: 0.75rem;
@ -749,6 +774,9 @@
.mr-3 {
margin-right: calc(var(--spacing) * 3);
}
.mr-4 {
margin-right: calc(var(--spacing) * 4);
}
.mb-0 {
margin-bottom: calc(var(--spacing) * 0);
}
@ -909,6 +937,9 @@
.h-14 {
height: calc(var(--spacing) * 14);
}
.h-15 {
height: calc(var(--spacing) * 15);
}
.h-16 {
height: calc(var(--spacing) * 16);
}
@ -978,6 +1009,9 @@
.h-px {
height: 1px;
}
.max-h-screen {
max-height: 100vh;
}
.min-h-\[60vh\] {
min-height: 60vh;
}
@ -990,6 +1024,9 @@
.w-1\.5 {
width: calc(var(--spacing) * 1.5);
}
.w-1\/2 {
width: calc(1/2 * 100%);
}
.w-1\/3 {
width: calc(1/3 * 100%);
}
@ -1026,6 +1063,9 @@
.w-14 {
width: calc(var(--spacing) * 14);
}
.w-15 {
width: calc(var(--spacing) * 15);
}
.w-16 {
width: calc(var(--spacing) * 16);
}
@ -1250,6 +1290,9 @@
.rotate-45 {
rotate: 45deg;
}
.rotate-180 {
rotate: 180deg;
}
.-skew-x-12 {
--tw-skew-x: skewX(calc(12deg * -1));
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
@ -1287,6 +1330,9 @@
.grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.flex-col {
flex-direction: column;
}
@ -1512,6 +1558,10 @@
.rounded-xl {
border-radius: var(--radius-xl);
}
.rounded-t-lg {
border-top-left-radius: var(--radius-lg);
border-top-right-radius: var(--radius-lg);
}
.rounded-l-md {
border-top-left-radius: var(--radius-md);
border-bottom-left-radius: var(--radius-md);
@ -1583,15 +1633,24 @@
border-left-style: var(--tw-border-style);
border-left-width: 4px;
}
.border-amber-400 {
border-color: var(--color-amber-400);
}
.border-black {
border-color: var(--color-black);
}
.border-blue-100 {
border-color: var(--color-blue-100);
}
.border-blue-200 {
border-color: var(--color-blue-200);
}
.border-blue-500 {
border-color: var(--color-blue-500);
}
.border-cyan-200 {
border-color: var(--color-cyan-200);
}
.border-gray-100 {
border-color: var(--color-gray-100);
}
@ -1604,20 +1663,38 @@
.border-green-100 {
border-color: var(--color-green-100);
}
.border-green-200 {
border-color: var(--color-green-200);
}
.border-green-500 {
border-color: var(--color-green-500);
}
.border-green-600 {
border-color: var(--color-green-600);
}
.border-indigo-200 {
border-color: var(--color-indigo-200);
}
.border-orange-200 {
border-color: var(--color-orange-200);
}
.border-orange-500 {
border-color: var(--color-orange-500);
}
.border-purple-100 {
border-color: var(--color-purple-100);
.border-pink-200 {
border-color: var(--color-pink-200);
}
.border-purple-200 {
border-color: var(--color-purple-200);
}
.border-purple-500 {
border-color: var(--color-purple-500);
}
.border-teal-200 {
border-color: var(--color-teal-200);
}
.border-teal-500 {
border-color: var(--color-teal-500);
}
.border-white {
border-color: var(--color-white);
@ -1640,6 +1717,9 @@
border-color: color-mix(in oklab, var(--color-white) 30%, transparent);
}
}
.border-yellow-200 {
border-color: var(--color-yellow-200);
}
.bg-\[\#f49827\] {
background-color: #f49827;
}
@ -1655,6 +1735,9 @@
.bg-amber-500 {
background-color: var(--color-amber-500);
}
.bg-amber-600 {
background-color: var(--color-amber-600);
}
.bg-black {
background-color: var(--color-black);
}
@ -1676,6 +1759,12 @@
.bg-blue-500 {
background-color: var(--color-blue-500);
}
.bg-blue-600 {
background-color: var(--color-blue-600);
}
.bg-cyan-50 {
background-color: var(--color-cyan-50);
}
.bg-emerald-600 {
background-color: var(--color-emerald-600);
}
@ -1733,6 +1822,9 @@
.bg-green-700 {
background-color: var(--color-green-700);
}
.bg-indigo-50 {
background-color: var(--color-indigo-50);
}
.bg-orange-50 {
background-color: var(--color-orange-50);
}
@ -1766,6 +1858,9 @@
.bg-orange-700 {
background-color: var(--color-orange-700);
}
.bg-pink-50 {
background-color: var(--color-pink-50);
}
.bg-purple-50 {
background-color: var(--color-purple-50);
}
@ -1775,6 +1870,9 @@
.bg-purple-500 {
background-color: var(--color-purple-500);
}
.bg-purple-600 {
background-color: var(--color-purple-600);
}
.bg-red-400 {
background-color: var(--color-red-400);
}
@ -1787,9 +1885,27 @@
.bg-red-700 {
background-color: var(--color-red-700);
}
.bg-rose-100 {
background-color: var(--color-rose-100);
}
.bg-rose-600 {
background-color: var(--color-rose-600);
}
.bg-slate-100 {
background-color: var(--color-slate-100);
}
.bg-slate-600 {
background-color: var(--color-slate-600);
}
.bg-teal-50 {
background-color: var(--color-teal-50);
}
.bg-teal-100 {
background-color: var(--color-teal-100);
}
.bg-teal-500 {
background-color: var(--color-teal-500);
}
.bg-transparent {
background-color: transparent;
}
@ -1832,6 +1948,9 @@
background-color: color-mix(in oklab, var(--color-white) 90%, transparent);
}
}
.bg-yellow-50 {
background-color: var(--color-yellow-50);
}
.bg-yellow-100 {
background-color: var(--color-yellow-100);
}
@ -1883,13 +2002,6 @@
--tw-gradient-from: var(--color-black);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-black\/20 {
--tw-gradient-from: color-mix(in srgb, #000 20%, transparent);
@supports (color: color-mix(in lab, red, red)) {
--tw-gradient-from: color-mix(in oklab, var(--color-black) 20%, transparent);
}
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-black\/50 {
--tw-gradient-from: color-mix(in srgb, #000 50%, transparent);
@supports (color: color-mix(in lab, red, red)) {
@ -1922,8 +2034,12 @@
--tw-gradient-from: var(--color-blue-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-blue-400 {
--tw-gradient-from: var(--color-blue-400);
.from-blue-500 {
--tw-gradient-from: var(--color-blue-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-blue-600 {
--tw-gradient-from: var(--color-blue-600);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-blue-700 {
@ -2000,6 +2116,10 @@
--tw-gradient-from: var(--color-slate-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-teal-500 {
--tw-gradient-from: var(--color-teal-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-transparent {
--tw-gradient-from: transparent;
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@ -2104,6 +2224,11 @@
--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-via-stops);
}
.via-orange-600 {
--tw-gradient-via: var(--color-orange-600);
--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-via-stops);
}
.via-red-600 {
--tw-gradient-via: var(--color-red-600);
--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
@ -2150,12 +2275,8 @@
}
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-blue-50 {
--tw-gradient-to: var(--color-blue-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-blue-600 {
--tw-gradient-to: var(--color-blue-600);
.to-blue-800 {
--tw-gradient-to: var(--color-blue-800);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-blue-900 {
@ -2166,6 +2287,10 @@
--tw-gradient-to: var(--color-cyan-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-cyan-500 {
--tw-gradient-to: var(--color-cyan-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-emerald-50 {
--tw-gradient-to: var(--color-emerald-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@ -2233,8 +2358,8 @@
--tw-gradient-to: var(--color-pink-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-purple-50 {
--tw-gradient-to: var(--color-purple-50);
.to-purple-500 {
--tw-gradient-to: var(--color-purple-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-red-50 {
@ -2661,9 +2786,15 @@
.text-amber-600 {
color: var(--color-amber-600);
}
.text-amber-700 {
color: var(--color-amber-700);
}
.text-amber-800 {
color: var(--color-amber-800);
}
.text-amber-900 {
color: var(--color-amber-900);
}
.text-black {
color: var(--color-black);
}
@ -2682,6 +2813,12 @@
.text-blue-800 {
color: var(--color-blue-800);
}
.text-cyan-600 {
color: var(--color-cyan-600);
}
.text-cyan-800 {
color: var(--color-cyan-800);
}
.text-gray-200 {
color: var(--color-gray-200);
}
@ -2724,6 +2861,12 @@
.text-green-800 {
color: var(--color-green-800);
}
.text-indigo-600 {
color: var(--color-indigo-600);
}
.text-indigo-800 {
color: var(--color-indigo-800);
}
.text-orange-300 {
color: var(--color-orange-300);
}
@ -2736,15 +2879,30 @@
.text-orange-800 {
color: var(--color-orange-800);
}
.text-pink-600 {
color: var(--color-pink-600);
}
.text-pink-800 {
color: var(--color-pink-800);
}
.text-purple-600 {
color: var(--color-purple-600);
}
.text-purple-800 {
color: var(--color-purple-800);
}
.text-red-500 {
color: var(--color-red-500);
}
.text-rose-600 {
color: var(--color-rose-600);
}
.text-slate-300 {
color: var(--color-slate-300);
}
.text-slate-600 {
color: var(--color-slate-600);
}
.text-teal-600 {
color: var(--color-teal-600);
}
@ -2778,6 +2936,12 @@
.text-yellow-300 {
color: var(--color-yellow-300);
}
.text-yellow-500 {
color: var(--color-yellow-500);
}
.text-yellow-600 {
color: var(--color-yellow-600);
}
.text-yellow-800 {
color: var(--color-yellow-800);
}
@ -2886,10 +3050,6 @@
--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.shadow-xs {
--tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.ring {
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@ -3060,6 +3220,14 @@
}
}
}
.group-hover\:translate-x-1 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
--tw-translate-x: calc(var(--spacing) * 1);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
}
}
.group-hover\:translate-x-\[100\%\] {
&:is(:where(.group):hover *) {
@media (hover: hover) {
@ -3127,6 +3295,20 @@
}
}
}
.group-hover\:bg-amber-600 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
background-color: var(--color-amber-600);
}
}
}
.group-hover\:bg-blue-600 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
background-color: var(--color-blue-600);
}
}
}
.group-hover\:bg-green-500 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
@ -3144,6 +3326,13 @@
}
}
}
.group-hover\:bg-green-600 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
background-color: var(--color-green-600);
}
}
}
.group-hover\:bg-orange-600 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
@ -3151,6 +3340,27 @@
}
}
}
.group-hover\:bg-purple-600 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
background-color: var(--color-purple-600);
}
}
}
.group-hover\:bg-rose-600 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
background-color: var(--color-rose-600);
}
}
}
.group-hover\:bg-slate-600 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
background-color: var(--color-slate-600);
}
}
}
.group-hover\:bg-white {
&:is(:where(.group):hover *) {
@media (hover: hover) {
@ -3196,13 +3406,6 @@
}
}
}
.group-hover\:text-purple-600 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
color: var(--color-purple-600);
}
}
}
.group-hover\:text-white {
&:is(:where(.group):hover *) {
@media (hover: hover) {
@ -3307,14 +3510,6 @@
}
}
}
.hover\:-translate-y-0\.5 {
&:hover {
@media (hover: hover) {
--tw-translate-y: calc(var(--spacing) * -0.5);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
}
}
.hover\:-translate-y-1 {
&:hover {
@media (hover: hover) {
@ -3366,10 +3561,10 @@
}
}
}
.hover\:border-green-200 {
.hover\:border-orange-400 {
&:hover {
@media (hover: hover) {
border-color: var(--color-green-200);
border-color: var(--color-orange-400);
}
}
}
@ -3380,13 +3575,6 @@
}
}
}
.hover\:border-purple-200 {
&:hover {
@media (hover: hover) {
border-color: var(--color-purple-200);
}
}
}
.hover\:bg-amber-200 {
&:hover {
@media (hover: hover) {
@ -3394,10 +3582,38 @@
}
}
}
.hover\:bg-amber-600 {
.hover\:bg-amber-700 {
&:hover {
@media (hover: hover) {
background-color: var(--color-amber-600);
background-color: var(--color-amber-700);
}
}
}
.hover\:bg-blue-100 {
&:hover {
@media (hover: hover) {
background-color: var(--color-blue-100);
}
}
}
.hover\:bg-blue-700 {
&:hover {
@media (hover: hover) {
background-color: var(--color-blue-700);
}
}
}
.hover\:bg-cyan-100 {
&:hover {
@media (hover: hover) {
background-color: var(--color-cyan-100);
}
}
}
.hover\:bg-gray-50 {
&:hover {
@media (hover: hover) {
background-color: var(--color-gray-50);
}
}
}
@ -3408,6 +3624,13 @@
}
}
}
.hover\:bg-green-100 {
&:hover {
@media (hover: hover) {
background-color: var(--color-green-100);
}
}
}
.hover\:bg-green-600 {
&:hover {
@media (hover: hover) {
@ -3422,6 +3645,13 @@
}
}
}
.hover\:bg-indigo-100 {
&:hover {
@media (hover: hover) {
background-color: var(--color-indigo-100);
}
}
}
.hover\:bg-orange-50 {
&:hover {
@media (hover: hover) {
@ -3443,6 +3673,62 @@
}
}
}
.hover\:bg-orange-700 {
&:hover {
@media (hover: hover) {
background-color: var(--color-orange-700);
}
}
}
.hover\:bg-pink-100 {
&:hover {
@media (hover: hover) {
background-color: var(--color-pink-100);
}
}
}
.hover\:bg-purple-100 {
&:hover {
@media (hover: hover) {
background-color: var(--color-purple-100);
}
}
}
.hover\:bg-purple-700 {
&:hover {
@media (hover: hover) {
background-color: var(--color-purple-700);
}
}
}
.hover\:bg-red-700 {
&:hover {
@media (hover: hover) {
background-color: var(--color-red-700);
}
}
}
.hover\:bg-rose-700 {
&:hover {
@media (hover: hover) {
background-color: var(--color-rose-700);
}
}
}
.hover\:bg-slate-700 {
&:hover {
@media (hover: hover) {
background-color: var(--color-slate-700);
}
}
}
.hover\:bg-teal-100 {
&:hover {
@media (hover: hover) {
background-color: var(--color-teal-100);
}
}
}
.hover\:bg-white {
&:hover {
@media (hover: hover) {
@ -3460,6 +3746,13 @@
}
}
}
.hover\:bg-yellow-100 {
&:hover {
@media (hover: hover) {
background-color: var(--color-yellow-100);
}
}
}
.hover\:from-green-100 {
&:hover {
@media (hover: hover) {
@ -3539,6 +3832,13 @@
}
}
}
.hover\:text-gray-600 {
&:hover {
@media (hover: hover) {
color: var(--color-gray-600);
}
}
}
.hover\:text-gray-700 {
&:hover {
@media (hover: hover) {
@ -3546,6 +3846,13 @@
}
}
}
.hover\:text-gray-800 {
&:hover {
@media (hover: hover) {
color: var(--color-gray-800);
}
}
}
.hover\:text-gray-900 {
&:hover {
@media (hover: hover) {
@ -3595,13 +3902,6 @@
}
}
}
.hover\:text-purple-800 {
&:hover {
@media (hover: hover) {
color: var(--color-purple-800);
}
}
}
.hover\:text-white {
&:hover {
@media (hover: hover) {
@ -3668,6 +3968,11 @@
}
}
}
.focus\:border-blue-500 {
&:focus {
border-color: var(--color-blue-500);
}
}
.focus\:border-green-500 {
&:focus {
border-color: var(--color-green-500);
@ -3856,6 +4161,11 @@
margin-bottom: calc(var(--spacing) * 0);
}
}
.md\:ml-6 {
@media (width >= 48rem) {
margin-left: calc(var(--spacing) * 6);
}
}
.md\:block {
@media (width >= 48rem) {
display: block;
@ -3916,21 +4226,11 @@
width: calc(1/3 * 100%);
}
}
.md\:w-1\/4 {
@media (width >= 48rem) {
width: calc(1/4 * 100%);
}
}
.md\:w-2\/3 {
@media (width >= 48rem) {
width: calc(2/3 * 100%);
}
}
.md\:w-3\/4 {
@media (width >= 48rem) {
width: calc(3/4 * 100%);
}
}
.md\:w-5 {
@media (width >= 48rem) {
width: calc(var(--spacing) * 5);
@ -3961,6 +4261,11 @@
max-width: 100%;
}
}
.md\:flex-1 {
@media (width >= 48rem) {
flex: 1;
}
}
.md\:scale-100 {
@media (width >= 48rem) {
--tw-scale-x: 100%;
@ -4081,6 +4386,11 @@
padding-inline: calc(var(--spacing) * 0);
}
}
.md\:px-4 {
@media (width >= 48rem) {
padding-inline: calc(var(--spacing) * 4);
}
}
.md\:py-32 {
@media (width >= 48rem) {
padding-block: calc(var(--spacing) * 32);
@ -4185,16 +4495,66 @@
grid-column: span 1 / span 1;
}
}
.lg\:col-span-2 {
@media (width >= 64rem) {
grid-column: span 2 / span 2;
}
}
.lg\:col-span-3 {
@media (width >= 64rem) {
grid-column: span 3 / span 3;
}
}
.lg\:col-span-4 {
@media (width >= 64rem) {
grid-column: span 4 / span 4;
}
}
.lg\:col-span-6 {
@media (width >= 64rem) {
grid-column: span 6 / span 6;
}
}
.lg\:col-span-8 {
@media (width >= 64rem) {
grid-column: span 8 / span 8;
}
}
.lg\:col-span-9 {
@media (width >= 64rem) {
grid-column: span 9 / span 9;
}
}
.lg\:col-span-10 {
@media (width >= 64rem) {
grid-column: span 10 / span 10;
}
}
.lg\:col-span-12 {
@media (width >= 64rem) {
grid-column: span 12 / span 12;
}
}
.lg\:mx-0 {
@media (width >= 64rem) {
margin-inline: calc(var(--spacing) * 0);
}
}
.lg\:mb-0 {
@media (width >= 64rem) {
margin-bottom: calc(var(--spacing) * 0);
}
}
.lg\:mb-6 {
@media (width >= 64rem) {
margin-bottom: calc(var(--spacing) * 6);
}
}
.lg\:ml-8 {
@media (width >= 64rem) {
margin-left: calc(var(--spacing) * 8);
}
}
.lg\:block {
@media (width >= 64rem) {
display: block;
@ -4225,6 +4585,11 @@
width: calc(var(--spacing) * 8);
}
}
.lg\:flex-1 {
@media (width >= 64rem) {
flex: 1;
}
}
.lg\:grid-cols-2 {
@media (width >= 64rem) {
grid-template-columns: repeat(2, minmax(0, 1fr));
@ -4240,6 +4605,11 @@
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
.lg\:grid-cols-12 {
@media (width >= 64rem) {
grid-template-columns: repeat(12, minmax(0, 1fr));
}
}
.lg\:flex-row {
@media (width >= 64rem) {
flex-direction: row;