72 lines
2.4 KiB
PHP
72 lines
2.4 KiB
PHP
<nav class="navbar navbar-expand-lg navbar-dark bg-primary w-100 fixed-top">
|
|
<div class="container-fluid">
|
|
<!-- Menampilkan title halaman dari Blade -->
|
|
<a class="navbar-brand fw-bold" href="/dashboard">@yield('title', 'Dashboard Sensor')</a>
|
|
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav ms-auto">
|
|
<li class="nav-item">
|
|
<a class="nav-link" href='/dashboard'>Dashboard</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href='/data'>Data Sensor</a>
|
|
</li>
|
|
<li class="nav-item dropdown">
|
|
<a id="navbarDropdown" class="nav-link dropdown-toggle" href="#" role="button"
|
|
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" v-pre>
|
|
{{ Auth::user()->name }}
|
|
</a>
|
|
|
|
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdown">
|
|
<a class="dropdown-item" href="{{ route('logout') }}"
|
|
onclick="event.preventDefault();
|
|
document.getElementById('logout-form').submit();">
|
|
{{ __('Logout') }}
|
|
</a>
|
|
|
|
<form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">
|
|
@csrf
|
|
</form>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<style>
|
|
body {
|
|
padding-top: 56px;
|
|
margin: 0;
|
|
}
|
|
|
|
.nav-link.active {
|
|
color: white !important;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.nav-link {
|
|
color: #c9c8c8 !important;
|
|
transition: color 0.3s ease-in-out;
|
|
}
|
|
|
|
.nav-link:hover {
|
|
color: #ffffff !important;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
let currentUrl = window.location.pathname;
|
|
document.querySelectorAll(".navbar-nav .nav-link").forEach(link => {
|
|
if (link.getAttribute("href") === currentUrl) {
|
|
link.classList.add("active");
|
|
}
|
|
});
|
|
});
|
|
</script>
|