From ebb7bba8eaf7095300355523ef383494711d7d37 Mon Sep 17 00:00:00 2001
From: Alma <alma@MacBook-Air-de-Alma.local>
Date: Sun, 13 Apr 2025 19:31:39 +0200
Subject: [PATCH] agenda widget

---
 components/calendar.tsx | 34 +++++++++++++++++++++++++++-------
 1 file changed, 27 insertions(+), 7 deletions(-)

diff --git a/components/calendar.tsx b/components/calendar.tsx
index ce3bf25f..197f50c5 100644
--- a/components/calendar.tsx
+++ b/components/calendar.tsx
@@ -79,10 +79,18 @@ export function Calendar() {
     }).format(date);
   };
 
+  const formatTime = (dateString: string) => {
+    const date = new Date(dateString);
+    return new Intl.DateTimeFormat('fr-FR', {
+      hour: '2-digit',
+      minute: '2-digit',
+    }).format(date);
+  };
+
   return (
     <Card className="transition-transform duration-500 ease-in-out transform hover:scale-105 bg-white/95 backdrop-blur-sm border-0 shadow-lg">
       <CardHeader className="flex flex-row items-center justify-between pb-2 border-b border-gray-100">
-        <CardTitle className="text-lg font-semibold text-gray-800">Calendar</CardTitle>
+        <CardTitle className="text-lg font-semibold text-gray-800">Agenda</CardTitle>
         <Button 
           variant="ghost" 
           size="icon" 
@@ -110,24 +118,36 @@ export function Calendar() {
               >
                 <div className="flex gap-2">
                   <div 
-                    className="flex-shrink-0 w-12 h-12 rounded-lg flex flex-col items-center justify-center border"
+                    className="flex-shrink-0 w-14 h-14 rounded-lg flex flex-col items-center justify-center border"
                     style={{
                       backgroundColor: `${event.calendarColor}10`,
                       borderColor: event.calendarColor
                     }}
                   >
-                    <CalendarIcon className="h-4 w-4" style={{ color: event.calendarColor }} />
                     <span 
-                      className="text-[10px] font-medium mt-0.5"
+                      className="text-[10px] font-medium"
                       style={{ color: event.calendarColor }}
                     >
                       {formatDate(event.start)}
                     </span>
+                    <span 
+                      className="text-[10px] font-bold mt-0.5"
+                      style={{ color: event.calendarColor }}
+                    >
+                      {formatTime(event.start)}
+                    </span>
                   </div>
                   <div className="flex-1 min-w-0 space-y-1">
-                    <p className="text-sm font-medium text-gray-800 line-clamp-2">
-                      {event.title}
-                    </p>
+                    <div className="flex items-start justify-between gap-2">
+                      <p className="text-sm font-medium text-gray-800 line-clamp-2 flex-1">
+                        {event.title}
+                      </p>
+                      {!event.allDay && (
+                        <span className="text-[10px] text-gray-500 whitespace-nowrap">
+                          {formatTime(event.start)} - {formatTime(event.end)}
+                        </span>
+                      )}
+                    </div>
                     <div 
                       className="flex items-center text-[10px] px-1.5 py-0.5 rounded-md"
                       style={{