From 1d3ee20aa78c732406266c08505c81a647d60310 Mon Sep 17 00:00:00 2001
From: Yuri Dimas <yuri@impstudio.co.id>
Date: Thu, 9 Oct 2025 23:47:12 +0700
Subject: [PATCH] style: add modal filter

---
 Views/DataBankSampah/Index.cshtml | 41 ++++++++++++++++++++++++++++++-
 1 file changed, 40 insertions(+), 1 deletion(-)

diff --git a/Views/DataBankSampah/Index.cshtml b/Views/DataBankSampah/Index.cshtml
index f141877..38253c9 100644
--- a/Views/DataBankSampah/Index.cshtml
+++ b/Views/DataBankSampah/Index.cshtml
@@ -4,14 +4,53 @@
     ViewData["DataBankSampahActive"] = "menu-active";
 }
 
-<div class="flex">
+<div class="flex flex-col gap-2 md:flex-row md:justify-between md:gap-0">
     <div class="prose">
         <span class="text-xl font-semibold text-black">
             Data Bank Sampah
         </span>
     </div>
+
+    <div>
+        <button class="btn btn-sm rounded-full bg-white" onclick="modal_filter.showModal()">
+            <i class="ph ph-funnel-simple"></i>
+            Filter
+        </button>
+    </div>
 </div>
 
+<!-- Modal Filter -->
+<dialog id="modal_filter" class="modal modal-bottom sm:modal-middle">
+    <div class="modal-box w-full sm:max-w-sm">
+        <h3 class="text-lg font-bold">Filter</h3>
+        <form action="#" method="get">
+            <fieldset class="fieldset">
+                <legend class="fieldset-legend">Jenis Bank Sampah</legend>
+                <select class="select w-full">
+                    <option disabled selected>Pilih salah satu</option>
+                </select>
+            </fieldset>
+            <fieldset class="fieldset">
+                <legend class="fieldset-legend">Kategori Bank Sampah</legend>
+                <select class="select w-full">
+                    <option disabled selected>Pilih salah satu</option>
+                </select>
+            </fieldset>
+            <fieldset class="fieldset">
+                <legend class="fieldset-legend">Status Bank Sampah</legend>
+                <select class="select w-full">
+                    <option disabled selected>Pilih salah satu</option>
+                </select>
+            </fieldset>
+            <div class="modal-action">
+                <button type="button" class="btn btn-outline rounded-full" onclick="modal_filter.close()">Tutup</button>
+                <button type="submit" class="btn bg-bank-sampah-primary-500 rounded-full text-white">Terapkan</button>
+            </div>
+        </form>
+    </div>
+</dialog>
+<!-- /modal filter -->
+
 <div class="h-6"></div>
 
 <div class="card bg-white">