Border Collapse Table
|
Channel
|
Sessions
|
Prev.Period
|
% Change
|
|
Organic search
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Direct
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Referal
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Email
|
10853(52%)
|
566(92%)
|
52.80%
|
<table class="w-full border-collapse border dark:border-slate-700">
<thead class="bg-slate-100 dark:bg-slate-700/20">
<tr>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 border dark:border-slate-700">
Channel
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 border dark:border-slate-700">
Sessions
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 border dark:border-slate-700">
Prev.Period
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 border dark:border-slate-700">
% Change
</th>
</tr>
</thead>
<tbody>
<!-- 1 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white border dark:border-slate-700">
<a href="" class="text-blue-500">Organic search</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
<!-- 2 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white border dark:border-slate-700">
<a href="" class="text-blue-500">Direct</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
52.80% <i class="icofont-caret-down text-red-500 text-base"></i>
</td>
</tr>
<!-- 3 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white border dark:border-slate-700">
<a href="" class="text-blue-500">Referal</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
<!-- 4 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white border dark:border-slate-700">
<a href="" class="text-blue-500">Email</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
52.80% <i class="icofont-caret-down text-red-500 text-base"></i>
</td>
</tr>
</tbody>
</table>
Border Separate Table
|
Channel
|
Sessions
|
Prev.Period
|
% Change
|
|
Organic search
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Direct
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Referal
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Email
|
10853(52%)
|
566(92%)
|
52.80%
|
<table class="w-full border-separate border dark:border-slate-700">
<thead class="bg-slate-100 dark:bg-slate-700/20">
<tr>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 border dark:border-slate-700">
Channel
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 border dark:border-slate-700">
Sessions
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 border dark:border-slate-700">
Prev.Period
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 border dark:border-slate-700">
% Change
</th>
</tr>
</thead>
<tbody>
<!-- 1 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white border dark:border-slate-700">
<a href="" class="text-blue-500">Organic search</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
<!-- 2 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white border dark:border-slate-700">
<a href="" class="text-blue-500">Direct</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
52.80% <i class="icofont-caret-down text-red-500 text-base"></i>
</td>
</tr>
<!-- 3 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white border dark:border-slate-700">
<a href="" class="text-blue-500">Referal</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
<!-- 4 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white border dark:border-slate-700">
<a href="" class="text-blue-500">Email</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 border dark:border-slate-700">
52.80% <i class="icofont-caret-down text-red-500 text-base"></i>
</td>
</tr>
</tbody>
</table>
|
Channel
|
Sessions
|
Prev.Period
|
% Change
|
|
Organic search
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Direct
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Referal
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Email
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Social
|
10853(52%)
|
566(92%)
|
52.80%
|
<table class="w-full">
<thead class="bg-slate-100 dark:bg-slate-700/20">
<tr>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
Channel
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
Sessions
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
Prev.Period
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
% Change
</th>
</tr>
</thead>
<tbody>
<!-- 1 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<a href="" class="text-blue-500">Organic search</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
<!-- 2 -->
<tr class="bg-slate-50 border-b border-dashed dark:bg-gray-900/30 dark:border-gray-700">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<a href="" class="text-blue-500">Direct</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-down text-red-500 text-base"></i>
</td>
</tr>
<!-- 3 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<a href="" class="text-blue-500">Referal</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
<!-- 4 -->
<tr class="bg-slate-50 border-b border-dashed dark:bg-gray-900/30 dark:border-gray-700">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<a href="" class="text-blue-500">Email</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-down text-red-500 text-base"></i>
</td>
</tr>
<!-- 5 -->
<tr class="bg-white dark:bg-gray-900">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<a href="" class="text-blue-500">Social</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
</tbody>
</table>
|
Channel
|
Sessions
|
Prev.Period
|
% Change
|
|
Organic search
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Direct
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Referal
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Email
|
10853(52%)
|
566(92%)
|
52.80%
|
|
Social
|
10853(52%)
|
566(92%)
|
52.80%
|
<table class="w-full">
<thead class="">
<tr>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 bg-slate-100 dark:bg-slate-700/20">
Channel
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
Sessions
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400 bg-slate-100 dark:bg-slate-700/20">
Prev.Period
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
% Change
</th>
</tr>
</thead>
<tbody>
<!-- 1 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white bg-slate-100 dark:bg-slate-700/20">
<a href="" class="text-blue-500">Organic search</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 bg-slate-100 dark:bg-slate-700/20">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
<!-- 2 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white bg-slate-100 dark:bg-slate-700/20">
<a href="" class="text-blue-500">Direct</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-red-500 whitespace-nowrap dark:text-red-500 bg-red-500/10 dark:bg-red-700/20">
566<small class="text-red-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-down text-red-500 text-base"></i>
</td>
</tr>
<!-- 3 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white bg-slate-100 dark:bg-slate-700/20">
<a href="" class="text-blue-500">Referal</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 bg-slate-100 dark:bg-slate-700/20">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
<!-- 4 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white bg-slate-100 dark:bg-slate-700/20">
<a href="" class="text-blue-500">Email</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-green-500 whitespace-nowrap dark:text-green-500 bg-green-500/10 dark:bg-green-700/20">
566<small class="text-green-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-down text-red-500 text-base"></i>
</td>
</tr>
<!-- 5 -->
<tr class="bg-white dark:bg-gray-900">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white bg-slate-100 dark:bg-slate-700/20">
<a href="" class="text-blue-500">Social</a>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
10853<small class="text-gray-400">(52%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400 bg-slate-100 dark:bg-slate-700/20">
566<small class="text-gray-400">(92%)</small>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
52.80% <i class="icofont-caret-up text-green-500 text-base"></i>
</td>
</tr>
</tbody>
</table>
|
Lead
|
Email
|
Phone No
|
Status
|
Action
|
Donald Gardner
|
xyx@gmail.com
|
+123456789
|
New Lead
|
|
Matt Rosales
|
xyx@gmail.com
|
+123456789
|
New Lead
|
|
Michael Hill
|
xyx@gmail.com
|
+123456789
|
Lost
|
|
Dorothy Key
|
xyx@gmail.com
|
+123456789
|
Converted
|
|
<table class="w-full">
<thead class="bg-primary-500 dark:bg-primary-500">
<tr>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Lead
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Email
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Phone No
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Status
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Action
</th>
</tr>
</thead>
<tbody>
<!-- 1 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-1.png" alt="" class="mr-2 h-8 rounded-full inline-block">Donald Gardner
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-indigo-600/5 text-indigo-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">New Lead</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
<!-- 2 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-5.png" alt="" class="mr-2 h-8 rounded-full inline-block">Matt Rosales
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-indigo-600/5 text-indigo-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">New Lead</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
<!-- 3 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-4.png" alt="" class="mr-2 h-8 rounded-full inline-block">Michael Hill
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-red-600/5 text-red-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">Lost</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
<!-- 4 -->
<tr class="bg-white dark:bg-gray-900">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-2.png" alt="" class="mr-2 h-8 rounded-full inline-block">Dorothy Key
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-green-600/5 text-green-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">Converted</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
</tbody>
</table>
|
Date
|
Item Counts
|
Tax
|
Earning
|
|
03 March
|
50
|
-$40
|
$15,500.00
|
|
04 March
|
120
|
-
|
$20,900.00
|
|
05 March
|
90
|
-$20
|
$10,500.00
|
|
06 March
|
160
|
-
|
$35,000.00
|
|
07 March
|
80
|
-$60
|
$18,880.00
|
<table class="min-w-full">
<thead class="bg-gray-50 dark:bg-gray-600/20">
<tr>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
Date
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
Item Counts
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
Tax
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400">
Earning
</th>
</tr>
</thead>
<tbody>
<!-- 1 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40 hover:bg-slate-50 dark:hover:bg-slate-900/30">
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
03 March
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
50
</td>
<td class="p-3 text-sm text-red-500 whitespace-nowrap dark:text-red-400">
-$40
</td>
<td class="p-3 text-sm font-medium text-gray-600 whitespace-nowrap dark:text-gray-400">
$15,500.00
</td>
</tr>
<!-- 2 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40 hover:bg-slate-50 dark:hover:bg-slate-900/30">
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
04 March
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
120
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
-
</td>
<td class="p-3 text-sm font-medium text-gray-600 whitespace-nowrap dark:text-gray-400">
$20,900.00
</td>
</tr>
<!-- 3 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40 hover:bg-slate-50 dark:hover:bg-slate-900/30">
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
05 March
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
90
</td>
<td class="p-3 text-sm text-red-500 whitespace-nowrap dark:text-red-400">
-$20
</td>
<td class="p-3 text-sm font-medium text-gray-600 whitespace-nowrap dark:text-gray-400">
$10,500.00
</td>
</tr>
<!-- 4 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40 hover:bg-slate-50 dark:hover:bg-slate-900/30">
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
06 March
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
160
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
-
</td>
<td class="p-3 text-sm font-medium text-gray-600 whitespace-nowrap dark:text-gray-400">
$35,000.00
</td>
</tr>
<!-- 5 -->
<tr class="bg-white dark:bg-gray-800 hover:bg-slate-50 dark:hover:bg-slate-900/30">
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
07 March
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
80
</td>
<td class="p-3 text-sm text-red-500 whitespace-nowrap dark:text-red-400">
-$60
</td>
<td class="p-3 text-sm font-medium text-gray-600 whitespace-nowrap dark:text-gray-400">
$18,880.00
</td>
</tr>
</tbody>
</table>
|
Lead
|
Email
|
Phone No
|
Status
|
Action
|
Donald Gardner
|
xyx@gmail.com
|
+123456789
|
New Lead
|
|
Matt Rosales
|
xyx@gmail.com
|
+123456789
|
New Lead
|
|
Michael Hill
|
xyx@gmail.com
|
+123456789
|
Lost
|
|
Dorothy Key
|
xyx@gmail.com
|
+123456789
|
Converted
|
|
<table class="w-full">
<thead class="bg-slate-700 dark:bg-slate-900/30">
<tr>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Lead
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Email
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Phone No
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Status
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-slate-100 uppercase">
Action
</th>
</tr>
</thead>
<tbody>
<!-- 1 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-1.png" alt="" class="mr-2 h-8 rounded-full inline-block">Donald Gardner
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-indigo-600/5 text-indigo-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">New Lead</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
<!-- 2 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-5.png" alt="" class="mr-2 h-8 rounded-full inline-block">Matt Rosales
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-indigo-600/5 text-indigo-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">New Lead</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
<!-- 3 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-4.png" alt="" class="mr-2 h-8 rounded-full inline-block">Michael Hill
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-red-600/5 text-red-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">Lost</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
<!-- 4 -->
<tr class="bg-white dark:bg-gray-900">
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-2.png" alt="" class="mr-2 h-8 rounded-full inline-block">Dorothy Key
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-green-600/5 text-green-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">Converted</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
</tbody>
</table>
<table class="w-full">
<thead class="bg-gray-50 dark:bg-gray-600/20">
<tr>
<th scope="col" class="p-3">
<label class="custom-label">
<div class="bg-white dark:bg-slate-600/40 border border-slate-200 dark:border-slate-600 rounded w-4 h-4 inline-block leading-4 text-center -mb-[3px]">
<input type="checkbox" class="hidden" >
<i class="fas fa-check hidden text-xs text-slate-700 dark:text-slate-200"></i>
</div>
</label>
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 dark:text-gray-400 uppercase">
Lead
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 dark:text-gray-400 uppercase">
Email
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 dark:text-gray-400 uppercase">
Phone No
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 dark:text-gray-400 uppercase">
Status
</th>
<th scope="col" class="p-3 text-xs font-medium tracking-wider text-left text-gray-700 dark:text-gray-400 uppercase">
Action
</th>
</tr>
</thead>
<tbody>
<!-- 1 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="w-4 p-4">
<label class="custom-label">
<div class="bg-white dark:bg-slate-600/40 border border-slate-200 dark:border-slate-600 rounded w-4 h-4 inline-block leading-4 text-center -mb-[3px]">
<input type="checkbox" class="hidden" >
<i class="fas fa-check hidden text-xs text-slate-700 dark:text-slate-200"></i>
</div>
</label>
</td>
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-1.png" alt="" class="mr-2 h-8 rounded-full inline-block">Donald Gardner
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-indigo-600/5 text-indigo-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">New Lead</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
<!-- 2 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="w-4 p-4">
<label class="custom-label">
<div class="bg-white dark:bg-slate-600/40 border border-slate-200 dark:border-slate-600 rounded w-4 h-4 inline-block leading-4 text-center -mb-[3px]">
<input type="checkbox" class="hidden" checked>
<i class="fas fa-check hidden text-xs text-slate-700 dark:text-slate-200"></i>
</div>
</label>
</td>
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-5.png" alt="" class="mr-2 h-8 rounded-full inline-block">Matt Rosales
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-indigo-600/5 text-indigo-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">New Lead</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
<!-- 3 -->
<tr class="bg-white border-b border-dashed dark:bg-gray-900 dark:border-gray-700/40">
<td class="w-4 p-4">
<label class="custom-label">
<div class="bg-white dark:bg-slate-600/40 border border-slate-200 dark:border-slate-600 rounded w-4 h-4 inline-block leading-4 text-center -mb-[3px]">
<input type="checkbox" class="hidden" >
<i class="fas fa-check hidden text-xs text-slate-700 dark:text-slate-200"></i>
</div>
</label>
</td>
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-4.png" alt="" class="mr-2 h-8 rounded-full inline-block">Michael Hill
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-red-600/5 text-red-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">Lost</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
<!-- 4 -->
<tr class="bg-white dark:bg-gray-900">
<td class="w-4 p-4">
<label class="custom-label">
<div class="bg-white dark:bg-slate-600/40 border border-slate-200 dark:border-slate-600 rounded w-4 h-4 inline-block leading-4 text-center -mb-[3px]">
<input type="checkbox" class="hidden" checked>
<i class="fas fa-check hidden text-xs text-slate-700 dark:text-slate-200"></i>
</div>
</label>
</td>
<td class="p-3 text-sm font-medium whitespace-nowrap dark:text-white">
<img src="assets/images/users/avatar-2.png" alt="" class="mr-2 h-8 rounded-full inline-block">Dorothy Key
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
xyx@gmail.com
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
+123456789
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<span class="bg-green-600/5 text-green-600 text-[11px] font-medium px-2.5 py-0.5 rounded h-5">Converted</span>
</td>
<td class="p-3 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400">
<a href="#"><i class="icofont-edit text-lg text-gray-500 dark:text-gray-400"></i></a>
<a href="#"><i class="icofont-ui-delete text-lg text-red-500 dark:text-red-400"></i></a>
</td>
</tr>
</tbody>
</table>
@@include("partials/footer/footer.html")