banksampah
/
bank-sampah
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style: change styling menu & add space between menu

main
Yuri Dimas 2025-12-17 11:53:57 +07:00
parent 405af63b47
commit 29a13183a0
No known key found for this signature in database
GPG Key ID: 9FD7E44BC294C68C
2 changed files with 64 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
Views/Shared/_SidebarUnified.cshtml
View File

@ -21,36 +21,36 @@
<!-- Sidebar content here -->
<div class="flex-1 overflow-y-auto">
<ul class="menu menu-sidebar bg-base-100 text-base-content min-h-full w-full overscroll-y-none p-4">
<ul class="menu menu-sidebar bg-base-100 text-base-content min-h-full w-full overscroll-y-none p-4 space-y-2">
<!-- Dashboard -->
<li>
<a asp-controller="Dashboard" asp-action="Index" class="w-full rounded-full @(controller == "Dashboard" ? "menu-active" : "")">
<i class="ph ph-gauge me-2 text-lg"></i>
<a asp-controller="Dashboard" asp-action="Index" class="@(controller == "Dashboard" ? "menu-active" : "")">
<i class="ph ph-gauge me-2 text-lg text-gray-400"></i>
Dashboard
</a>
</li>
<!-- Dashboard Nasabah -->
<li>
<a asp-controller="DashboardNasabah" asp-action="Index" class="w-full rounded-full @(controller == "DashboardNasabah" ? "menu-active" : "")">
<i class="ph ph-gauge me-2 text-lg"></i>
<a asp-controller="DashboardNasabah" asp-action="Index" class="@(controller == "DashboardNasabah" ? "menu-active" : "")">
<i class="ph ph-gauge me-2 text-lg text-gray-400"></i>
Dashboard Nasabah
</a>
</li>
<!-- Dashboard BSU -->
<li>
<a asp-controller="DashboardBsu" asp-action="Index" class="w-full rounded-full @(controller == "DashboardBsu" ? "menu-active" : "")">
<i class="ph ph-gauge me-2 text-lg"></i>
<a asp-controller="DashboardBsu" asp-action="Index" class="@(controller == "DashboardBsu" ? "menu-active" : "")">
<i class="ph ph-gauge me-2 text-lg text-gray-400"></i>
Dashboard BSU
</a>
</li>
<!-- Dashboard BSI -->
<li>
<a asp-controller="DashboardBsi" asp-action="Index" class="w-full rounded-full @(controller == "DashboardBsi" ? "menu-active" : "")">
<i class="ph ph-gauge me-2 text-lg"></i>
<a asp-controller="DashboardBsi" asp-action="Index" class="@(controller == "DashboardBsi" ? "menu-active" : "")">
<i class="ph ph-gauge me-2 text-lg text-gray-400"></i>
Dashboard BSI
</a>
</li>
@ -58,16 +58,16 @@
<!-- Data Bank Sampah -->
<li>
<a asp-controller="DataBankSampah" asp-action="Index" class="rounded-full @(controller == "DataBankSampah" ? "menu-active" : "")">
<i class="ph ph-house-line me-2 text-lg"></i>
<a asp-controller="DataBankSampah" asp-action="Index" class="@(controller == "DataBankSampah" ? "menu-active" : "")">
<i class="ph ph-house-line me-2 text-lg text-gray-400"></i>
Data Bank Sampah
</a>
</li>
<!-- Data Nasabah -->
<li>
<a asp-controller="DataNasabah" asp-action="Index" class="rounded-full @(controller == "DataNasabah" ? "menu-active" : "")">
<i class="ph ph-users-four me-2 text-lg"></i>
<a asp-controller="DataNasabah" asp-action="Index" class="@(controller == "DataNasabah" ? "menu-active" : "")">
<i class="ph ph-users-four me-2 text-lg text-gray-400"></i>
Data Nasabah
</a>
</li>
@ -76,7 +76,7 @@
<li>
<details @(module == "Data" && new[] { "Nasabah", "BankSampahInduk", "BankSampahUnit", "Aktivitas", "HargaSampah", "Offtaker", "PotensiRumah" }.Contains(controller) ? "open" : "")>
<summary>
<i class="ph ph-database me-2 text-lg"></i>
<i class="ph ph-database me-2 text-lg text-gray-400"></i>
Data
</summary>
<ul>
@ -95,7 +95,7 @@
<li>
<details @(module == "Transaksi" && new[] { "Nasabah", "PenarikanTabungan", "Bsi", "TransaksiOfftaker", "LaporanTransaksi", "SedekahSampah" }.Contains(controller) ? "open" : "")>
<summary>
<i class="ph ph-cash-register me-2 text-lg"></i>
<i class="ph ph-cash-register me-2 text-lg text-gray-400"></i>
Transaksi
</summary>
<ul>
@ -109,27 +109,26 @@
</details>
</li>
<!-- Data Offtaker -->
<li>
<a asp-controller="DataOfftaker" asp-action="Index" class="rounded-full @(controller == "DataOfftaker" ? "menu-active" : "")">
<i class="ph ph-read-cv-logo me-2 text-lg"></i>
<a asp-controller="DataOfftaker" asp-action="Index" class="@(controller == "DataOfftaker" ? "menu-active" : "")">
<i class="ph ph-read-cv-logo me-2 text-lg text-gray-400"></i>
Data Offtaker
</a>
</li>
<!-- Data Kelurahan -->
<li>
<a asp-controller="DataKelurahan" asp-action="Index" class="rounded-full @(controller == "DataKelurahan" ? "menu-active" : "")">
<i class="ph ph-buildings me-2 text-lg"></i>
<a asp-controller="DataKelurahan" asp-action="Index" class="@(controller == "DataKelurahan" ? "menu-active" : "")">
<i class="ph ph-buildings me-2 text-lg text-gray-400"></i>
Data Kelurahan
</a>
</li>
<!-- Transaksi Laporan -->
<li>
<a asp-controller="TransaksiLaporan" asp-action="Index" class="rounded-full @(controller == "TransaksiLaporan" ? "menu-active" : "")">
<i class="ph ph-database me-2 text-lg"></i>
<a asp-controller="TransaksiLaporan" asp-action="Index" class="@(controller == "TransaksiLaporan" ? "menu-active" : "")">
<i class="ph ph-database me-2 text-lg text-gray-400"></i>
Transaksi Laporan
</a>
</li>
@ -138,7 +137,7 @@
<li>
<details @(module == "Wilayah" && new[] { "Kota", "Kecamatan", "Kelurahan" }.Contains(controller) ? "open" : "")>
<summary>
<i class="ph ph-map-trifold me-2 text-lg"></i>
<i class="ph ph-map-trifold me-2 text-lg text-gray-400"></i>
Wilayah
</summary>
<ul>
@ -153,7 +152,7 @@
<li>
<details @(module == "Master" && new[] { "Aktivitas", "Artikel", "Pendamping","BadanHukum", "Fasilitas", "JenisBankSampah", "JenisNasabah", "JenisPengolahan", "Kategori", "KategoriFasilitas", "Mitra", "StatusLahan", "JenisSampah", "KategoriSampah", "SubKategoriSampah", "Lokasi" }.Contains(controller) ? "open" : "")>
<summary>
<i class="ph ph-database me-2 text-lg"></i>
<i class="ph ph-database me-2 text-lg text-gray-400"></i>
Master Data
</summary>
<ul>
@ -179,35 +178,35 @@
<!-- CMS -->
<li>
<a asp-controller="Cms" class="rounded-full @(controller == "Cms" ? "menu-active" : "")">
<i class="ph ph-newspaper me-2 text-lg"></i>
<a asp-controller="Cms" class="@(controller == "Cms" ? "menu-active" : "")">
<i class="ph ph-newspaper me-2 text-lg text-gray-400"></i>
CMS
</a>
</li>
<!-- Reduksi -->
<li>
<a asp-controller="ReduksiSampahDinas" class="rounded-full @(controller == "ReduksiSampahDinas" ? "menu-active" : "")">
<i class="ph ph-database me-2 text-lg"></i>
<a asp-controller="ReduksiSampahDinas" class="@(controller == "ReduksiSampahDinas" ? "menu-active" : "")">
<i class="ph ph-database me-2 text-lg text-gray-400"></i>
Reduksi Sampah Dinas
</a>
</li>
<li>
<a asp-controller="ReduksiSampahSatpel" class="rounded-full @(controller == "ReduksiSampahSatpel" ? "menu-active" : "")">
<i class="ph ph-database me-2 text-lg"></i>
<a asp-controller="ReduksiSampahSatpel" class="@(controller == "ReduksiSampahSatpel" ? "menu-active" : "")">
<i class="ph ph-database me-2 text-lg text-gray-400"></i>
Reduksi Sampah Satpel
</a>
</li>
<li>
<a asp-controller="ReduksiSampahSudin" class="rounded-full @(controller == "ReduksiSampahSudin" ? "menu-active" : "")">
<i class="ph ph-database me-2 text-lg"></i>
<a asp-controller="ReduksiSampahSudin" class="@(controller == "ReduksiSampahSudin" ? "menu-active" : "")">
<i class="ph ph-database me-2 text-lg text-gray-400"></i>
Reduksi Sampah Sudin
</a>
</li>
<!-- <li>
<details @(new[] { "Maggot", "Composting", "ReduksiSampah", "BankSampah" }.Contains(controller) ? "open" : "")>
<summary>
<i class="ph ph-database me-2 text-lg"></i>
<i class="ph ph-database me-2 text-lg text-gray-400"></i>
Reduksi
</summary>
<ul>
@ -221,48 +220,48 @@
<!-- Ganti Password -->
<li>
<a href="https://akun.dinaslhdki.id/" target="_blank" class="rounded-full">
<i class="ph ph-lock-key me-2 text-lg"></i>
<a href="https://akun.dinaslhdki.id/" target="_blank">
<i class="ph ph-lock-key me-2 text-lg text-gray-400"></i>
Ganti Password
</a>
</li>
<!-- Profil -->
<li>
<a asp-controller="Profil" class="rounded-full @(controller == "Profil" ? "menu-active" : "")">
<i class="ph ph-user-square me-2 text-lg"></i>
<a asp-controller="Profil" class="@(controller == "Profil" ? "menu-active" : "")">
<i class="ph ph-user-square me-2 text-lg text-gray-400"></i>
Profil Bank Sampah
</a>
</li>
<!-- Aktifitas -->
<li>
<a asp-controller="Aktifitas" class="rounded-full @(controller == "Aktifitas" ? "menu-active" : "")">
<i class="ph ph-activity me-2 text-lg"></i>
<a asp-controller="Aktifitas" class="@(controller == "Aktifitas" ? "menu-active" : "")">
<i class="ph ph-activity me-2 text-lg text-gray-400"></i>
Aktifitas
</a>
</li>
<!-- Nasabah -->
<li>
<a asp-controller="ProfilNasabah" asp-action="Index" class="rounded-full @(controller == "ProfilNasabah" ? "menu-active" : "")">
<i class="ph ph-user-circle me-2 text-lg"></i>
<a asp-controller="ProfilNasabah" asp-action="Index" class="@(controller == "ProfilNasabah" ? "menu-active" : "")">
<i class="ph ph-user-circle me-2 text-lg text-gray-400"></i>
Profil Nasabah
</a>
</li>
<!-- Bank Sampah Nasabah -->
<li>
<a asp-controller="BankSampahNasabah" asp-action="Index" class="rounded-full @(controller == "BankSampahNasabah" ? "menu-active" : "")">
<i class="ph ph-bank me-2 text-lg"></i>
<a asp-controller="BankSampahNasabah" asp-action="Index" class="@(controller == "BankSampahNasabah" ? "menu-active" : "")">
<i class="ph ph-bank me-2 text-lg text-gray-400"></i>
Bank Sampah Nasabah
</a>
</li>
<!-- Transaksi Nasabah -->
<li>
<a asp-controller="TransaksiNasabah" asp-action="Index" class="rounded-full @(controller == "TransaksiNasabah" ? "menu-active" : "")">
<i class="ph ph-currency-circle-dollar me-2 text-lg"></i>
<a asp-controller="TransaksiNasabah" asp-action="Index" class="@(controller == "TransaksiNasabah" ? "menu-active" : "")">
<i class="ph ph-currency-circle-dollar me-2 text-lg text-gray-400"></i>
Transaksi Nasabah
</a>
</li>
@ -274,7 +273,7 @@
<div class="card w-fit bg-linear-to-tl from-[#FFDBAC] to-[#F79009] text-white">
<div class="card-body px-2 py-4">
<div class="card-title">
<i class="ph ph-whatsapp-logo text-lg"></i>
<i class="ph ph-whatsapp-logo text-lg text-gray-400"></i>
Help Desk
</div>
<hr class="text-white/30" />

