style: slicing page dashboard, sidebar, navbar
parent
a996bdf837
commit
1fd4a7e6b1
|
|
@ -0,0 +1,17 @@
|
|||
using Microsoft.AspNetCore.Mvc;
|
||||
|
||||
namespace BpsRw.Controllers
|
||||
{
|
||||
public class DashboardController : Controller
|
||||
{
|
||||
public IActionResult Index()
|
||||
{
|
||||
return View();
|
||||
}
|
||||
|
||||
public IActionResult Reports()
|
||||
{
|
||||
return View();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
@{
|
||||
Layout = "_LayoutApp";
|
||||
ViewData["Title"] = "Dashboard";
|
||||
}
|
||||
|
|
@ -57,9 +57,9 @@
|
|||
|
||||
<!-- Login Button -->
|
||||
<div class="flex-1 flex justify-end items-center gap-4">
|
||||
<button class="px-8 py-2.5 bg-green-800 hover:bg-green-700 rounded-full flex justify-center items-center gap-2 transition-colors">
|
||||
<a href="@Url.Action("Index", "Dashboard")" class="btn btn-success rounded-full shadow-none bg-bpsrw-500 border-0">
|
||||
<span class="text-white text-base font-semibold font-jakarta leading-normal">Login</span>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Mobile Menu Button -->
|
||||
|
|
|
|||
|
|
@ -0,0 +1,60 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" data-theme="light">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>@ViewData["Title"] - BPS RW</title>
|
||||
|
||||
<!-- Meta tags untuk SEO -->
|
||||
<meta name="description" content="Aplikasi Bank Sampah Digital untuk mengelola sampah dan mendapatkan reward">
|
||||
<meta name="keywords" content="bank sampah, recycle, environment, go green, sampah">
|
||||
<meta name="author" content="Bank Sampah Digital">
|
||||
|
||||
<!-- Open Graph Meta Tags -->
|
||||
<meta property="og:title" content="@ViewData[" Title"] - Bank Sampah Digital">
|
||||
<meta property="og:description" content="Kelola sampah Anda dengan mudah dan dapatkan reward!">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<!-- Google Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap"
|
||||
rel="stylesheet">
|
||||
|
||||
<!-- Phosphor Icons -->
|
||||
<link rel="stylesheet" type="text/css"
|
||||
href="https://cdn.jsdelivr.net/npm/@@phosphor-icons/web@2.1.2/src/regular/style.css" />
|
||||
<link rel="stylesheet" type="text/css"
|
||||
href="https://cdn.jsdelivr.net/npm/@@phosphor-icons/web@2.1.2/src/fill/style.css" />
|
||||
|
||||
<!-- Material Icon -->
|
||||
<link rel="stylesheet"
|
||||
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
|
||||
|
||||
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
|
||||
</head>
|
||||
|
||||
<body class="bg-gray-100 min-h-dvh font-sans antialiased">
|
||||
<div class="drawer md:drawer-open">
|
||||
<input id="my-drawer-2" type="checkbox" class="drawer-toggle" />
|
||||
<div class="drawer-content">
|
||||
@await Html.PartialAsync("_Navbar")
|
||||
<!-- Page content here -->
|
||||
<main class="container mx-auto p-6">
|
||||
@RenderBody()
|
||||
</main>
|
||||
</div>
|
||||
<div class="drawer-side z-50 lg:z-0">
|
||||
@await Html.PartialAsync("_Sidebar")
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script src="~/js/site.js" asp-append-version="true"></script>
|
||||
@await RenderSectionAsync("Scripts", required: false)
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<div class="navbar sticky top-0 z-20 w-full justify-between bg-base-100 lg:justify-end">
|
||||
<div class="navbar-start">
|
||||
<label for="my-drawer-2" class="btn bg-bpsrw-500 text-white drawer-button btn-square lg:hidden">
|
||||
<span class="icon icon-outline">menu_open</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="navbar-end gap-4">
|
||||
<label class="input rounded-full bg-gray-100">
|
||||
<span class="icon icon-outline text-gray-400">search</span>
|
||||
<input type="search" required placeholder="Cari berkas atau data..." />
|
||||
</label>
|
||||
<button class="btn btn-ghost btn-square border-gray-200 rounded-lg">
|
||||
<span class="icon icon-outline">help</span>
|
||||
</button>
|
||||
<button class="btn btn-ghost btn-square border-gray-200 rounded-lg avatar avatar-online">
|
||||
<span class="icon icon-outline">notifications</span>
|
||||
</button>
|
||||
<div class="divider divider-horizontal m-0"></div>
|
||||
<div class="dropdown dropdown-end">
|
||||
<div tabindex="0" role="button" class="btn btn-ghost btn-circle avatar border-2 border-bpsrw-500">
|
||||
<div class="w-10 rounded-full">
|
||||
<img alt="Avatar"
|
||||
src="https://img.daisyui.com/images/stock/photo-1534528741775-53994a69daeb.webp" />
|
||||
</div>
|
||||
</div>
|
||||
<ul tabindex="0" class="menu menu-sm dropdown-content bg-base-100 rounded-box z-1 mt-3 w-52 p-2 shadow">
|
||||
<li><a>Profile</a></li>
|
||||
<li><a>Settings</a></li>
|
||||
<li><a href="@Url.Action("Index", "Home")">Logout</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,137 @@
|
|||
<label class="drawer-overlay" for="my-drawer-2" aria-label="close sidebar"></label>
|
||||
|
||||
<aside class="min-h-screen bg-base-100 border-e border-gray-200">
|
||||
<!-- Navbar -->
|
||||
<div
|
||||
class="navbar sticky top-0 hidden border-b border-gray-200 items-center justify-center gap-2 bg-profiling-500 px-4 py-2 font-bold lg:z-50 lg:flex">
|
||||
<img src="/images/logo.png" alt="Logo" width="48" />
|
||||
<span>BPS RW</span>
|
||||
</div>
|
||||
<ul class="menu menu-sidebar bg-base-100 text-base-content min-h-full w-80 p-4">
|
||||
<!-- Sidebar content here -->
|
||||
<li>
|
||||
<a class="text-gray-500 menu-active">
|
||||
<span class="icon icon-fill">analytics</span>
|
||||
Dashboard
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<details open>
|
||||
<summary class="text-bpsrw-500 font-semibold">DATA SUDIN</summary>
|
||||
<ul>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">house</span>
|
||||
Rumah Memilah
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">playlist_add_check</span>
|
||||
Checklist Harian
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</li>
|
||||
<li>
|
||||
<details open>
|
||||
<summary class="text-bpsrw-500 font-semibold">DATA KECAMATAN</summary>
|
||||
<ul>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">list</span>
|
||||
Data Kecamatan
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">house</span>
|
||||
Rumah Memilah
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">playlist_add_check</span>
|
||||
Checklist Harian
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">list</span>
|
||||
Data RW
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">list</span>
|
||||
Data RT
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</li>
|
||||
<li>
|
||||
<details open>
|
||||
<summary class="text-bpsrw-500 font-semibold">DATA RUMAH</summary>
|
||||
<ul>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">house</span>
|
||||
Rumah
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">playlist_add_check</span>
|
||||
Potensi Rumah
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">list</span>
|
||||
Data Bank Sampah
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">list</span>
|
||||
Data Pendamping RW
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">list</span>
|
||||
Data Berat Sampah
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</li>
|
||||
<li>
|
||||
<details open>
|
||||
<summary class="text-bpsrw-500 font-semibold">DATA VERIFIKASI</summary>
|
||||
<ul>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">house</span>
|
||||
Laporan RW
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">playlist_add_check</span>
|
||||
Checklist Harian
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="text-gray-500">
|
||||
<span class="icon icon-fill">playlist_add_check</span>
|
||||
Total Checklist Rumah
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</details>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
Loading…
Reference in New Issue