<ul class="nav flex-column mb-2">

    <li class="nav-item">

        <a class="nav-link collapsed text-truncate" href="#Operations" data-toggle="collapse" data-target="#Operations">
            Operations</a> 

        <div class="collapse show" id="Operations" aria-expanded="false">
            <ul class="nav flex-column mb-2">

                <li class="nav-item">

                    <a href="/pos/admin/booking" class="nav-link">
                        <i data-feather="calendar"></i>
                        Booking</a>

                </li>

                <li class="nav-item">

                    <a href="/pos/admin/customer" class="nav-link">
                        <i data-feather="user-plus"></i>
                        Customers</a>

                </li>

                <li class="nav-item">

                    <a href="/pos/admin/menu" class="nav-link">
                        <i data-feather="disc"></i>
                        Menus</a>

                </li>

                <li class="nav-item">

                    <a href="/pos/admin/order" class="nav-link">
                        <i data-feather="send"></i>
                        Orders</a>

                </li>

                <li class="nav-item">

                    <a href="/pos/admin/post" class="nav-link">
                        <i data-feather="file-text"></i>
                        Post</a>

                </li>

                <li class="nav-item">

                    <a href="/pos/admin/table" class="nav-link">
                        <i data-feather="table"></i>
                        Table</a>

                </li>

            </ul>
        </div>

    </li>

</ul>
<ul class="nav flex-column mb-2">

    <li class="nav-item">

        <a class="nav-link collapsed text-truncate" href="#Monitoring" data-toggle="collapse" data-target="#Monitoring">
            Monitoring</a>

        <div class="collapse show" id="Monitoring" aria-expanded="false">
            <ul class="nav flex-column mb-2">

                <li class="nav-item">

                    <a href="/pos/admin/cctv" class="nav-link">
                        <i data-feather="camera"></i>
                        CCTV</a>

                </li>

                <li class="nav-item">

                    <a href="/pos/admin/messages" class="nav-link">
                        <i data-feather='mail'></i>
                        Messages</a>

                </li>

            </ul>
        </div>

    </li>

</ul>
<ul class="nav flex-column mb-2">

    <li class="nav-item">

        <a class="nav-link collapsed text-truncate" href="#Settings" data-toggle="collapse" data-target="#Settings">
            Settings</a>

        <div class="collapse show" id="Settings" aria-expanded="false">
            <ul class="nav flex-column mb-2">


                <li class="nav-item">

                    <a href="/pos/admin/code" class="nav-link">
                        <i data-feather="code"></i>
                        Code</a>

                </li>

                <li class="nav-item">

                    <a href="/pos/admin/store" class="nav-link">
                        <i data-feather="settings"></i>
                        General</a>

                </li>

                <li class="nav-item">
                    <a href="/pos/admin/user" class="nav-link">
                        <i data-feather="user"></i>
                        Users</a>

                </li>
                <li class="nav-item">
                    <a href="/pos/admin/uimenu" class="nav-link">
                        <i data-feather="menu"></i>
                        UIMenu</a>

                </li>

            </ul>
        </div>

    </li>

</ul>
