Updates event time formatting and improves text handling

Modifies event time display to include timezone information.
Enhances text rendering for better readability by allowing line breaks.

Author: Aloento

src/Components/Event/EventCard.tsx

@@ -31,7 +31,7 @@ export function EventCard({ Event }: { Event: Models.IEvent }) {
         <div className="flex items-center gap-x-3">
           <Indicator Type={Event.Type} />
 
-          <h3 className="text-2xl font-medium text-slate-800">
+          <h3 className="text-2xl font-medium text-slate-800 break-all">
             {Event.Title}
           </h3>
         </div>
@@ -72,11 +72,11 @@ export function EventCard({ Event }: { Event: Models.IEvent }) {
           </label>
 
           <label className="text-xl font-medium text-slate-700">
-            {dayjs(Event.Start).tz(Dic.TZ).format(Dic.Time)}
+            {dayjs(Event.Start).tz(Dic.TZ).format(Dic.TimeTZ)}
           </label>
 
           <label className="text-xl font-medium text-slate-700">
-            {Event.End ? dayjs(Event.End).tz(Dic.TZ).format(Dic.Time) : "Still Ongoing"}
+            {Event.End ? dayjs(Event.End).tz(Dic.TZ).format(Dic.TimeTZ) : "Still Ongoing"}
           </label>
         </div>
       </div>

src/Components/Event/EventLog.tsx

@@ -42,11 +42,11 @@ export function EventLog({ Event }: { Event: Models.IEvent }) {
                 <label className="font-medium">{history.Status}</label>
 
                 <label>
-                  {dayjs(history.Created).tz(Dic.TZ).format(Dic.Time)}
+                  {dayjs(history.Created).tz(Dic.TZ).format(Dic.TimeTZ)}
                 </label>
               </td>
 
-              <td className="text-pretty">{history.Message}</td>
+              <td className="text-pretty break-all">{history.Message}</td>
             </tr>
           ))}
         </tbody>