From bc17d9f03d3982bbdfde845ce94a6b526acb8fac Mon Sep 17 00:00:00 2001
From: michaelschal <35957947-michaelschal@users.noreply.replit.com>
Date: Mon, 18 Aug 2025 13:07:08 +0000
Subject: [PATCH] Make calendar weekend days lighter and dividers darker

Adjust CSS classes in CalendarGrid.tsx to modify border colors for the calendar grid and background colors for weekend days.

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
---
 client/src/components/CalendarGrid.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/client/src/components/CalendarGrid.tsx b/client/src/components/CalendarGrid.tsx
index 1b6e947..008119d 100644
--- a/client/src/components/CalendarGrid.tsx
+++ b/client/src/components/CalendarGrid.tsx
@@ -365,7 +365,7 @@ export default function CalendarGrid({
   return (
     <div className="bg-white shadow-sm border border-gray-200 overflow-hidden">
       {/* Calendar Header */}
-      <div className="grid grid-cols-7 bg-gray-50 border-b border-gray-200">
+      <div className="grid grid-cols-7 bg-gray-50 border-b border-gray-300">
         {weekDays.map(day => (
           <div key={day} className="p-4 text-center text-sm font-medium text-gray-700">
             {day}
@@ -385,11 +385,11 @@ export default function CalendarGrid({
           return (
             <div
               key={index}
-              className={`h-32 border-r border-b border-gray-100 relative group cursor-pointer transition-colors ${
+              className={`h-32 border-r border-b border-gray-300 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"
+                  ? "bg-gray-50 hover:bg-gray-100"
                   : isCurrentMonth
                   ? "bg-white hover:bg-gray-50"
                   : "bg-gray-50"