<header class="page-header" role="banner">
    <!-- we need this logo when user switches to nav-function-top -->
    <div class="page-logo">
        <a href="#" class="page-logo-link press-scale-down d-flex align-items-center position-relative" data-toggle="modal" data-target="#modal-shortcut">
            <img src="https://banksampah.jakarta.go.id/images/logo-dinas.ico" alt="SmartAdmin WebApp" aria-roledescription="logo">
            <span class="position-absolute text-white opacity-50 small pos-top pos-right mr-2 mt-n2"></span>
            <i class="fal fa-angle-down d-inline-block ml-1 fs-lg color-primary-300"></i>
        </a>
    </div>
    <!-- DOC: nav menu layout change shortcut -->

    <!-- DOC: mobile button appears during mobile width -->
    <div class="hidden-lg-up">
        <a href="#" class="btn press-scale-down border-none bg-fusion-50" data-action="toggle" data-class="mobile-nav-on">
            <i class="ni ni-menu"></i>
        </a>
    </div>
   {{-- <div class="w-1/5 hidden">
        <select name="year" class="form-control" id="changeYear">
            @for ($i = date('Y')-3;   date('Y') >= $i; $i++)
                <option {{ $i == date('Y') ? 'selected' : '' }} value="{{$i}}">{{$i}}</option>
            @endfor
        </select>
    </div> --}}
    <div class="ml-auto d-flex">

        <div>
            <a href="#" data-toggle="dropdown" class="header-icon d-flex align-items-center justify-content-center">
                <div class="rounded-circle bg-fusion-50 width-3 height-3 d-inline-block d-flex align-items-center justify-content-center">
                    <i class="fal fa-user fa-1x"></i>
                </div>
                <!-- <img src="{{asset('assets/img/demo/avatars/avatar-admin.png')}}" class="profile-image rounded-circle" alt="Administrator"> -->
            </a>
            <div class="dropdown-menu dropdown-menu-animated dropdown-lg">
                <div class="dropdown-header d-flex flex-row py-4 rounded-top" style="background: #D9EAFD !important;">
                    <div class="d-flex flex-row align-items-center mt-1 mb-1 color-black">
                        <span class="mr-2">
                            <div class="rounded-circle bg-fusion-50 width-3 height-3 d-inline-block d-flex align-items-center justify-content-center">
                                <i class="fal fa-user fa-1x"></i>
                            </div>
                            <!-- <img src="{{asset('assets/img/demo/avatars/avatar-admin.png')}}" class="rounded-circle profile-image" alt="Administrator"> -->
                        </span>
                        <div class="info-card-text">
                            <div class="fs-lg text-truncate text-truncate-lg">{{auth()->user()->name}}</div>
                            <span class="text-truncate text-truncate-md opacity-80">{{session('email')}}</span>
                        </div>
                    </div>
                </div>
                <div class="dropdown-divider m-0"></div>
                @if(session('group_alias') == 'sekolah')
                    <a href="{{ url('profile') }}" class="dropdown-item">
                        <span>Data Diri</span>
                    </a>
                @endif
                <div class="dropdown-divider m-0"></div>
                <a class="dropdown-item fw-500 pt-3 pb-3" href="{{url('logout')}}">
                    <span>Logout</span>
                </a>
            </div>
        </div>
    </div>
</header>