From ea6567dd82e9500064870342eeffa47d123923e6 Mon Sep 17 00:00:00 2001
From: simon bailly <simon.bailly5@gmail.com>
Date: Tue, 15 Oct 2024 15:40:31 +0400
Subject: [PATCH 1/3] Small changes colors + language

---
 src/App.vue                        | 16 +++++++++++++
 src/components/AlertComponent.vue  |  4 ++--
 src/components/AppFooter.vue       |  2 +-
 src/components/AppHeader.vue       | 11 ++++-----
 src/components/CreateComponent.vue |  6 ++---
 src/components/DeleteComponent.vue |  6 ++---
 src/components/LoginComponent.vue  |  6 ++---
 src/components/LogoutComponent.vue |  2 +-
 src/components/MapDetails.vue      | 36 +++++++++++++++---------------
 src/components/UpdateComponent.vue | 20 ++++++++---------
 src/views/HomePage.vue             | 25 +++++++++++++++++----
 src/views/MapsPage.vue             | 22 +++++++++---------
 12 files changed, 95 insertions(+), 61 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 3c2b415..9e84ee6 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -38,6 +38,7 @@ import AppFooter from './components/AppFooter.vue'
 
     <!-- Optional -->
     <template #acceptContent>J'accepte!</template>
+
   </vue-cookie-accept-decline>
 
 </template>
@@ -48,4 +49,19 @@ import AppFooter from './components/AppFooter.vue'
   display: flex;
   flex-direction: column;
 }
+
+#cookconsent {
+  color:#3C002E !important;
+}
+
+.cookie__floating__buttons__button--accept:hover {
+  background-color:#FF803D !important;
+  color:#fff !important;
+}
+
+.cookie__floating__buttons__button--accept {
+  background-color:#fff !important;
+  color: #FF803D !important;
+}
+
 </style>
