fix(video-player): fix the video player to permit the nagivation through the video (it was because de fast api server refused range request)

frontend/src/views/Events.vue

@@ -1,14 +1,14 @@
 <template>
   <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
     <!-- Header -->
-    <div class="flex justify-between items-center mb-8">
+    <div class="flex flex-col sm:flex-row justify-between items-start sm:items-center mb-6 sm:mb-8 space-y-4 sm:space-y-0">
       <div>
-        <h1 class="text-3xl font-bold text-gray-900">Événements</h1>
-        <p class="text-gray-600 mt-1">Organisez et participez aux événements du groupe</p>
+        <h1 class="text-2xl sm:text-3xl font-bold text-gray-900">Événements</h1>
+        <p class="text-sm sm:text-base text-gray-600 mt-1">Organisez et participez aux événements du groupe</p>
       </div>
       <button
         @click="showCreateModal = true"
-        class="btn-primary"
+        class="w-full sm:w-auto btn-primary justify-center"
       >
         <Plus class="w-4 h-4 mr-2" />
         Nouvel événement
@@ -214,51 +214,6 @@
               >
             </div>
             
-            <!-- Map Section -->
-            <div>
-              <label class="label">Coordonnées géographiques (optionnel)</label>
-              <div class="grid grid-cols-2 gap-3">
-                <div>
-                  <label class="text-sm text-gray-600">Latitude</label>
-                  <input
-                    v-model="newEvent.latitude"
-                    type="number"
-                    step="0.000001"
-                    class="input"
-                    placeholder="48.8566"
-                  >
-                </div>
-                <div>
-                  <label class="text-sm text-gray-600">Longitude</label>
-                  <input
-                    v-model="newEvent.longitude"
-                    type="number"
-                    step="0.000001"
-                    class="input"
-                    placeholder="2.3522"
-                  >
-                </div>
-              </div>
-              
-              <!-- Map Preview -->
-              <div v-if="newEvent.latitude && newEvent.longitude" class="mt-3">
-                <div class="bg-gray-100 rounded-lg p-4 h-32 flex items-center justify-center">
-                  <div class="text-center text-gray-600">
-                    <MapPin class="w-8 h-8 mx-auto mb-2 text-primary-600" />
-                    <p class="text-sm">Localisation sélectionnée</p>
-                    <p class="text-xs mt-1">{{ newEvent.latitude }}, {{ newEvent.longitude }}</p>
-                    <a 
-                      :href="`https://www.openstreetmap.org/?mlat=${newEvent.latitude}&mlon=${newEvent.longitude}&zoom=15`"
-                      target="_blank"
-                      class="text-primary-600 hover:underline text-xs mt-2 inline-block"
-                    >
-                      Voir sur OpenStreetMap
-                    </a>
-                  </div>
-                </div>
-              </div>
-            </div>
-            
             <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
               <div>
                 <label class="label">Date et heure</label>
@@ -339,8 +294,6 @@ const newEvent = ref({
   description: '',
   date: '',
   location: '',
-  latitude: null,
-  longitude: null,
   end_date: null
 })
 
@@ -453,8 +406,6 @@ async function createEvent() {
       description: newEvent.value.description,
       date: new Date(newEvent.value.date).toISOString(),
       location: newEvent.value.location,
-      latitude: newEvent.value.latitude,
-      longitude: newEvent.value.longitude,
       end_date: newEvent.value.end_date ? new Date(newEvent.value.end_date).toISOString() : null
     }
     
@@ -478,8 +429,6 @@ function resetForm() {
     description: '',
     date: '',
     location: '',
-    latitude: null,
-    longitude: null,
     end_date: null
   }
 }