@extends('layouts.master')

@section('body-class', 'bg-secondary')

@section('page-content')

<div class="d-flex flex-row">

    <x-menus.collapsable-responsive-sidebar 
        target-offcanvas="sidebar-menu-offcanvas"
        target-collapse="sidebar-menu-collapse"
        collapse-width="250"
    />

    <div class="d-flex flex-column w-100">

        <nav class="navbar navbar-expand navbar-dark bg-dark sticky-top shadow" aria-label="Second navbar example">
            <div class="container-fluid">

                <a href="#" data-bs-target="#sidebar-menu-collapse" data-bs-toggle="collapse" class="d-none d-md-block text-white" role="button" ><i class="bi bi-list"></i> </a>
                <a href="#" data-bs-target="#sidebar-menu-offcanvas" data-bs-toggle="offcanvas" class="d-block d-md-none text-white" role="button" ><i class="bi bi-list"></i> </a>
                
                <ul class="navbar-nav me-auto">
                </ul>
                
                @livewire('common.global-search', [])
            </div>
        </nav>

        <div class="p-2 px-2 w-100">
            @yield('content')
        </div>

    </div>
    
</div>

@livewire('common.quick-viewer')

@endsection