feat: startIcon.js triangle svg

components/StartIcon.js

@@ -1,12 +1,16 @@
-// Custom circle icon for draggable markers
 // Custom triangle icon for draggable markers
 import L from "leaflet";
 
 const startIcon = L.divIcon({
   className: "custom-start-icon",
-  html: "<div style='width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 14px solid gray;'></div>", // Graues Dreieck
-  iconSize: [10, 10],
-  iconAnchor: [8, 8],
+  html: `
+    <svg width="18" height="18" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+      <polygon points="10,2 18,18 2,18" fill="black" />
+      <polygon points="10,5 16,16 4,16" fill="gray" />
+    </svg>
+  `, // Schwarzes Dreieck innerhalb eines grauen Dreiecks
+  iconSize: [18, 18],
+  iconAnchor: [9, 18],
 });
 
 export default startIcon;