2 files changed, 13 insertions, 6 deletions

diff --git a/public/css/calendar.css b/public/css/calendar.css
index b762a89..5dfb343 100644
--- a/public/css/calendar.css
+++ b/public/css/calendar.css
@@ -1,6 +1,7 @@
 .event{
     border: 2px double;
     border-radius: 5px;
+    width: max-content;
 }
 #calendar_zone{
     display: flex;
diff --git a/public/js/calendar.js b/public/js/calendar.js
index fb26e80..af9ffb4 100644
--- a/public/js/calendar.js
+++ b/public/js/calendar.js
@@ -52,15 +52,21 @@ document.addEventListener('DOMContentLoaded', function(){
                 return date;
             }
 
-            const formated_start = formatDate(info.event.start);
-            const formated_end = formatDate(info.event.allDay ? getEndMinusOneDay(info.event.end) : info.event.end, info.event.allDay);
-            
+            const start = formatDate(info.event.start);
+            const start_date = start.split('T')[0];
+            const start_hour = (info.event.allDay ? '' : '<br>à ' + start.split('T')[1]).replace(":", "h");
+            const formated_start = 'le ' + start_date.split('-')[2] + '/' + start_date.split('-')[1] + '/' + start_date.split('-')[0] + start_hour;
+            const end = formatDate(info.event.allDay ? getEndMinusOneDay(info.event.end) : info.event.end, info.event.allDay);
+            const end_date = end.split('T')[0];
+            const end_hour = (info.event.allDay ? '' : '<br>à ' + end.split('T')[1]).replace(":", "h");
+            const formated_end = 'le ' + end_date.split('-')[2] + '/' + end_date.split('-')[1] + '/' + end_date.split('-')[0] + end_hour;
+
             const aside_content = `<div class="event" style="border-color: ` + info.event.backgroundColor +`;">
                         <h3>` + info.event.title + `</h3>
                         <p><i>` + info.event.extendedProps.description + `</i></p>
-                        <p>Journée entière: ` + (checked ? 'oui' : 'non') + `</p>
-                        <p>Début: ` + formated_start + `</p>
-                        <p>Fin: ` + formated_end + `</p>
+                        <p>Journée entière: <br>` + (checked ? 'oui' : 'non') + `</p>
+                        <p>Début: <br>` + formated_start + `</p>
+                        <p>Fin: <br> ` + formated_end + `</p>
                     </div>`;
 
             aside.innerHTML = aside_content;