630 lines
45 KiB
PHP
630 lines
45 KiB
PHP
@extends('layout.layout')
|
|
@php
|
|
$title='Basic Table';
|
|
$subTitle = 'Basic Table';
|
|
@endphp
|
|
|
|
@section('content')
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-12 gap-6">
|
|
<div class="col-span-12 lg:col-span-6">
|
|
<div class="card border-0 overflow-hidden h-full">
|
|
<div class="card-header">
|
|
<h5 class="card-title text-lg mb-0">Default Table</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table border-0 mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th class="!rounded-s-none">S.L</th>
|
|
<th class="">Invoice</th>
|
|
<th class="">Name</th>
|
|
<th class="">Issued Date</th>
|
|
<th class="!rounded-e-none">Amount</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="!border-b-0">01</td>
|
|
<td class="!border-b-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#526534</a>
|
|
</td>
|
|
<td class="!border-b-0">Kathryn Murphy</td>
|
|
<td class="!border-b-0">25 Jan 2025</td>
|
|
<td class="!border-b-0">$200.00</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="!border-b-0">02</td>
|
|
<td class="!border-b-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#696589</a>
|
|
</td>
|
|
<td class="!border-b-0">Annette Black</td>
|
|
<td class="!border-b-0">25 Jan 2025</td>
|
|
<td class="!border-b-0">$200.00</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="!border-b-0">03</td>
|
|
<td class="!border-b-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#256584</a>
|
|
</td>
|
|
<td class="!border-b-0">Ronald Richards</td>
|
|
<td class="!border-b-0">10 Feb 2025</td>
|
|
<td class="!border-b-0">$200.00</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="!border-b-0">04</td>
|
|
<td class="!border-b-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#526587</a>
|
|
</td>
|
|
<td class="!border-b-0">Eleanor Pena</td>
|
|
<td class="!border-b-0">10 Feb 2025</td>
|
|
<td class="!border-b-0">$150.00</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="!border-b-0">05</td>
|
|
<td class="!border-b-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#105986</a>
|
|
</td>
|
|
<td class="!border-b-0">Leslie Alexander</td>
|
|
<td class="!border-b-0">15 Mar 2025</td>
|
|
<td class="!border-b-0">$150.00</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div><!-- card end -->
|
|
</div>
|
|
<div class="col-span-12 lg:col-span-6">
|
|
<div class="card border-0 overflow-hidden">
|
|
<div class="card-header">
|
|
<h5 class="card-title text-lg mb-0">Bordered Tables</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table basic-border-table mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">Invoice </th>
|
|
<th class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">Name</th>
|
|
<th class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">Issued Date</th>
|
|
<th class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">Amount</th>
|
|
<th class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#526534</a>
|
|
</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">Kathryn Murphy</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">25 Jan 2025</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">$200.00</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">View More ></a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#696589</a>
|
|
</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">Annette Black</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">25 Jan 2025</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">$200.00</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">View More ></a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#256584</a>
|
|
</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">256584</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">10 Feb 2025</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">$200.00</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">View More ></a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#526587</a>
|
|
</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">Eleanor Pena</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">10 Feb 2025</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">$150.00</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">View More ></a>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">#105986</a>
|
|
</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">Leslie Alexander</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">15 Mar 2025</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">$150.00</td>
|
|
<td class="border-r border-neutral-200 dark:border-neutral-600 last:border-r-0">
|
|
<a href="javascript:void(0)" class="text-primary-600">View More ></a>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div><!-- card end -->
|
|
</div>
|
|
<div class="col-span-12 lg:col-span-6">
|
|
<div class="card border-0 overflow-hidden">
|
|
<div class="card-header">
|
|
<h5 class="card-title text-lg mb-0">Striped Rows</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table striped-table mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="!bg-white dark:!bg-neutral-700 border-b border-neutral-200 dark:border-neutral-600">Items</th>
|
|
<th scope="col" class="!bg-white dark:!bg-neutral-700 border-b border-neutral-200 dark:border-neutral-600">Price</th>
|
|
<th scope="col" class="!bg-white dark:!bg-neutral-700 border-b border-neutral-200 dark:border-neutral-600">Discount </th>
|
|
<th scope="col" class="!bg-white dark:!bg-neutral-700 border-b border-neutral-200 dark:border-neutral-600">Sold</th>
|
|
<th scope="col" class="!bg-white dark:!bg-neutral-700 border-b border-neutral-200 dark:border-neutral-600 text-center">Total Orders</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/product/product-img1.png') }}" alt="" class="shrink-0 me-3 rounded-lg me-3">
|
|
<div class="grow">
|
|
<h6 class="text-base mb-0 font-normal">Blue t-shirt</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td>$400.00</td>
|
|
<td>15%</td>
|
|
<td>300</td>
|
|
<td class="text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/product/product-img2.png') }}" alt="" class="shrink-0 me-3 rounded-lg me-3">
|
|
<div class="grow">
|
|
<h6 class="text-base mb-0 font-normal">Nike Air Shoe</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td>$150.00</td>
|
|
<td>N/A</td>
|
|
<td>200</td>
|
|
<td class="text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/product/product-img3.png') }}" alt="" class="shrink-0 me-3 rounded-lg me-3">
|
|
<div class="grow">
|
|
<h6 class="text-base mb-0 font-normal">Woman Dresses</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td>$300.00</td>
|
|
<td>$50.00</td>
|
|
<td>1400</td>
|
|
<td class="text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/product/product-img4.png') }}" alt="" class="shrink-0 me-3 rounded-lg me-3">
|
|
<div class="grow">
|
|
<h6 class="text-base mb-0 font-normal">Smart Watch</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td>$400.00</td>
|
|
<td>$50.00</td>
|
|
<td>700</td>
|
|
<td class="text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
<tr class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/product/product-img5.png') }}" alt="" class="shrink-0 me-3 rounded-lg me-3">
|
|
<div class="grow">
|
|
<h6 class="text-base mb-0 font-normal">Hoodie Rose</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td>$300.00</td>
|
|
<td>25%</td>
|
|
<td>400</td>
|
|
<td class="text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div><!-- card end -->
|
|
</div>
|
|
<div class="col-span-12 lg:col-span-6">
|
|
<div class="card border-0 overflow-hidden">
|
|
<div class="card-header">
|
|
<h5 class="card-title text-lg mb-0">Striped Rows</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table vertical-striped-table mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="border-b border-neutral-200 dark:border-neutral-600">Items</th>
|
|
<th scope="col" class="border-b border-neutral-200 dark:border-neutral-600">Price</th>
|
|
<th scope="col" class="border-b border-neutral-200 dark:border-neutral-600">Discount </th>
|
|
<th scope="col" class="border-b border-neutral-200 dark:border-neutral-600">Sold</th>
|
|
<th scope="col" class="border-b border-neutral-200 dark:border-neutral-600 text-center">Total Orders</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<h6 class="text-base mb-0 font-normal">Blue t-shirt</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">$400.00</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">15%</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">300</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600 text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<h6 class="text-base mb-0 font-normal">Blue t-shirt</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">$150.00</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">N/A</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">200</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600 text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<h6 class="text-base mb-0 font-normal">Blue t-shirt</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">$300.00</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">$50.00</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">1400</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600 text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<h6 class="text-base mb-0 font-normal">Blue t-shirt</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">$400.00</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">$50.00</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">700</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600 text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">
|
|
<h6 class="text-base mb-0 font-normal">Blue t-shirt</h6>
|
|
<span class="text-sm text-secondary-light font-normal">Fashion</span>
|
|
</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">$300.00</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">25%</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600">400</td>
|
|
<td class="odd:bg-neutral-100 dark:odd:bg-neutral-600 text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">70</span>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div><!-- card end -->
|
|
</div>
|
|
<div class="col-span-12 lg:col-span-6">
|
|
<div class="card border-0 overflow-hidden">
|
|
<div class="card-header">
|
|
<h5 class="card-title text-lg mb-0">Tables Border Colors</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table border-primary-600 mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="border-r border-b border-primary-600 last:border-r-0">
|
|
<div class="flex items-center">
|
|
<input id="sl" type="checkbox" value="" class="w-4 h-4 text-blue-600 bg-gray-100 border-neutral-400 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
|
|
<label for="sl" class="ms-1.5 text-md font-medium text-gray-900 dark:text-gray-300">S.L</label>
|
|
</div>
|
|
</th>
|
|
<th scope="col" class="border-r border-b border-primary-600 last:border-r-0">Transaction ID</th>
|
|
<th scope="col" class="border-r border-b border-primary-600 last:border-r-0">Date</th>
|
|
<th scope="col" class="border-r border-b border-primary-600 last:border-r-0">Status</th>
|
|
<th scope="col" class="border-r border-b border-primary-600 last:border-r-0">Amount</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<div class="flex items-center">
|
|
<input id="sl1" type="checkbox" value="" class="w-4 h-4 text-blue-600 bg-gray-100 border-neutral-400 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
|
|
<label for="sl1" class="ms-1.5 text-md font-normal text-gray-600 dark:text-gray-300">S.L</label>
|
|
</div>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">5986124445445</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">27 Mar 2025</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<span class="bg-warning-100 dark:bg-warning-600/25 text-warning-600 dark:text-warning-400 px-8 py-1.5 rounded-full font-medium text-sm">Pending</span>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">$20,000.00</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<div class="flex items-center">
|
|
<input id="sl2" type="checkbox" value="" class="w-4 h-4 text-blue-600 bg-gray-100 border-neutral-400 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
|
|
<label for="sl2" class="ms-1.5 text-md font-normal text-gray-600 dark:text-gray-300">S.L</label>
|
|
</div>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">5986124445445</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">27 Mar 2025</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<span class="bg-danger-100 dark:bg-danger-600/25 text-danger-600 dark:text-danger-400 px-8 py-1.5 rounded-full font-medium text-sm">Rejected</span>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">$20,000.00</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<div class="flex items-center">
|
|
<input id="sl3" type="checkbox" value="" class="w-4 h-4 text-blue-600 bg-gray-100 border-neutral-400 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
|
|
<label for="sl3" class="ms-1.5 text-md font-normal text-gray-600 dark:text-gray-300">S.L</label>
|
|
</div>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">5986124445445</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">27 Mar 2025</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">Completed</span>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">$20,000.00</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<div class="flex items-center">
|
|
<input id="sl4" type="checkbox" value="" class="w-4 h-4 text-blue-600 bg-gray-100 border-neutral-400 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
|
|
<label for="sl4" class="ms-1.5 text-md font-normal text-gray-600 dark:text-gray-300">S.L</label>
|
|
</div>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">5986124445445</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">27 Mar 2025</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">Completed</span>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">$20,000.00</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<div class="flex items-center">
|
|
<input id="sl5" type="checkbox" value="" class="w-4 h-4 text-blue-600 bg-gray-100 border-neutral-400 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
|
|
<label for="sl5" class="ms-1.5 text-md font-normal text-gray-600 dark:text-gray-300">S.L</label>
|
|
</div>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">5986124445445</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">27 Mar 2025</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-8 py-1.5 rounded-full font-medium text-sm">Completed</span>
|
|
</td>
|
|
<td class="border-r border-b !border-primary-600 last:border-r-0">$20,000.00</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div><!-- card end -->
|
|
</div>
|
|
<div class="col-span-12 lg:col-span-6">
|
|
<div class="card border-0 overflow-hidden">
|
|
<div class="card-header">
|
|
<h5 class="card-title text-lg mb-0">Background Colors Variants</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table colored-row-table mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="!bg-white dark:!bg-neutral-700">Registered On</th>
|
|
<th scope="col" class="!bg-white dark:!bg-neutral-700">Users</th>
|
|
<th scope="col" class="!bg-white dark:!bg-neutral-700">Email</th>
|
|
<th scope="col" class="!bg-white dark:!bg-neutral-700">Plan</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="bg-primary-50 dark:bg-primary-600/10">27 Mar 2025</td>
|
|
<td class="bg-primary-50 dark:bg-primary-600/10">
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user1.png') }}" alt="" class="w-10 h-10 rounded-full shrink-0 me-2 overflow-hidden">
|
|
<h6 class="text-base mb-0 font-medium grow">Dianne Russell</h6>
|
|
</div>
|
|
</td>
|
|
<td class="bg-primary-50 dark:bg-primary-600/10">random@gmail.com</td>
|
|
<td class="bg-primary-50 dark:bg-primary-600/10">Free</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="bg-success-100 dark:bg-success-600/10">27 Mar 2025</td>
|
|
<td class="bg-success-100 dark:bg-success-600/10">
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user2.png') }}" alt="" class="w-10 h-10 rounded-full shrink-0 me-2 overflow-hidden">
|
|
<h6 class="text-base mb-0 font-medium grow">Wade Warren</h6>
|
|
</div>
|
|
</td>
|
|
<td class="bg-success-100 dark:bg-success-600/10">random@gmail.com</td>
|
|
<td class="bg-success-100 dark:bg-success-600/10">Basic</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="bg-info-100 dark:bg-info-600/10">27 Mar 2025</td>
|
|
<td class="bg-info-100 dark:bg-info-600/10">
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user3.png') }}" alt="" class="w-10 h-10 rounded-full shrink-0 me-2 overflow-hidden">
|
|
<h6 class="text-base mb-0 font-medium grow">Albert Flores</h6>
|
|
</div>
|
|
</td>
|
|
<td class="bg-info-100 dark:bg-info-600/10">random@gmail.com</td>
|
|
<td class="bg-info-100 dark:bg-info-600/10">Standard </td>
|
|
</tr>
|
|
<tr>
|
|
<td class="bg-warning-100 dark:bg-warning-600/10">27 Mar 2025</td>
|
|
<td class="bg-warning-100 dark:bg-warning-600/10">
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user4.png') }}" alt="" class="w-10 h-10 rounded-full shrink-0 me-2 overflow-hidden">
|
|
<h6 class="text-base mb-0 font-medium grow">Bessie Cooper</h6>
|
|
</div>
|
|
</td>
|
|
<td class="bg-warning-100 dark:bg-warning-600/10">random@gmail.com</td>
|
|
<td class="bg-warning-100 dark:bg-warning-600/10">Business </td>
|
|
</tr>
|
|
<tr>
|
|
<td class="bg-danger-100 dark:bg-danger-600/10">27 Mar 2025</td>
|
|
<td class="bg-danger-100 dark:bg-danger-600/10">
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user5.png') }}" alt="" class="w-10 h-10 rounded-full shrink-0 me-2 overflow-hidden">
|
|
<h6 class="text-base mb-0 font-medium grow">Arlene McCoy</h6>
|
|
</div>
|
|
</td>
|
|
<td class="bg-danger-100 dark:bg-danger-600/10">random@gmail.com</td>
|
|
<td class="bg-danger-100 dark:bg-danger-600/10">Enterprise </td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div><!-- card end -->
|
|
</div>
|
|
<div class="col-span-12">
|
|
<div class="card border-0 overflow-hidden">
|
|
<div class="card-header">
|
|
<h5 class="card-title text-lg mb-0">Card Tables</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table bordered-table mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">Users</th>
|
|
<th scope="col">Invoice</th>
|
|
<th scope="col">Items</th>
|
|
<th scope="col">Qty</th>
|
|
<th scope="col">Amount</th>
|
|
<th scope="col" class="text-center">Status</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user1.png') }}" alt="" class="shrink-0 me-3 rounded-lg">
|
|
<span class="text-lg text-secondary-light font-semibold grow">Dianne Russell</span>
|
|
</div>
|
|
</td>
|
|
<td>#6352148</td>
|
|
<td>iPhone 14 max</td>
|
|
<td>2</td>
|
|
<td>$5,000.00</td>
|
|
<td class="text-center">
|
|
<span class="bg-success-100 dark:bg-success-600/25 text-success-600 dark:text-success-400 px-6 py-1.5 rounded-full font-medium text-sm">Paid</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user2.png') }}" alt="" class="shrink-0 me-3 rounded-lg">
|
|
<span class="text-lg text-secondary-light font-semibold grow">Wade Warren</span>
|
|
</div>
|
|
</td>
|
|
<td>#6352148</td>
|
|
<td>Laptop HPH </td>
|
|
<td>3</td>
|
|
<td>$1,000.00</td>
|
|
<td class="text-center">
|
|
<span class="bg-warning-100 dark:bg-warning-600/25 text-warning-600 dark:text-warning-400 px-6 py-1.5 rounded-full font-medium text-sm">Pending</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user3.png') }}" alt="" class="shrink-0 me-3 rounded-lg">
|
|
<span class="text-lg text-secondary-light font-semibold grow">Albert Flores</span>
|
|
</div>
|
|
</td>
|
|
<td>#6352148</td>
|
|
<td>Smart Watch </td>
|
|
<td>7</td>
|
|
<td>$1,000.00</td>
|
|
<td class="text-center">
|
|
<span class="bg-info-100 dark:bg-info-600/25 text-info-600 dark:text-info-400 px-6 py-1.5 rounded-full font-medium text-sm">Shipped</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user4.png') }}" alt="" class="shrink-0 me-3 rounded-lg">
|
|
<span class="text-lg text-secondary-light font-semibold grow">Bessie Cooper</span>
|
|
</div>
|
|
</td>
|
|
<td>#6352148</td>
|
|
<td>Nike Air Shoe</td>
|
|
<td>1</td>
|
|
<td>$3,000.00</td>
|
|
<td class="text-center">
|
|
<span class="bg-danger-100 dark:bg-danger-600/25 text-danger-600 dark:text-danger-400 px-6 py-1.5 rounded-full font-medium text-sm">Canceled</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<div class="flex items-center">
|
|
<img src="{{ asset('assets/images/users/user5.png') }}" alt="" class="shrink-0 me-3 rounded-lg">
|
|
<span class="text-lg text-secondary-light font-semibold grow">Arlene McCoy</span>
|
|
</div>
|
|
</td>
|
|
<td>#6352148</td>
|
|
<td>New Headphone </td>
|
|
<td>5</td>
|
|
<td>$4,000.00</td>
|
|
<td class="text-center">
|
|
<span class="bg-danger-100 dark:bg-danger-600/25 text-danger-600 dark:text-danger-400 px-6 py-1.5 rounded-full font-medium text-sm">Canceled</span>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div><!-- card end -->
|
|
</div>
|
|
</div>
|
|
|
|
@endsection |