terrylee/star-cloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: optimize flatpickr calendar styling, input dimensions, and icon alignment

Browse Source
This commit is contained in:
sky121113 2026-05-18 15:04:31 +08:00
parent e4c63bbf38
commit 676e91fd66
2 changed files with 22 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
resources/css/app.css
View File

@ -356,6 +356,23 @@
color: #cbd5e1 !important; color: #cbd5e1 !important;
} }
/* Standardize Flatpickr Date Range Continuity & Custom Borders */
.flatpickr-day.inRange {
border-radius: 0 !important;
}
.flatpickr-day.startRange {
border-radius: 12px 0 0 12px !important;
}
.flatpickr-day.endRange {
border-radius: 0 12px 12px 0 !important;
}
.flatpickr-day.startRange.endRange {
border-radius: 12px !important;
}
.flatpickr-day.prevMonthDay, .flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay { .flatpickr-day.nextMonthDay {
color: #cbd5e1 !important; color: #cbd5e1 !important;
@ -412,7 +429,7 @@
} }
.dark .flatpickr-weekday { .dark .flatpickr-weekday {
color: #475569 !important; color: #94a3b8 !important;
} }
.flatpickr-months .flatpickr-month { .flatpickr-months .flatpickr-month {

10
resources/views/admin/analysis/product-reports.blade.php
View File

@ -125,15 +125,13 @@
<!-- Filter Controls Form --> <!-- Filter Controls Form -->
<div class="flex flex-col sm:flex-row sm:items-center gap-3 w-full xl:w-auto xl:flex-1 xl:justify-end relative"> <div class="flex flex-col sm:flex-row sm:items-center gap-3 w-full xl:w-auto xl:flex-1 xl:justify-end relative">
<!-- Date Range (Flatpickr) --> <!-- Date Range (Flatpickr) -->
<div class="w-full sm:w-72 relative focus-within:z-[30]"> <div class="w-full sm:w-80 relative focus-within:z-[50]">
<div class="relative group"> <div class="relative group">
<span class="absolute inset-y-0 left-0 flex items-center pl-4 pointer-events-none z-10 text-slate-400"> <span class="absolute inset-y-0 left-0 flex items-center pl-4 pointer-events-none z-10 text-slate-400 group-focus-within:text-cyan-500 transition-colors">
<svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"> <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" /></svg>
<path stroke-linecap="round" stroke-linejoin="round" d="M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 0 1 2.25-2.25h13.5A2.25 2.25 0 0 1 21 7.5v11.25m-18 0A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75m-18 0v-7.5A2.25 2.25 0 0 1 5.25 9h13.5A2.25 2.25 0 0 1 21 11.25v7.5m-9-6h.008v.008H12v-.008ZM12 15h.008v.008H12V15Zm0 2.25h.008v.008H12v-.008ZM9.75 15h.008v.008H9.75V15Zm0 2.25h.008v.008H9.75v-.008ZM7.5 15h.008v.008H7.5V15Zm0 2.25h.008v.008H7.5v-.008Zm6.75-4.5h.008v.008h-.008v-.008Zm0 2.25h.008v.008h-.008V15Zm0 2.25h.008v.008h-.008v-.008Zm2.25-4.5h.008v.008H16.5v-.008Zm0 2.25h.008v.008H16.5V15Z" />
</svg>
</span> </span>
<input type="text" x-ref="dateInput" readonly <input type="text" x-ref="dateInput" readonly
class="luxury-input py-3 pl-12 pr-6 block w-full text-sm font-bold cursor-pointer" class="luxury-input py-2.5 pl-12 pr-6 block w-full text-sm font-bold cursor-pointer"
placeholder="{{ __('Date Range') }}"> placeholder="{{ __('Date Range') }}">
</div> </div>
</div> </div>