<div class="container">
    <div class="title">
        <h2><?=$title?></h2>
        <form method="post" >
            <?php 
            if($is_superadmin == true || $is_admin == true): ?>
            <div class="add-guest"><a href="<?=base_url('group/add')?>"><i class="fas fa-plus"></i>Add Group</a></div>
            <?php endif; ?>
         
            <input type="search" placeholder="Search" id="search_text">
            <button type="submit"><img src="<?=base_url("assets/images/search.png")?>" alt="search"></button>
        </form>
        <div class="card-filter" id="showing-card">
            
            <div class="filter-title">
               
                <h2>Filter</h2>
                 <i class="fas fa-times closePOP" onclick="closeFilter()"></i>
            </div>
        </div>
    </div>
    <div class="users-section">
        <div class="users-info">
            <h5 style="   text-align: center; width: 50px;">NO.</h5>
            <h5 style="   margin-left: 10px; width: 200px;">Title</h5>
            <h5 style="  width: 180px;">Color</h5>
            <h5>No of Guests</h5>
            <h5 style="   text-align: center;"></h5>
            
        </div>
        <?php
        foreach($list as $item): 
        ?>
        <div class="users">
            <div class="user"  style=" padding: 30px 0;">
                <div class="user-info-h5">
                    <h5 style="width: 50px;  text-align: center; "><?=$item['id']?></h5>
                <h5 style=" max-width:198px;"><?=$item['title']?></h5>
                <h5 style=" width: 180px; "><?=$item['color']?></h5>
                <h5><?=$item['nGuests']?></h5>                               
                  
                </div>
                  <div class="edit"><a href="<?=base_url('group/edit/' . $item['id'])?>">Edit</a></div>
               
           </div>
        </div>          
        <?php
        endforeach;
        ?>
    </div>
</div>

    <script>
    $(document).ready(function() {
        $("#search_text").on("keyup", function() {
            var value = $(this).val().toLowerCase();
            $(".users .user").filter(function() {
                $(this).parent().toggle($(this).text()
                .toLowerCase().indexOf(value) > -1)
            });
        });
    });
</script>