diff --git a/ios/App/App/Info.plist b/ios/App/App/Info.plist
index db93ea47..73624b3a 100644
--- a/ios/App/App/Info.plist
+++ b/ios/App/App/Info.plist
@@ -45,5 +45,7 @@
 	</array>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
 	<true/>
+    <key>NSLocationWhenInUseUsageDescription</key>
+    <string>Votre position est nécessaire pour vous positionner sur la carte et calculer des itinéraires et isochrones à partir de votre position</string>
 </dict>
 </plist>
diff --git a/ios/App/Podfile.lock b/ios/App/Podfile.lock
new file mode 100644
index 00000000..8f749d47
--- /dev/null
+++ b/ios/App/Podfile.lock
@@ -0,0 +1,46 @@
+PODS:
+  - Capacitor (5.2.2):
+    - CapacitorCordova
+  - CapacitorApp (5.0.6):
+    - Capacitor
+  - CapacitorCordova (5.2.2)
+  - CapacitorGeolocation (5.0.6):
+    - Capacitor
+  - CapacitorStatusBar (5.0.6):
+    - Capacitor
+  - CapacitorToast (5.0.6):
+    - Capacitor
+
+DEPENDENCIES:
+  - "Capacitor (from `../../node_modules/@capacitor/ios`)"
+  - "CapacitorApp (from `../../node_modules/@capacitor/app`)"
+  - "CapacitorCordova (from `../../node_modules/@capacitor/ios`)"
+  - "CapacitorGeolocation (from `../../node_modules/@capacitor/geolocation`)"
+  - "CapacitorStatusBar (from `../../node_modules/@capacitor/status-bar`)"
+  - "CapacitorToast (from `../../node_modules/@capacitor/toast`)"
+
+EXTERNAL SOURCES:
+  Capacitor:
+    :path: "../../node_modules/@capacitor/ios"
+  CapacitorApp:
+    :path: "../../node_modules/@capacitor/app"
+  CapacitorCordova:
+    :path: "../../node_modules/@capacitor/ios"
+  CapacitorGeolocation:
+    :path: "../../node_modules/@capacitor/geolocation"
+  CapacitorStatusBar:
+    :path: "../../node_modules/@capacitor/status-bar"
+  CapacitorToast:
+    :path: "../../node_modules/@capacitor/toast"
+
+SPEC CHECKSUMS:
+  Capacitor: 070b18988e0f566728ae9a5eb3a7a974595f1626
+  CapacitorApp: 963d90cb449803d58efc33bb515c81151e69159d
+  CapacitorCordova: 3773395d5331add072300ff6041ca2cf7b93cb0b
+  CapacitorGeolocation: c8f9b46f96e0b6cc80a6c7ff48a37cfc44ad2198
+  CapacitorStatusBar: a73a9ae0dd2ca30ee429782d5d3ae82dcfa80207
+  CapacitorToast: 61a9bec819ad3aeccc1ebe3fcbff565c22969c71
+
+PODFILE CHECKSUM: 1f1188b35f849cc64d1d49736ae417a835c88123
+
+COCOAPODS: 1.14.3
diff --git a/package.json b/package.json
index b306ec94..d9fcc86f 100644
--- a/package.json
+++ b/package.json
@@ -32,8 +32,11 @@
     "maplibre-gl": "^3.3.1"
   },
   "devDependencies": {
+    "@babel/core": "^7.23.5",
+    "@babel/preset-env": "^7.23.5",
     "@capacitor/assets": "^2.0.4",
     "@capacitor/cli": "5.2.2",
+    "babel-loader": "^9.1.3",
     "css-loader": "^6.8.1",
     "css-minimizer-webpack-plugin": "^5.0.1",
     "dotenv-webpack": "^8.0.1",
@@ -43,7 +46,7 @@
     "sass": "^1.66.1",
     "sass-loader": "^13.3.2",
     "sortablejs": "^1.15.0",
-    "webpack": "5.88.2",
+    "webpack": "^5.88.2",
     "webpack-cli": "5.1.4",
     "webpack-dev-server": "4.15.1"
   }