24
wwwroot/css/input.css
View File

@ -178,24 +178,32 @@
.menu-sidebar a,
.menu-sidebar summary {
@apply rounded-full transition-colors duration-200;
@apply transition-colors duration-200 border-0 shadow-none rounded-full;
}
/* Untuk semua item sidebar (normal + collapsible summary) */
.menu-sidebar a {
@apply text-gray-500 font-medium;
}
.menu-sidebar summary {
@apply text-gray-500 font-medium;
}
.menu-sidebar details ul {
@apply space-y-2 py-2;
}
/* Hover / Active / Open state */
.menu-sidebar a:hover,
.menu-sidebar a:active,
.menu-sidebar a.menu-active,
.menu-sidebar details > summary:hover,
.menu-sidebar details > summary:active,
.menu-sidebar details[open] > summary {
@apply bg-bank-sampah-primary-500 text-white shadow-none;
}
/* Untuk link di dalam isi collapsible */
.menu-sidebar details[open] > summary,
.menu-sidebar details[open] > ul a:hover,
.menu-sidebar details[open] > ul a:active,
.menu-sidebar details[open] > ul a.menu-active {
@apply text-bank-sampah-primary-500 bg-transparent font-bold shadow-none;
@apply bg-bank-sampah-primary-500 text-white;
}
.badge {