<!-- Main Header -->
<header class="main-header">

  <!-- Logo -->
  <a href="{{ url('/home') }}" class="logo">
    <!-- mini logo for sidebar mini 50x50 pixels -->
    <span class="logo-mini"><b>SI</b>BH</span>
    <!-- logo for regular state and mobile devices -->
    <span class="logo-lg"><b>SI </b>Pemesanan Homestay </span>
  </a>

  <!-- Header Navbar -->
  <nav class="navbar navbar-static-top" role="navigation">
    <!-- Sidebar toggle button-->
    <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
      <span class="sr-only">{{ trans('adminlte_lang::message.togglenav') }}</span>
    </a>
    <!-- Navbar Right Menu -->
    <div class="navbar-custom-menu">
      <ul class="nav navbar-nav">
        <!-- Messages: style can be found in dropdown.less-->
        <li class="dropdown messages-menu">
          <!-- Tasks Menu -->
          <li class="dropdown tasks-menu">
            <!-- Menu Toggle Button -->
            <ul class="dropdown-menu">
              <li class="header">{{ trans('adminlte_lang::message.tasks') }}</li>
              <li>
                <!-- Inner menu: contains the tasks -->
                <ul class="menu">
                  <li><!-- Task item -->
                    <a href="#">
                      <!-- Task title and progress text -->
                      <h3>
                        {{ trans('adminlte_lang::message.tasks') }}
                        <small class="pull-right">20%</small>
                      </h3>
                      <!-- The progress bar -->
                      <div class="progress xs">
                        <!-- Change the css width attribute to simulate progress -->
                        <div class="progress-bar progress-bar-aqua" style="width: 20%" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
                          <span class="sr-only">20% {{ trans('adminlte_lang::message.complete') }}</span>
                        </div>
                      </div>
                    </a>
                  </li><!-- end task item -->
                </ul>
              </li>
              <li class="footer">
                <a href="#">{{ trans('adminlte_lang::message.alltasks') }}</a>
              </li>
            </ul>
          </li>
          @if (Auth::guest())
          <li><a href="{{ url('/register') }}">{{ trans('adminlte_lang::message.register') }}</a></li>
          <li><a href="{{ url('/login') }}">{{ trans('adminlte_lang::message.login') }}</a></li>
          @else
          <!-- User Account Menu -->
          <li class="dropdown user user-menu">
            <!-- Menu Toggle Button -->
            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
              <!-- The user image in the navbar-->

              <!-- hidden-xs hides the username on small devices so only the image appears. -->
              <span class="hidden-xs">{{ Auth::user()->name }}</span>
            </a>
            <ul class="dropdown-menu">
              <!-- The user image in the menu -->
              <li class="user-header">
                <img src="/img/{{Auth::user()->foto}}" class="img-circle" alt="User Image" />
                <p>
                  {{ Auth::user()->name }}
                  <small>{{ trans('adminlte_lang::message.login') }}  </small>
                </p>
              </li>
              <!-- Menu Body -->

              <!-- Menu Footer-->
              <li class="user-footer">
                <div class="pull-left">
                  <a href="{{ url('profile') }}" class="btn btn-default btn-flat">{{ trans('adminlte_lang::message.profile') }}</a>
                </div>
                <div class="pull-right">
                  <a href="{{ url('/logout') }}" class="btn btn-default btn-flat"
                  onclick="event.preventDefault();
                  document.getElementById('logout-form').submit();">
                  {{ trans('adminlte_lang::message.signout') }}
                </a>

                <form id="logout-form" action="{{ url('/logout') }}" method="POST" style="display: none;">
                  {{ csrf_field() }}
                  <input type="submit" value="logout" style="display: none;">
                </form>

              </div>
            </li>
          </ul>
        </li>
        @endif


      </ul>
    </div>
  </nav>
</header>