@extends('layouts.master')

@section('Title')
List of Addons Categories
  
@endsection


@section('content')

<div class="content-header" style="display: flex;">

    <div class="container-fluid" style="display: flex;">
        <div class="toggle">
            <a class="nav-link togg" data-widget=""   id="cll" onclick="CloseNav();">
                <i class="fas fa-bars"></i>
                <span class="sr-only">Toggle navigation</span>
            </a>
            <a class="nav-link togg" data-widget="" id="open" onclick="openNav();">
                <i class="fas fa-bars"></i>
                <span class="sr-only">Toggle navigation</span>
            </a>
        </div>
        <div style="padding: auto 0px;">
        <h1 class="m-0 text-dark" style="font-weight: 700;">Extra Categories</h1>
        <p style="color: grey;">Manage all Extra Categories</p>
        </div>
    </div>
    <div style="margin-left: auto;display: flex; align-items: center;">
      <div class="searchicon">
          <i class="fas fa-search" style="color: #8141a1;margin: auto ;"></i>
        </div>
        <div>
        <input id="myInput"  class="search" type="text" placeholder="Search.." style="border: none; ">
        </div>
      <div class="bell">
        <i class="fas fa-bell" style="margin: auto ;"></i>
      </div>
        <div class="imglogo">
            <img src="{{ asset('/img/purple_logo.png') }}" style="margin:auto;width: 100%;height: 100%;">
        </div>
    </div>       
</div>
<div class="container-fluid">
  <!-- Small boxes (Stat box) -->
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header">
<h1 class="card-title mt-2">List of Extra Categories</h1>
<div class="card-tools">
<a href="{{route('admin.addon.category.create')}}">
<button type="button" class="btn btn-block  btn-sm" style="background: #8141a1;color: white;">Add Extra category</button>
</a>
</div>
</div>
<!-- /.card-header -->
<div class="card-body">
<table id="table-data" class="table table-bordered table-striped">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Type</th>
<th colspan="2">Action</th>

</tr>
</thead>
<tbody id="myTable">
  @foreach($addonscategories as $addonscategory)
      <tr>
<td>#{{$addonscategory->id}}</td>
<td>{{$addonscategory->name}}</td>
<td>{{$addonscategory->type}}</td>
<td>
                <a href="category/edit/{{$addonscategory->id}}">
                  <button type="button" class="btn" style="background-color: #8141a1;">
                  <i class="fas fa-pencil-alt" style="color: white;"></i>
                  </button>
                </a>
</td>
<td>
                <a href="category/delete/{{$addonscategory->id}}">
                  <button type="button" class="btn" style="background-color: #8141a1;" >
                  <i class="fas fa-trash" style="color: white;"></i>
                  </button>
                </a>
              </td>
</tr>
@endforeach
</tbody>
<tfoot>
<tr>
<th>ID</th>
<th>Name</th>
<th>Type</th>
<th colspan="2">Action</th>
</tr>
</tfoot>
</table>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- ./col -->
</div>
<!-- /.row -->
</div>

@endsection


@section('scripts')

@endsection