mirror of
https://github.com/twinpath/app.git
synced 2026-01-26 21:32:02 +07:00
82 lines
4.9 KiB
PHP
82 lines
4.9 KiB
PHP
<div class="rounded-2xl border border-gray-200 bg-gray-100 dark:border-gray-800 dark:bg-white/[0.03]">
|
||
<div class="shadow-default rounded-2xl bg-white px-5 pb-11 pt-5 dark:bg-gray-900 sm:px-6 sm:pt-6">
|
||
<div class="flex justify-between">
|
||
<div>
|
||
<h3 class="text-lg font-semibold text-gray-800 dark:text-white/90">
|
||
Monthly Target
|
||
</h3>
|
||
<p class="mt-1 text-theme-sm text-gray-500 dark:text-gray-400">
|
||
Target you’ve set for each month
|
||
</p>
|
||
</div>
|
||
<!-- Dropdown Menu -->
|
||
<x-common.dropdown-menu />
|
||
<!-- End Dropdown Menu -->
|
||
|
||
</div>
|
||
<div class="relative max-h-[195px]">
|
||
{{-- Chart --}}
|
||
<div id="chartTwo" class="h-full"></div>
|
||
<span class="absolute left-1/2 top-[85%] -translate-x-1/2 -translate-y-[85%] rounded-full bg-success-50 px-3 py-1 text-xs font-medium text-success-600 dark:bg-success-500/15 dark:text-success-500">+10%</span>
|
||
</div>
|
||
<p class="mx-auto mt-1.5 w-full max-w-[380px] text-center text-sm text-gray-500 sm:text-base">
|
||
You earn $3287 today, it's higher than last month. Keep up your good work!
|
||
</p>
|
||
</div>
|
||
|
||
<div class="flex items-center justify-center gap-5 px-6 py-3.5 sm:gap-8 sm:py-5">
|
||
<div>
|
||
<p class="mb-1 text-center text-theme-xs text-gray-500 dark:text-gray-400 sm:text-sm">
|
||
Target
|
||
</p>
|
||
<p
|
||
class="flex items-center justify-center gap-1 text-base font-semibold text-gray-800 dark:text-white/90 sm:text-lg">
|
||
$20K
|
||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none"
|
||
xmlns="http://www.w3.org/2000/svg">
|
||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||
d="M7.26816 13.6632C7.4056 13.8192 7.60686 13.9176 7.8311 13.9176C7.83148 13.9176 7.83187 13.9176 7.83226 13.9176C8.02445 13.9178 8.21671 13.8447 8.36339 13.6981L12.3635 9.70076C12.6565 9.40797 12.6567 8.9331 12.3639 8.6401C12.0711 8.34711 11.5962 8.34694 11.3032 8.63973L8.5811 11.36L8.5811 2.5C8.5811 2.08579 8.24531 1.75 7.8311 1.75C7.41688 1.75 7.0811 2.08579 7.0811 2.5L7.0811 11.3556L4.36354 8.63975C4.07055 8.34695 3.59568 8.3471 3.30288 8.64009C3.01008 8.93307 3.01023 9.40794 3.30321 9.70075L7.26816 13.6632Z"
|
||
fill="#D92D20" />
|
||
</svg>
|
||
</p>
|
||
</div>
|
||
|
||
<div class="h-7 w-px bg-gray-200 dark:bg-gray-800"></div>
|
||
|
||
<div>
|
||
<p class="mb-1 text-center text-theme-xs text-gray-500 dark:text-gray-400 sm:text-sm">
|
||
Revenue
|
||
</p>
|
||
<p
|
||
class="flex items-center justify-center gap-1 text-base font-semibold text-gray-800 dark:text-white/90 sm:text-lg">
|
||
$20K
|
||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none"
|
||
xmlns="http://www.w3.org/2000/svg">
|
||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||
d="M7.60141 2.33683C7.73885 2.18084 7.9401 2.08243 8.16435 2.08243C8.16475 2.08243 8.16516 2.08243 8.16556 2.08243C8.35773 2.08219 8.54998 2.15535 8.69664 2.30191L12.6968 6.29924C12.9898 6.59203 12.9899 7.0669 12.6971 7.3599C12.4044 7.6529 11.9295 7.65306 11.6365 7.36027L8.91435 4.64004L8.91435 13.5C8.91435 13.9142 8.57856 14.25 8.16435 14.25C7.75013 14.25 7.41435 13.9142 7.41435 13.5L7.41435 4.64442L4.69679 7.36025C4.4038 7.65305 3.92893 7.6529 3.63613 7.35992C3.34333 7.06693 3.34348 6.59206 3.63646 6.29926L7.60141 2.33683Z"
|
||
fill="#039855" />
|
||
</svg>
|
||
</p>
|
||
</div>
|
||
|
||
<div class="h-7 w-px bg-gray-200 dark:bg-gray-800"></div>
|
||
|
||
<div>
|
||
<p class="mb-1 text-center text-theme-xs text-gray-500 dark:text-gray-400 sm:text-sm">
|
||
Today
|
||
</p>
|
||
<p
|
||
class="flex items-center justify-center gap-1 text-base font-semibold text-gray-800 dark:text-white/90 sm:text-lg">
|
||
$20K
|
||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none"
|
||
xmlns="http://www.w3.org/2000/svg">
|
||
<path fill-rule="evenodd" clip-rule="evenodd"
|
||
d="M7.60141 2.33683C7.73885 2.18084 7.9401 2.08243 8.16435 2.08243C8.16475 2.08243 8.16516 2.08243 8.16556 2.08243C8.35773 2.08219 8.54998 2.15535 8.69664 2.30191L12.6968 6.29924C12.9898 6.59203 12.9899 7.0669 12.6971 7.3599C12.4044 7.6529 11.9295 7.65306 11.6365 7.36027L8.91435 4.64004L8.91435 13.5C8.91435 13.9142 8.57856 14.25 8.16435 14.25C7.75013 14.25 7.41435 13.9142 7.41435 13.5L7.41435 4.64442L4.69679 7.36025C4.4038 7.65305 3.92893 7.6529 3.63613 7.35992C3.34333 7.06693 3.34348 6.59206 3.63646 6.29926L7.60141 2.33683Z"
|
||
fill="#039855" />
|
||
</svg>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|