diff --git a/src/css/index.css b/src/css/index.css
index 9cf5f2d0..7c3626ba 100644
--- a/src/css/index.css
+++ b/src/css/index.css
@@ -190,7 +190,7 @@ h3 {
 input[type="range"] {
   -webkit-appearance: none;
   appearance: none;
-  background: transparent;
+  background: #f4f6f8;
   cursor: pointer;
   width: 130px;
   overflow: hidden;
@@ -228,6 +228,7 @@ input[type="range"]::-webkit-slider-thumb {
   width: 16px;
   border: #3F4A55 6px solid;
   box-sizing: border-box;
+  box-shadow: unset;
 }
 
 /*********** Firefox styles ***********/
diff --git a/src/css/layer-catalogue.css b/src/css/layer-catalogue.css
index 23063ccc..c02125ed 100644
--- a/src/css/layer-catalogue.css
+++ b/src/css/layer-catalogue.css
@@ -146,7 +146,7 @@
   right: 0;
   width: 20px;
   height: 100%;
-  background: linear-gradient(90deg,transparent,#fff);
+  background: linear-gradient(90deg,#fff0,#f4f6f8 );
   opacity: 1;
   visibility: visible;
   flex-shrink: 0;
diff --git a/src/css/map.css b/src/css/map.css
index 18311455..7a14894b 100644
--- a/src/css/map.css
+++ b/src/css/map.css
@@ -17,7 +17,7 @@
   height: 20px;
   display: flex;
   flex-direction: column;
-  justify-content: end;
+  justify-content: flex-end;
 }
 
 .maplibregl-ctrl-scale {
diff --git a/src/css/my-position.css b/src/css/my-position.css
index 7f676707..22cd4688 100644
--- a/src/css/my-position.css
+++ b/src/css/my-position.css
@@ -84,7 +84,7 @@
   right: 0;
   width: 20px;
   height: 45px;
-  background: linear-gradient(90deg,transparent,#fff);
+  background: linear-gradient(90deg,#f4f6f8,#fff);
   opacity: 1;
   visibility: visible;
   flex-shrink: 0;
diff --git a/src/css/nav.css b/src/css/nav.css
index ced02a11..e7acf291 100644
--- a/src/css/nav.css
+++ b/src/css/nav.css
@@ -26,7 +26,7 @@
     margin: 0;
     flex-direction: column;
     align-items: center;
-    height: 60px;
+    height: 64px;
     justify-content: center;
 }
 
@@ -82,7 +82,6 @@
     transition: transform 0.2s;
     transition-timing-function: ease-out;
     width: 97%;
-    height: fit-content;
     color: #3f4a55;
     padding: 0px 24px 30px 24px;
     align-items: center;
diff --git a/src/css/search.css b/src/css/search.css
index c5650fde..61994f02 100644
--- a/src/css/search.css
+++ b/src/css/search.css
@@ -27,7 +27,7 @@
   right: 33px;
   width: 20px;
   height: 32px;
-  background: linear-gradient(90deg, transparent, #fff);
+  background: linear-gradient(90deg, #fff0, #fff);
   opacity: 1;
   visibility: visible;
 }
diff --git a/webpack.dev.js b/webpack.dev.js
index 4cf9ae11..9ad62038 100644
--- a/webpack.dev.js
+++ b/webpack.dev.js
@@ -28,6 +28,19 @@ module.exports = {
   ],
   module: {
     rules: [
+      {
+        test: /\.(?:js|mjs|cjs)$/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            presets: [
+              ['@babel/preset-env', { targets: { 
+                "ios": "13"
+              }}]
+            ]
+          }
+        }
+      },
       {
         test: /\.(scss|css)$/,
         use: [
diff --git a/webpack.prod.js b/webpack.prod.js
index 26096193..4e4721ea 100644
--- a/webpack.prod.js
+++ b/webpack.prod.js
@@ -23,6 +23,19 @@ module.exports = {
   ],
   module: {
     rules: [
+      {
+        test: /\.(?:js|mjs|cjs)$/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            presets: [
+              ['@babel/preset-env', { targets: { 
+                "ios": "13"
+              }}]
+            ]
+          }
+        }
+      },
       {
         test: /\.(scss|css)$/,
         use: [