@extends('Admin.layout')
<link rel="stylesheet" href="https://cdn.datatables.net/2.3.4/css/dataTables.bootstrap5.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">

@section('content')


    <div class="card">
        <div class="card-datatable table-responsive pt-0">
            <div class="row card-header flex-column flex-md-row border-bottom mx-0 px-3">

                <div class="d-md-flex justify-content-between align-items-center dt-layout-end col-md-auto ms-auto mt-0">
                    <div class="dt-buttons btn-group flex-wrap mb-0">
                        <div class="btn-group">
                            <a href="{{ route('Create_rack') }}"><button class="btn create-new btn-primary" tabindex="0"
                                    aria-controls="DataTables_Table_0" type="button"><span><span
                                            class="d-flex align-items-center gap-2"><i
                                                class="icon-base ti tabler-plus icon-sm"></i> <span
                                                class="d-sm-inline-block">Create
                                                Rack</span></span></span></button></a>
                        </div>
                    </div>
                </div>

                <table id="information" class="table">
                    <thead>
                        <tr>
                            <th>SNO</th>
                            <th>Rack Name</th>
                            <th>Rack Number</th>
                            <th>Rack Size</th>
                            <th>CFT</th>
                            <th>Actions</th>
                        </tr>
                    </thead>

                    <tbody>
                        <tr>

                            <td>1</td>
                            <td>Rose woods</td>
                            <td>5</td>
                            <td>3*4*6</td>
                            <td>3.3</td>

                            <td>
                                <div class="dropdown">
                                    <a href="{{ route('Edit_rack') }}"><i class="icon-base ti tabler-pencil me-2"></i>
                                    </a>


                                    <a class="action-btn-danger" data-bs-target="#delete" data-bs-toggle="modal"><svg
                                            xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22"
                                            fill="none">
                                            <path
                                                d="M19.25 5.48177C16.1975 5.17927 13.1267 5.02344 10.065 5.02344C8.25 5.02344 6.435 5.1151 4.62 5.29844L2.75 5.48177"
                                                stroke="#FF0004" stroke-width="1.5" stroke-linecap="round"
                                                stroke-linejoin="round" />
                                            <path
                                                d="M7.79199 4.55551L7.99366 3.35467C8.14033 2.48384 8.25033 1.83301 9.79949 1.83301H12.2012C13.7503 1.83301 13.8695 2.52051 14.007 3.36384L14.2087 4.55551"
                                                stroke="#FF0004" stroke-width="1.5" stroke-linecap="round"
                                                stroke-linejoin="round" />
                                            <path
                                                d="M17.279 8.37891L16.6832 17.6097C16.5824 19.0489 16.4999 20.1672 13.9424 20.1672H8.05737C5.49987 20.1672 5.41737 19.0489 5.31654 17.6097L4.7207 8.37891"
                                                stroke="#FF0004" stroke-width="1.5" stroke-linecap="round"
                                                stroke-linejoin="round" />
                                            <path d="M9.46875 15.125H12.5212" stroke="#FF0004" stroke-width="1.5"
                                                stroke-linecap="round" stroke-linejoin="round" />
                                            <path d="M8.70801 11.458H13.2913" stroke="#FF0004" stroke-width="1.5"
                                                stroke-linecap="round" stroke-linejoin="round" />
                                        </svg></a>




                                </div>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>


        </div>
    </div>



    <script>
        document.addEventListener("DOMContentLoaded", function () {
            new DataTable('#information');
        });
    </script>

    <script src="https://code.jquery.com/jquery-3.7.1.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdn.datatables.net/2.3.4/js/dataTables.js"></script>
    <script src="https://cdn.datatables.net/2.3.4/js/dataTables.bootstrap5.js"></script>
    <script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>


@endsection