3
0

Adjust CMAP styling for themes

This commit is contained in:
Jože Fortun
2024-01-24 14:19:44 +01:00
committed by Mumbi Francis
parent e62c4a6600
commit cc99327618
2 changed files with 22 additions and 15 deletions
+22 -13
View File
@@ -1,5 +1,5 @@
<template>
<div
<div
class="position-relative"
>
<div
@@ -47,14 +47,14 @@
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
:attribution="mapOptions.attribution"
/>
<l-polygon
v-for="(geometry, i) in polygons"
:key="`polygon-${i}`"
:lat-lngs="geometry.map(value => value.geometry)"
:color="geometry[0].color"
/>
<l-marker
v-for="(marker, i) in markerValues"
:key="`marker-${i}`"
@@ -76,7 +76,7 @@
/>
</l-tooltip>
</l-marker>
<l-control class="leaflet-bar">
<a
v-if="!hideCurrentLocationButton"
@@ -119,17 +119,17 @@ export default {
type: Boolean,
default: false
},
labels: {
type: Object,
default: () => ({})
},
map: {
type: Object,
default: () => ({})
},
markers: {
type: Array,
default: () => ([])
@@ -150,7 +150,7 @@ export default {
default: false
}
},
data () {
return {
geoSearch: {
@@ -300,17 +300,26 @@ export default {
}
.leaflet-bar a {
background-color: var(--primary);
color: var(--white);
background-color: var(--white) !important;
color: var(--primary) !important;
text-decoration: none !important;
&:hover {
background-color: var(--primary-dark);
background-color: var(--white) !important;
transition: background-color 0.15s ease;
}
}
[data-color-mode="dark"] .leaflet-bar a {
color: var(--black);
.geosearch-result {
&:hover {
background-color: var(--light) !important;
color: var(--black);
}
&:active {
color: var(--white) !important;
background-color: var(--primary) !important;
}
}
</style>
@@ -38,8 +38,6 @@ $gray-700: if(lightness($black) < lightness($white), mix($black, $white, 70%), m
$gray-800: if(lightness($black) < lightness($white), mix($black, $white, 80%), mix($white, $black, 80%));
$gray-900: if(lightness($black) < lightness($white), mix($black, $white, 90%), mix($white, $black, 90%));
$primary-dark: darken($primary, 7.5%) !default;
$yiq-contrasted-threshold: 45; // Our magic number, we can pretend its 42..
$yiq-text-dark: $black !default;
$yiq-text-light: $white !default;