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

feat: navbar dan footer landing page

main
Rohmad Eko Wahyudi 2025-11-10 17:45:30 +07:00
parent 201fc8c091
commit 554c882734
No known key found for this signature in database
GPG Key ID: 4CCEDA68CB778BAF
4 changed files with 107 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Views/Home/Index.cshtml
View File

@ -8,7 +8,7 @@
<div class="absolute inset-0 bg-black/50"></div> <div class="absolute inset-0 bg-black/50"></div>
<!-- Hero Content --> <!-- Hero Content -->
<div class="relative z-10 flex items-end min-h-screen px-4 lg:px-28 pt-28 pb-48"> <div class="relative z-10 flex items-center min-h-screen px-4 lg:px-28 py-20">
<div class="w-full max-w-[1280px] mx-auto flex flex-col justify-start items-start gap-20"> <div class="w-full max-w-[1280px] mx-auto flex flex-col justify-start items-start gap-20">
<div class="flex justify-start items-center gap-8 w-full"> <div class="flex justify-start items-center gap-8 w-full">
<div class="max-w-[800px] pr-10 flex flex-col justify-start items-start gap-8"> <div class="max-w-[800px] pr-10 flex flex-col justify-start items-start gap-8">

77
Views/Shared/_FooterLanding.cshtml 100644
View File

@ -0,0 +1,77 @@
<footer class="bg-gray-900 text-white">
<div class="container mx-auto px-4 lg:px-28 py-12">
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
<!-- Brand -->
<div class="col-span-1">
<div class="flex items-center gap-3 mb-4">
<img src="/images/logo.png" alt="Logo" class="h-12 w-12 bg-white rounded-lg p-1" />
<span class="text-lg font-bold font-jakarta">e-Bank Sampah<br/>Jakarta</span>
</div>
<p class="text-gray-400 text-sm font-jakarta">
Program dari Dinas Lingkungan Hidup Provinsi DKI Jakarta untuk pengelolaan sampah yang lebih baik.
</p>
</div>
<!-- Quick Links -->
<div class="col-span-1">
<h3 class="text-lg font-bold font-jakarta mb-4">Tautan Cepat</h3>
<ul class="space-y-2">
<li><a href="/" class="text-gray-400 hover:text-white font-jakarta text-sm">Beranda</a></li>
<li><a href="#about" class="text-gray-400 hover:text-white font-jakarta text-sm">Tentang Kami</a></li>
<li><a href="#regulations" class="text-gray-400 hover:text-white font-jakarta text-sm">Regulasi</a></li>
<li><a href="#contact" class="text-gray-400 hover:text-white font-jakarta text-sm">Hubungi Kami</a></li>
</ul>
</div>
<!-- Services -->
<div class="col-span-1">
<h3 class="text-lg font-bold font-jakarta mb-4">Layanan</h3>
<ul class="space-y-2">
<li><a href="#" class="text-gray-400 hover:text-white font-jakarta text-sm">Pendaftaran Nasabah</a></li>
<li><a href="#" class="text-gray-400 hover:text-white font-jakarta text-sm">Pendaftaran Bank Sampah</a></li>
<li><a href="#" class="text-gray-400 hover:text-white font-jakarta text-sm">Lokasi Bank Sampah</a></li>
<li><a href="/Account/Login" class="text-gray-400 hover:text-white font-jakarta text-sm">Login</a></li>
</ul>
</div>
<!-- Contact -->
<div class="col-span-1">
<h3 class="text-lg font-bold font-jakarta mb-4">Kontak</h3>
<div class="space-y-3 text-sm font-jakarta">
<p class="text-gray-400">
<span class="font-semibold text-white">Alamat:</span><br/>
Jl. Mandala V Cililitan Kramatjati<br/>
Jakarta Timur
</p>
<p class="text-gray-400">
<span class="font-semibold text-white">Jam Operasional:</span><br/>
Senin - Jumat<br/>
08.00 - 15.00 WIB
</p>
</div>
</div>
</div>
<div class="border-t border-gray-800 mt-8 pt-8">
<div class="flex flex-col md:flex-row justify-between items-center">
<p class="text-gray-400 text-sm font-jakarta">
&copy; @DateTime.Now.Year e-Bank Sampah Jakarta. Dinas Lingkungan Hidup Provinsi DKI Jakarta.
</p>
<div class="flex gap-4 mt-4 md:mt-0">
<a href="#" class="text-gray-400 hover:text-white">
<i class="ph ph-facebook-logo text-xl"></i>
</a>
<a href="#" class="text-gray-400 hover:text-white">
<i class="ph ph-instagram-logo text-xl"></i>
</a>
<a href="#" class="text-gray-400 hover:text-white">
<i class="ph ph-twitter-logo text-xl"></i>
</a>
<a href="#" class="text-gray-400 hover:text-white">
<i class="ph ph-youtube-logo text-xl"></i>
</a>
</div>
</div>
</div>
</div>
</footer>

8
Views/Shared/_Layout.cshtml
View File

@ -38,11 +38,15 @@
</head> </head>
<body class="min-h-dvh bg-gray-100 font-sans antialiased"> <body class="min-h-dvh bg-gray-100 font-sans antialiased">
<!-- Landing page tanpa sidebar --> <!-- Landing page dengan navbar dan footer -->
<main> <partial name="_NavbarLanding" />
<main class="pt-16">
@RenderBody() @RenderBody()
</main> </main>
<partial name="_FooterLanding" />
<!-- Scripts --> <!-- Scripts -->
<script src="~/js/site.js" asp-append-version="true"></script> <script src="~/js/site.js" asp-append-version="true"></script>
@await RenderSectionAsync("Scripts", required: false) @await RenderSectionAsync("Scripts", required: false)

23
Views/Shared/_NavbarLanding.cshtml 100644
View File

@ -0,0 +1,23 @@
<nav class="navbar fixed top-0 left-0 right-0 z-50 bg-white shadow-sm">
<div class="container mx-auto px-4 lg:px-28">
<div class="flex-1">
<a href="/" class="flex items-center gap-3">
<img src="/images/logo.png" alt="Logo" class="h-12 w-12" />
<span class="text-xl font-bold font-jakarta text-gray-900">e-Bank Sampah Jakarta</span>
</a>
</div>
<div class="flex-none">
<ul class="menu menu-horizontal px-1 gap-2">
<li><a href="/" class="font-jakarta">Beranda</a></li>
<li><a href="#about" class="font-jakarta">Tentang</a></li>
<li><a href="#regulations" class="font-jakarta">Regulasi</a></li>
<li><a href="#contact" class="font-jakarta">Kontak</a></li>
<li>
<a href="/Account/Login" class="btn btn-sm bg-green-800 hover:bg-green-700 text-white rounded-full font-jakarta">
Login
</a>
</li>
</ul>
</div>
</div>
</nav>