@extends("admin.layout.master")
@section('title','Dashboard')
@section ('content')
<div class="d-flex flex-column flex-column-fluid">
    <div id="kt_app_toolbar" class="app-toolbar py-3 py-lg-6">
        <div id="kt_app_toolbar_container" class="app-container container-fluid d-flex flex-stack">
            <div class="page-title d-flex flex-column justify-content-center flex-wrap me-3">
                <h1 class="page-heading d-flex text-dark fw-bold fs-3 flex-column justify-content-center my-0">Dashboard</h1>
                <ul class="breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0 pt-1">
                    <li class="breadcrumb-item text-muted">Dashboard</li>
                </ul>
            </div>
        </div>
    </div>
    <div class="app-content flex-column-fluid index-container" id="kt_app_content">
        <div class="app-container container-fluid" id="kt_app_content_container">
            <div class="row g-5 g-xl-8">
                <div class="col-xl-3 col-md-6">
                    <a href="javascript:void(0);" style="cursor: default;" class="card bg-danger hoverable card-xl-stretch mb-xl-8">
                        <div class="card-body">
                            <span class="dash-tile-icon pink-icon d-flex justify-content-center align-items-center">
                                <img src="{{asset('/assets/images/stock/revenue-icon.png')}}" alt="">
                            </span>
                            <div class="fw-semibold text-white mt-5">Total Gymnast</div>
                            <div class="text-white fw-bold fs-xl-1"></div>
                        </div>
                    </a>
                </div>
                <div class="col-xl-3 col-md-6">
                    <a href="javascript:void(0);" style="cursor: default;" class="card bg-primary hoverable card-xl-stretch mb-xl-8">
                        <div class="card-body">
                            <span class="dash-tile-icon blue-icon d-flex justify-content-center align-items-center">
                                <img src="{{asset('/assets/images/stock/club-onboard-icon.png')}}" alt="">
                            </span>
                            <div class="fw-semibold text-white mt-5">Total Event</div>
                            <div class="text-white fw-bold fs-xl-1"></div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@push("js")
    <script>
        $(document).ready(function () {
            $("#ds_datatable_table").DataTable({
                dom: "<'row'<'col-sm-3 float-start'f><'col-sm-3'><'col-sm-3'><'col-sm-3 float-end'>><'row'<'col-sm-12'tr>><'row'<'col-sm-12 col-md-1'l><'col-sm-12 col-md-5'i><'col-sm-12 col-md-6'p>>",
                info: 1,
                order: [],
                pageLength: 10,
                lengthChange: 1,
                language: {
                    searchPlaceholder: "Search"
                },
                columnDefs: [
                  {
                    orderable: !1,
                    targets: 0,
                  },
                  {
                    orderable: !1,
                    targets: 9,
                  },
                ],
              });
              $('.dt-buttons').attr("class", "float-end");
         });
    </script>
@endpush