Improve calendar visual distinction for weekend days

Add weekend highlighting to the calendar grid component to visually separate Saturday and Sunday from weekdays.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: cc2d271b-82f0-4d6a-9302-a0b067ffb429
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/cc2d271b-82f0-4d6a-9302-a0b067ffb429/AvJXlQr
This commit is contained in:
michaelschal committed 2025-08-18 12:57:46 +00:00
1 parent 1256b6e432
commit e0b06856bf
2 files changed
+3

No files matched your search

Binary file not shown.

After

Width:  |  Height:  |  Size: 76 KiB

+3
View File
@@ -378,6 +378,7 @@ export default function CalendarGrid({
{paddedDays.map((date, index) => {
const isCurrentMonth = isSameMonth(date, currentDate);
const isTodayDate = isToday(date);
const isWeekend = date.getDay() === 0 || date.getDay() === 6; // Dimanche (0) ou Samedi (6)
const { orders: dayOrders, deliveries: dayDeliveries } = getItemsForDate(date);
const dayPublicities = getPublicitiesForDate(date);
@@ -387,6 +388,8 @@ export default function CalendarGrid({
className={`h-32 border-r border-b border-gray-100 relative group cursor-pointer transition-colors ${
isTodayDate
? "bg-blue-50 hover:bg-blue-100 ring-1 ring-blue-200"
: isWeekend && isCurrentMonth
? "bg-gray-100 hover:bg-gray-200"
: isCurrentMonth
? "bg-white hover:bg-gray-50"
: "bg-gray-50"