misc: mark current location using HTML/CSS instead of SVG (#22602)

wcs/qommon/static/css/qommon.css

@@ -614,3 +614,17 @@ div.file-field img {
 	max-height: 25vh;
 	display: block;
 }
+
+div.location-icon {
+	box-sizing: border-box;
+	pointer-events: none;
+	width: 10px;
+	height: 10px;
+	border-radius: 100%;
+	position: relative;
+	top: -5px;
+	left: -5px;
+	background: red;
+	border: 1px solid #800;
+	z-index: -100 !important;
+}

wcs/qommon/static/js/leaflet-gps.js

@@ -11,6 +11,18 @@
   factory(window.L);
 })(function (L) {
 
+L.LocationIcon = L.Icon.extend({
+	createIcon: function () {
+		var div = document.createElement('div');
+		div.className = 'location-icon';
+		return div;
+	},
+
+	createShadow: function () {
+		return null;
+	}
+});
+
 L.Control.Gps = L.Control.extend({
 	includes: L.Mixin.Events,
 	options: {
@@ -48,7 +60,8 @@ L.Control.Gps = L.Control.extend({
 			.on(this._button, 'click', L.DomEvent.stop, this)
 			.on(this._button, 'click', this._askGps, this);
 
-		this._gpsMarker = new L.CircleMarker([0,0], this.options.style);
+		var locationIcon = new L.LocationIcon();
+		this._gpsMarker = new L.Marker([0,0], {icon: locationIcon});
 
 		this._map
 			.on('locationfound', this._drawGps, this)