diff --git a/src/components/AlertComponent.vue b/src/components/AlertComponent.vue
index 5e22876..35d4773 100644
--- a/src/components/AlertComponent.vue
+++ b/src/components/AlertComponent.vue
@@ -18,8 +18,8 @@ const props = defineProps({
 
   .alert.alert-success {
     background-color: #fff !important;
-    color: #FF953D;
-    border: #FF953D solid 1px;
+    color: #FF803D;
+    border: #FF803D solid 1px;
   }
 
 </style>
diff --git a/src/components/AppFooter.vue b/src/components/AppFooter.vue
index 20275fe..e7de131 100644
--- a/src/components/AppFooter.vue
+++ b/src/components/AppFooter.vue
@@ -49,7 +49,7 @@ async function goToMaps() {
   }
 
   .inter-footer {
-    color: #390040 !important;
+    color: #3C002E !important;
     font-family: "Inter", sans-serif;
     font-optical-sizing: auto;
     font-weight: 550 !important;
diff --git a/src/components/AppHeader.vue b/src/components/AppHeader.vue
index 116b6cd..1b9611c 100644
--- a/src/components/AppHeader.vue
+++ b/src/components/AppHeader.vue
@@ -64,7 +64,7 @@ onMounted(async () => {
   <div v-if="isAuthLoading" class="overlay">
     <div class="overlay__wrapper">
       <div class="overlay__spinner">
-        <div class="spinner-grow" style="width: 3rem; height: 3rem; color:#390040" role="status">
+        <div class="spinner-grow" style="width: 3rem; height: 3rem; color:#3C002E" role="status">
           <span class="visually-hidden">Loading...</span>
         </div>
       </div>
@@ -72,7 +72,7 @@ onMounted(async () => {
   </div>
     
   <div id="header">
-    <nav class="navbar navbar-expand-md navbar-light" style="border-bottom: 1.5px solid #390040;">
+    <nav class="navbar navbar-expand-md navbar-light" style="border-bottom: 1.5px solid #3C002E;">
       <div class="container-fluid">
         <a class="navbar-brand">
           <img src="./icons/logo.svg" alt="Kavalé Logo"/>
@@ -88,6 +88,7 @@ onMounted(async () => {
             </a>
             <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
               <li class="nav-item"><button class="dropdown-item inter-maps" @click="goToMaps()">Réunion</button></li>
+              <li class="nav-item"><button class="dropdown-item inter-maps" @click="goToMaps()">Jura</button></li>
             </ul>
           </li>
 
@@ -97,8 +98,8 @@ onMounted(async () => {
         </ul>
         <form class="form-inline">
           <button class="btn btn-outline-secondary" style="margin-right: 8px;" type="button" @click="showLogin()">Mon compte</button>
-          <button class="btn btn-danger" style="margin-left: 5px;" type="button" @click="showLogout()" data-toggle="tooltip" title="Se déconnecter" :disabled="!isLoggedIn">
-            <i class="pi pi-sign-out" style="color:white;"></i>
+          <button class="btn btn-outline-primary" style="margin-left: 5px;" type="button" @click="showLogout()" data-toggle="tooltip" title="Se déconnecter" :disabled="!isLoggedIn">
+            <i class="pi pi-sign-out"></i>
           </button>
         </form>
       </div>
@@ -156,7 +157,7 @@ onMounted(async () => {
   }
 
   .dropdown-item.inter-maps:hover {
-    background-color: #390040;
+    background-color: #3C002E;
     color: #fff !important;
   }
   
diff --git a/src/components/CreateComponent.vue b/src/components/CreateComponent.vue
index 7f0d834..8998811 100644
--- a/src/components/CreateComponent.vue
+++ b/src/components/CreateComponent.vue
@@ -187,13 +187,13 @@ async function onSubmit() {
 <style>
 
 .range-cust::-webkit-slider-thumb {
-  background: #390040 !important;
+  background: #3C002E !important;
 }
 .range-cust::-moz-range-thumb {
-  background: #390040 !important;
+  background: #3C002E !important;
 }
 .range-cust::-ms-thumb {
-  background: #390040 !important;
+  background: #3C002E !important;
 }
 
 </style>
diff --git a/src/components/DeleteComponent.vue b/src/components/DeleteComponent.vue
index 8e7bfb4..b2e0b81 100644
--- a/src/components/DeleteComponent.vue
+++ b/src/components/DeleteComponent.vue
@@ -25,12 +25,12 @@ async function deleteHike() {
 
 <div class="modal fade" id="#delete" tabindex="-1" aria-labelledby="#delete" aria-hidden="true">
   <div class="modal-dialog modal-confirm">
-    <div class="modal-content">
-      <div class="modal-header inter-maps">
+    <div class="modal-content inter-maps">
+      <div class="modal-header">
         <h1 class="modal-title fs-5" id="#delete">Êtes-vous certain ?</h1>
         <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
       </div>
-      <div class="modal-body inter-maps">
+      <div class="modal-body">
         <p>Voulez-vous vraiment supprimer l'itinéraire ? Cette action est irréversible.</p>
       </div>
       <div class="modal-footer">
diff --git a/src/components/LoginComponent.vue b/src/components/LoginComponent.vue
index abceea3..d48ee20 100644
--- a/src/components/LoginComponent.vue
+++ b/src/components/LoginComponent.vue
@@ -53,7 +53,7 @@ async function signInAsGuest() {
 <div v-if="isAuthLoading" class="overlay">
   <div class="overlay__wrapper">
     <div class="overlay__spinner">
-      <div class="spinner-grow" style="width: 3rem; height: 3rem; color:#390040" role="status">
+      <div class="spinner-grow" style="width: 3rem; height: 3rem; color:#3C002E" role="status">
         <span class="visually-hidden">Loading...</span>
       </div>
     </div>
@@ -106,8 +106,8 @@ async function signInAsGuest() {
 
         <div>
           Continuer en tant qu'invité &#x1F609;
-          <button class="btn btn-danger btn-sm" style="margin-left: 5px;" type="button" @click="signInAsGuest()">
-            <i class="pi pi-sign-in" style="color:white;"></i>
+          <button class="btn btn-outline-primary btn-sm" style="margin-left: 5px;" type="button" @click="signInAsGuest()">
+            <i class="pi pi-sign-in"></i>
           </button>
           <br/>
         </div>
diff --git a/src/components/LogoutComponent.vue b/src/components/LogoutComponent.vue
index 1336632..7e2ba40 100644
--- a/src/components/LogoutComponent.vue
+++ b/src/components/LogoutComponent.vue
@@ -28,7 +28,7 @@ async function signout() {
 
 <div class="modal fade" id="#logout" tabindex="-1" aria-labelledby="#logout" aria-hidden="true">
   <div class="modal-dialog modal-confirm">
-    <div class="modal-content">
+    <div class="modal-content inter-maps">
       <div class="modal-header">
         <h1 class="modal-title fs-5" id="#logout">Êtes-vous certain ?</h1>
         <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
diff --git a/src/components/MapDetails.vue b/src/components/MapDetails.vue
index 32752b8..6d64de5 100644
--- a/src/components/MapDetails.vue
+++ b/src/components/MapDetails.vue
@@ -173,14 +173,14 @@ watch(mapcenter, () => {
 
 const selectedStyle = ref(
   {
-    'color':'#FF953D', 
+    'color':'#FF803D', 
     'weight': 5
   }
 )
 
 const unselectedStyle = ref(
   {
-    'color':'#390040',
+    'color':'#3C002E',
     'weight': 5
   }
 )
@@ -197,7 +197,7 @@ const colorMappings = {
     Simaps: {
         'Elevation': {
             text: 'Altitude',
-            color: '#FF953D'
+            color: '#FF803D'
         }
     }
   }
@@ -420,7 +420,7 @@ onMounted(async () => {
   <div v-if="isResponseLoading" class="overlay">
     <div class="overlay__wrapper">
         <div class="overlay__spinner">
-          <div class="spinner-grow" style="width: 3rem; height: 3rem; color:#390040" role="status">
+          <div class="spinner-grow" style="width: 3rem; height: 3rem; color:#3C002E" role="status">
             <span class="visually-hidden">Loading...</span>
           </div>
         </div>
@@ -432,7 +432,7 @@ onMounted(async () => {
     <div class="col-lg-7" style='padding: 10px;'>
       <br/>
 
-      <div class="mapContainer" v-if="ismapdata" style='border: 2px solid #390040;'>
+      <div class="mapContainer" v-if="ismapdata" style='border: 2px solid #3C002E;'>
         <l-map ref="myMap" :zoom="13" :center="mapcenter" :use-global-leaflet="true" @ready="onReady()" @update:zoom="zoomUpdated">
 
           <l-control-layers position="topright"></l-control-layers>
@@ -452,8 +452,8 @@ onMounted(async () => {
 
           <l-geo-json @click="selectedHike=hike.id, showHeightgraph(hike.trail.geojson), fitBounds(hike.trail.geojson)" v-for="hike in sortedHikes" :key="hike.id" :geojson="hike.trail.geojson" :options-style="selectedHike == hike.id ? function() {return selectedStyle} : function() {return unselectedStyle}">
             <l-popup :options="{ closeButton:true, closeOnClick:true }" class="inter-maps">{{ hike.name }}<br/> 
-              <i v-for="rate in hike.rates" class="pi pi-star-fill" style="font-size: 1rem; color:#390040;"></i>
-              <i v-for="rate in (4 - hike.rates)" class="pi pi-star" style="font-size: 1rem; color:#390040;"></i>
+              <i v-for="rate in hike.rates" class="pi pi-star-fill" style="font-size: 1rem; color:#3C002E;"></i>
+              <i v-for="rate in (4 - hike.rates)" class="pi pi-star" style="font-size: 1rem; color:#3C002E;"></i>
             </l-popup>
           </l-geo-json> 
 
@@ -531,7 +531,7 @@ onMounted(async () => {
           </div>
           <div class="col-2 inter-maps">
             <button class="btn btn-light btn-sm" @click="resetFilters()" data-toggle="tooltip" title="réinitialiser">
-              <i class="pi pi-filter-slash" style="color:#390040;"></i>
+              <i class="pi pi-filter-slash" style="color:#3C002E;"></i>
             </button>
           </div>
         </div>
@@ -556,8 +556,8 @@ onMounted(async () => {
                   <span v-if="hike.difficulty == 4" class="badge bg-dark">Très difficile</span>
                 </div>
                 <div class="col-2">
-                  <i v-for="rate in hike.rates" class="pi pi-star-fill" style="font-size: 1rem; color:#390040;"></i> 
-                  <i v-for="rate in (4 - hike.rates)" class="pi pi-star" style="font-size: 1rem; color:#390040;"></i>
+                  <i v-for="rate in hike.rates" class="pi pi-star-fill" style="font-size: 1rem; color:#3C002E;"></i> 
+                  <i v-for="rate in (4 - hike.rates)" class="pi pi-star" style="font-size: 1rem; color:#3C002E;"></i>
                 </div>
               </button>
             </h2>
@@ -572,16 +572,16 @@ onMounted(async () => {
                 <br/><br/>
                 <div class="col text-end">
                   <button class="btn btn-light" @click="showHeightgraph(hike.trail.geojson), fitBounds(hike.trail.geojson),  selectedHike = hike.id" data-toggle="tooltip" title="voir sur la carte" :disabled="!hike.trail.geojson">
-                    <i class="pi pi-map" style="color:#390040;"></i>
+                    <i class="pi pi-map" style="color:#3C002E;"></i>
                   </button>
                   <button class="btn btn-light" @click="isLoggedIn ? (getJourneys(), showUpdate(), hikeDetails = hike) : showLogin()" data-toggle="tooltip" title="mettre à jour l'itinéraire">
-                    <i class="pi pi-file-edit" style="color:#390040;"></i>
+                    <i class="pi pi-file-edit" style="color:#3C002E;"></i>
                   </button>
                   <button class="btn btn-light"  @click="downloadGPX(hike.trail.geojson, hike.name)" data-toggle="tooltip" title="télécharger la trace gpx" :disabled="!hike.trail.geojson">
-                    <i class="pi pi-download" style="color:#390040;"></i>
+                    <i class="pi pi-download" style="color:#3C002E;"></i>
                   </button>
                   <button class="btn btn-light" @click="showDelete(), hikeDetails = hike" data-toggle="tooltip" :disabled="!isAdmin" title="supprimer l'itinéraire">
-                    <i class="pi pi-trash" style="color:#FF953D;"></i>
+                    <i class="pi pi-trash" style="color:#FF803D;"></i>
                   </button>
                 </div>
               </div>
@@ -676,9 +676,9 @@ onMounted(async () => {
   }
 
   .badge.bg-info {
-    color:#390040 !important; 
+    color:#3C002E !important; 
     background-color: #fff !important;
-    border: #390040 solid 1px;
+    border: #3C002E solid 1px;
     margin-left: 5px;
     margin-right: 5px;
 
@@ -721,9 +721,9 @@ onMounted(async () => {
   }
 
   .badge.bg-info {
-    color:#390040 !important; 
+    color:#3C002E !important; 
     background-color: #fff !important;
-    border: #390040 solid 1px;
+    border: #3C002E solid 1px;
     margin-left: 5px;
     margin-right: 5px;
   }
diff --git a/src/components/UpdateComponent.vue b/src/components/UpdateComponent.vue
index c1cf5c8..77b36de 100644
--- a/src/components/UpdateComponent.vue
+++ b/src/components/UpdateComponent.vue
@@ -129,19 +129,19 @@ const errors = ref([])
 async function onSubmit() {
   errors.value = []
   if (!updatedName.value) {
-    errors.value.push('Name is required.')
+    errors.value.push('Le nom est obligatoire.')
   }
   if (!updatedDistance.value) {
-    errors.value.push('Distance is required.')
+    errors.value.push('La distance est obligatoire.')
   }
   if (!updatedElevation.value) {
-    errors.value.push('Positive elevation is required.')
+    errors.value.push('Le dénivelé positif est obligatoire.')
   }
   if (!updatedDuration.value) {
-    errors.value.push('Duration is required.')
+    errors.value.push('La durée est obligatoire.')
   }
   if (!updatedJourney.value.name) {
-    errors.value.push('Journey type is required.')
+    errors.value.push('Le type d\'itinéraire est obligatoire.')
   }
   if (errors.value.length == 0) {
     updateHike()
@@ -161,10 +161,10 @@ async function onSubmit() {
       </div>
       <div class="modal-body">
         <form @submit.prevent="onSubmit()" novalidate>
-          <p v-if="errors.length">
+          <p v-if="errors.length" style="color:#FF803D;">
             <b>Veuillez corriger les erreurs suivantes :</b>
             <ul>
-              <li v-for="error in errors" style="color:#D6955B;">{{ error }}</li>
+              <li v-for="error in errors">{{ error }}</li>
             </ul>
           </p>
           <div class="form-group inter-maps">
@@ -224,13 +224,13 @@ async function onSubmit() {
 <style>
 
 .range-cust::-webkit-slider-thumb {
-  background: #390040 !important;
+  background: #3C002E !important;
 }
 .range-cust::-moz-range-thumb {
-  background: #390040 !important;
+  background: #3C002E !important;
 }
 .range-cust::-ms-thumb {
-  background: #390040 !important;
+  background: #3C002E !important;
 }
 
 </style>
diff --git a/src/views/HomePage.vue b/src/views/HomePage.vue
index 3531fd9..ecacdb2 100644
--- a/src/views/HomePage.vue
+++ b/src/views/HomePage.vue
@@ -48,7 +48,7 @@ async function goToMaps() {
   }
 
   .btn-outline-secondary {
-    color:#390040 !important;
+    color:#3C002E !important;
     font-family: "Inter", sans-serif !important;
     font-optical-sizing: auto;
     font-weight: 650 !important;
@@ -59,15 +59,32 @@ async function goToMaps() {
 
   .btn-outline-secondary:hover {
     color: #FFFFFF !important;
-    background-color:#390040 !important;
+    background-color:#3C002E !important;
   }
 
   .btn-danger {
-    background-color: #FF953D !important;
+    border-color: #FF803D !important;
+    background-color: #fff !important;
+    color: #FF803D !important;
+    font-family: "Inter", sans-serif !important;
+    font-optical-sizing: auto;
+    font-weight: 650 !important;
+    font-style: normal;
+  }
+
+  .btn-danger:hover {
+    color: #FFFFFF !important;
+    background-color:#FF803D !important;
+  }
+
+  .btn-outline-primary {
+    border-color: #FF803D !important;
+    color: #FFFFFF !important;
+    background-color:#FF803D !important;
   }
 
   .inter-maps {
-    color: #390040 !important;
+    color: #3C002E !important;
     font-family: "Inter", sans-serif;
     font-optical-sizing: auto;
     font-weight: 550 !important;
diff --git a/src/views/MapsPage.vue b/src/views/MapsPage.vue
index e7cf336..d042831 100644
--- a/src/views/MapsPage.vue
+++ b/src/views/MapsPage.vue
@@ -24,7 +24,7 @@ onMounted(async () => {
 <div v-if="isResponseLoading" class="overlay">
   <div class="overlay__wrapper">
       <div class="overlay__spinner">
-        <div class="spinner-grow" style="width: 3rem; height: 3rem; color:#390040" role="status">
+        <div class="spinner-grow" style="width: 3rem; height: 3rem; color:#3C002E" role="status">
           <span class="visually-hidden">Loading...</span>
         </div>
       </div>
@@ -42,7 +42,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Mafate</h4>
           <p class="card-text inter-maps-light">Le cirque le plus sauvage, aucune route n'y mène, un monde à part.</p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'mafate'}}">{{ count[1] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'mafate'}}">{{ count[1] }} itinéraires</router-link>
       </div>
     </div>
 
@@ -53,7 +53,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Cilaos</h4>
           <p class="card-text inter-maps-light">Au pied du Piton des Neiges, des possibilités infinies d'excursions.</p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'cilaos' }}">{{ count[2] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'cilaos' }}">{{ count[2] }} itinéraires</router-link>
       </div>
     </div>
 
@@ -64,7 +64,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Salazie</h4>
           <p class="card-text inter-maps-light">Nature verdoyante, cascades et villages de charme. </p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'salazie' }}">{{ count[3] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'salazie' }}">{{ count[3] }} itinéraires</router-link>
       </div>
     </div>
 
@@ -75,7 +75,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Volcan</h4>
           <p class="card-text inter-maps-light">Le cadre grandiose du Piton de la Fournaise, plus que jamais actif.</p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'volcan' }}">{{ count[4] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'volcan' }}">{{ count[4] }} itinéraires</router-link>
       </div>
     </div> 
 
@@ -86,7 +86,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Plaines</h4>
           <p class="card-text inter-maps-light">Entre deux massifs volcaniques, des paysages atypiques.</p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'plaines' }}">{{ count[5] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'plaines' }}">{{ count[5] }} itinéraires</router-link>
       </div>
     </div>
 
@@ -97,7 +97,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Piton des Neiges</h4>
           <p class="card-text inter-maps-light">Le plus haut sommet de l'Océan Indien, 3070 mètres.</p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'piton des neiges' }}">{{ count[6] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'piton des neiges' }}">{{ count[6] }} itinéraires</router-link>
       </div>
     </div>
 
@@ -108,7 +108,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Nord</h4>
           <p class="card-text inter-maps-light">Région moins connue, avec comme point culminant la Roche Écrite.</p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'nord' }}">{{ count[7] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'nord' }}">{{ count[7] }} itinéraires</router-link>
       </div>
     </div>
 
@@ -119,7 +119,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Sud</h4>
           <p class="card-text inter-maps-light">Le Sud Sauvage, pépite à l'ombre du Volcan.</p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'sud' }}">{{ count[8] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'sud' }}">{{ count[8] }} itinéraires</router-link>
       </div>
     </div>
 
@@ -130,7 +130,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Est</h4>
           <p class="card-text inter-maps-light">L'aventure au coeur de la jungle des forêts primaires.</p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'est' }}">{{ count[9] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'est' }}">{{ count[9] }} itinéraires</router-link>
       </div>
     </div>
 
@@ -141,7 +141,7 @@ onMounted(async () => {
           <h4 class="card-title inter-maps-bold">Ouest</h4>
           <p class="card-text inter-maps-light">Des points de vue célèbres et des itinéraires sportifs.</p>
         </div>
-        <router-link class="btn btn-outline-secondary" :to="{ name: 'MapDetails', params: { zone: 'ouest' }}">{{ count[10] }} itinéraires</router-link>
+        <router-link class="btn btn-danger" :to="{ name: 'MapDetails', params: { zone: 'ouest' }}">{{ count[10] }} itinéraires</router-link>
       </div>
     </div>
 

From 156874b9684b76b0728a5bcd4fa9cb0d3b295aa1 Mon Sep 17 00:00:00 2001
From: simon bailly <simon.bailly5@gmail.com>
Date: Tue, 22 Oct 2024 15:39:10 +0400
Subject: [PATCH 2/3] Viewpoint style and icon

---
 src/components/MapDetails.vue        | 28 ++++++++++++----------------
 src/components/icons/street-view.svg |  1 +
 src/components/icons/viewpoint.svg   |  8 --------
 3 files changed, 13 insertions(+), 24 deletions(-)
 create mode 100644 src/components/icons/street-view.svg
 delete mode 100644 src/components/icons/viewpoint.svg

diff --git a/src/components/MapDetails.vue b/src/components/MapDetails.vue
index 6d64de5..ee070fc 100644
--- a/src/components/MapDetails.vue
+++ b/src/components/MapDetails.vue
@@ -26,7 +26,7 @@ import 'leaflet.heightgraph/dist/L.Control.Heightgraph.min.css'
 // custom markers
 // todo use font-awesome
 import hostCustomMarker from './icons/host.svg'
-import viewpointCustomMarker from './icons/viewpoint.svg'
+import viewpointCustomMarker from './icons/street-view.svg'
 
 import { Modal } from 'bootstrap';
 import axios from 'axios';
@@ -164,7 +164,7 @@ async function getJourneys() {
 // leaflet map
 const myMap = ref(null)
 const mapcenter = ref('')
-const mapzoom = ref('')
+const mapzoom = ref(13)
 const ismapdata = ref(false)
 
 watch(mapcenter, () => {
@@ -461,20 +461,16 @@ onMounted(async () => {
             :visible="true"
             layerType="overlay"
             name="Points de vue">
-            <l-marker-cluster-group>
-              <l-marker-rotate
-                v-for="(item, index) in viewpoints"
-                :key="index"
-                :lat-lng="[item.lat, item.lng]"
-                :rotationAngle=45>
-                <l-popup class="inter-maps">{{ item.name }}</l-popup>
-                <l-icon
-                  :iconSize="mapzoom >= 15 ? [30, 30] : [20, 20]"
-                  :icon-url="viewpointCustomMarker"
-                  :icon-anchor="[3, 3]"
-                />
-              </l-marker-rotate>
-            </l-marker-cluster-group>
+            <l-marker
+              v-for="(item, index) in viewpoints"
+              :key="index"
+              :lat-lng="[item.lat, item.lng]">
+              <l-popup class="inter-maps">{{ item.name }}</l-popup>
+              <l-icon
+                :iconSize="mapzoom >= 15 ? [35, 35] : ((mapzoom >= 13 ? [25, 25] : [18, 18]))"
+                :icon-url="viewpointCustomMarker"
+              />
+            </l-marker>
           </l-layer-group>
 
           <l-layer-group 
diff --git a/src/components/icons/street-view.svg b/src/components/icons/street-view.svg
new file mode 100644
index 0000000..2333022
--- /dev/null
+++ b/src/components/icons/street-view.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="#9f0000" d="M320 64A64 64 0 1 0 192 64a64 64 0 1 0 128 0zm-96 96c-35.3 0-64 28.7-64 64l0 48c0 17.7 14.3 32 32 32l1.8 0 11.1 99.5c1.8 16.2 15.5 28.5 31.8 28.5l38.7 0c16.3 0 30-12.3 31.8-28.5L318.2 304l1.8 0c17.7 0 32-14.3 32-32l0-48c0-35.3-28.7-64-64-64l-64 0zM132.3 394.2c13-2.4 21.7-14.9 19.3-27.9s-14.9-21.7-27.9-19.3c-32.4 5.9-60.9 14.2-82 24.8c-10.5 5.3-20.3 11.7-27.8 19.6C6.4 399.5 0 410.5 0 424c0 21.4 15.5 36.1 29.1 45c14.7 9.6 34.3 17.3 56.4 23.4C130.2 504.7 190.4 512 256 512s125.8-7.3 170.4-19.6c22.1-6.1 41.8-13.8 56.4-23.4c13.7-8.9 29.1-23.6 29.1-45c0-13.5-6.4-24.5-14-32.6c-7.5-7.9-17.3-14.3-27.8-19.6c-21-10.6-49.5-18.9-82-24.8c-13-2.4-25.5 6.3-27.9 19.3s6.3 25.5 19.3 27.9c30.2 5.5 53.7 12.8 69 20.5c3.2 1.6 5.8 3.1 7.9 4.5c3.6 2.4 3.6 7.2 0 9.6c-8.8 5.7-23.1 11.8-43 17.3C374.3 457 318.5 464 256 464s-118.3-7-157.7-17.9c-19.9-5.5-34.2-11.6-43-17.3c-3.6-2.4-3.6-7.2 0-9.6c2.1-1.4 4.8-2.9 7.9-4.5c15.3-7.7 38.8-14.9 69-20.5z"/></svg>
\ No newline at end of file
diff --git a/src/components/icons/viewpoint.svg b/src/components/icons/viewpoint.svg
deleted file mode 100644
index 29135c0..0000000
--- a/src/components/icons/viewpoint.svg
+++ /dev/null
@@ -1,8 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1200pt" height="1200pt" version="1.1" viewBox="0 0 1200 1200">
- <path d="m366.48 600c0 69.109-56.172 125.28-125.41 125.28-69.109 0-125.28-56.172-125.28-125.28 0-69.238 56.172-125.34 125.28-125.34 69.238 0 125.41 56.102 125.41 125.34z" fill="#9f0000"/>
- <path d="m448.38 562.08v75.844l635.83 46.941v-169.73z" fill="#9f0000"/>
- <path d="m312.19 401.64 65.473 37.992 259.45-354.77-146.83-84.863z" fill="#9f0000"/>
- <path d="m401.91 463.75 37.719 65.66 470.94-218.23-84.863-147.04z" fill="#9f0000"/>
- <path d="m312.19 798.29 65.473-37.98 259.45 354.83-146.83 84.863z" fill="#9f0000"/>
- <path d="m401.91 736.2 37.719-65.602 470.94 218.22-84.863 146.96z" fill="#9f0000"/>
-</svg>
\ No newline at end of file

From 0279462877806c989a07d99ab24b3357148de3b2 Mon Sep 17 00:00:00 2001
From: simon bailly <simon.bailly5@gmail.com>
Date: Tue, 22 Oct 2024 15:50:41 +0400
Subject: [PATCH 3/3] Remove future data Jura

---
 src/components/AppHeader.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/AppHeader.vue b/src/components/AppHeader.vue
index 1b9611c..188e19b 100644
--- a/src/components/AppHeader.vue
+++ b/src/components/AppHeader.vue
@@ -88,7 +88,6 @@ onMounted(async () => {
             </a>
             <ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
               <li class="nav-item"><button class="dropdown-item inter-maps" @click="goToMaps()">Réunion</button></li>
-              <li class="nav-item"><button class="dropdown-item inter-maps" @click="goToMaps()">Jura</button></li>
             </ul>
           </li>