<div class="bg-nav">
    <div class="container p-2">
        <div class="row align-items-center">
            <div class="col-md-6">
                <h2 class="text-white mb-0 fw-bold">SPK</h2>
            </div>
            <div class="mb-0 col-md-6 text-md-end mt-2 mt-md-0 d-none d-md-block">
                <div class="dropdown mt-3">
                    <button class="text-white btn btn-white dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <img src="https://cdn-icons-png.flaticon.com/512/9131/9131529.png" alt="" width="30px">
                        {{ Auth::user()->name }}
                    </button>
                    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                        <form method="POST" action="{{ route('logout') }}">
                            @csrf
                            <button type="submit" class="dropdown-item"><i class='bx bx-log-out'></i> Logout</button>
                        </form>                        
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="{{ route ('profile.edit', Auth::user()->id) }}"><i class='bx bx-cog' ></i> Pengaturan</a>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col">
                <p class="text-white">Rekomendasi menu makanan penderita diabetes melitus</p>
            </div>
        </div>
    </div>    
</div>

<nav class="navbar navbar-expand-lg navbar-light bg-white shadow-sm">
    <div class="container-md">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="dropdown d-lg-none d-md-none">
            <button class="btn btn-white dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <img src="https://cdn-icons-png.flaticon.com/512/9131/9131529.png" alt="" width="30px">
                {{ Auth::user()->name }}
            </button>
            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                <form method="POST" action="{{ route('logout') }}">
                    @csrf
                    <button type="submit" class="dropdown-item"><i class='bx bx-log-out'></i> Logout</button>
                </form>                        
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="{{ route ('profile.edit', Auth::user()->id) }}"><i class='bx bx-cog' ></i> Pengaturan</a>
            </div>
        </div>
        <div class="collapse navbar-collapse justify-content-evenly" id="navbarNavAltMarkup">
            <div class="navbar-nav">
                <a class="nav-item nav-link mx-4" href="{{ route('home') }}" style="{{ Request::is('home') ? 'color: rgb(76, 175, 80);' : '' }}"><i class='bx bx-home'></i> Home</a>
                <a class="nav-item nav-link mx-4" href="{{ route('pasien.index') }}" style="{{ Request::is('home/datapasien*') ? 'color: rgb(76, 175, 80);' : '' }}"><i class='bx bx-user'></i> Data Pasien</a>
                <a class="nav-item nav-link mx-4" href="{{ route('kriteria.index') }}" style="{{ Request::is('home/kriteria*') ? 'color: rgb(76, 175, 80);' : '' }}"><i class='bx bx-list-ul'></i> Data Kriteria</a>
                <a class="nav-item nav-link mx-4" href="{{ route('makanan.index') }}" style="{{ Request::is('home/makanan*') ? 'color: rgb(76, 175, 80);' : '' }}"><i class='bx bx-book-content'></i> Alternatif Makanan</a>
                <a class="nav-item nav-link mx-4 disabled" href="" style="{{ Request::is('home/perhitungan*') ? 'color: rgb(76, 175, 80);' : '' }}"><i class='bx bx-bar-chart-alt-2'></i> Proses Perhitungan</a>
            </div>
        </div>        
    </div>
  </nav>