From 3da49f68a27142ef5e2c48d4ebb760133ed7f821 Mon Sep 17 00:00:00 2001
From: michaelschal <35957947-michaelschal@users.noreply.replit.com>
Date: Thu, 11 Sep 2025 11:24:17 +0000
Subject: [PATCH] Improve visual feedback when marking customers as called

Update the UI for the "mark as called" button to include better styling and a tooltip for the customer order page, along with corresponding Tailwind CSS configurations.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 95e8aab4-f39f-4b48-aa57-a759ec15ba3d
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/95e8aab4-f39f-4b48-aa57-a759ec15ba3d/TckvSqR
---
 client/src/pages/CustomerOrders.tsx | 5 +++--
 tailwind.config.ts                  | 1 +
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/client/src/pages/CustomerOrders.tsx b/client/src/pages/CustomerOrders.tsx
index bdd9512..1f3e141 100644
--- a/client/src/pages/CustomerOrders.tsx
+++ b/client/src/pages/CustomerOrders.tsx
@@ -890,10 +890,11 @@ export default function CustomerOrders() {
                               variant="outline"
                               size="sm"
                               onClick={() => handleNotificationToggle(order)}
-                              className={order.customerNotified ? "bg-green-100" : ""}
+                              className={order.customerNotified ? "bg-green-600 hover:bg-green-700 text-white border-green-600" : "hover:bg-gray-50"}
+                              title={order.customerNotified ? "Client contacté ✓" : "Cliquer pour marquer comme contacté"}
                             >
                               {order.customerNotified ? (
-                                <PhoneCall className="h-4 w-4" />
+                                <PhoneCall className="h-4 w-4 text-white" />
                               ) : (
                                 <Phone className="h-4 w-4" />
                               )}
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 19d297c..f2e161f 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -18,6 +18,7 @@ export default {
     // Classes pour alertes appels clients (production-safe)
     'bg-orange-50', 'border-orange-200', 'text-orange-700', 'bg-orange-600', 'hover:bg-orange-700',
     'bg-green-600', 'hover:bg-green-700', 'bg-blue-600', 'hover:bg-blue-700',
+    'border-green-600', 'text-white', 'hover:bg-gray-50',
     'sticky', 'top-0', 'z-50', 'cursor-pointer',
     'max-w-2xl', 'w-full', 'mx-4', 'max-h-[80vh]', 'overflow-y-auto'
   ],