Client - display static map and no map placeholder with dark mode
This commit is contained in:
parent
816296c976
commit
910531e6bd
@ -51,6 +51,12 @@
|
||||
width: 400px;
|
||||
height: 225px;
|
||||
z-index: 100;
|
||||
filter: var(--map-display-hover-filter);
|
||||
|
||||
.map-attribution-text {
|
||||
color: var(--map-display-hover-attribution-text);
|
||||
background-color: var(--map-attribution-bg-color);
|
||||
}
|
||||
}
|
||||
|
||||
.bg-map-image {
|
||||
@ -59,6 +65,7 @@
|
||||
opacity: 0.6;
|
||||
height: 200px;
|
||||
width: 100%;
|
||||
filter: var(--map-filter);
|
||||
}
|
||||
|
||||
.map-attribution {
|
||||
@ -69,7 +76,8 @@
|
||||
}
|
||||
|
||||
.map-attribution-text {
|
||||
background-color: var(--map-attribution-text);
|
||||
color: var(--map-attribution-text);
|
||||
background-color: var(--map-attribution-bg-color);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -238,6 +238,7 @@
|
||||
height: 150px;
|
||||
.no-map {
|
||||
line-height: 150px;
|
||||
filter: var(--no-map-filter);
|
||||
}
|
||||
::v-deep(.bg-map-image) {
|
||||
height: 150px;
|
||||
|
@ -213,6 +213,7 @@
|
||||
}
|
||||
.no-map {
|
||||
line-height: 400px;
|
||||
filter: var(--no-map-filter);
|
||||
}
|
||||
.leaflet-container {
|
||||
.map {
|
||||
|
@ -354,7 +354,7 @@
|
||||
}
|
||||
.static-map {
|
||||
display: none;
|
||||
box-shadow: 3px 3px 3px 1px var(--app-shadow-color);
|
||||
box-shadow: 3px 3px 3px 1px var(--workout-static-map-shadow-color);
|
||||
}
|
||||
}
|
||||
.workout-title:hover .static-map {
|
||||
|
@ -84,10 +84,15 @@
|
||||
--map-control-color: #000000;
|
||||
--map-control-bg-color: #ffffff;
|
||||
--map-control-border-color: #bfc0ab;
|
||||
--map-attribution-text: rgba(255, 255, 255, 0.7);
|
||||
--map-attribution-text: #e8e8e8;
|
||||
--map-display-hover-attribution-text: #444444;
|
||||
--map-attribution-bg-color: none;
|
||||
--map-filter: invert(1) hue-rotate(180deg) brightness(0.8) contrast(0.8);
|
||||
--map-display-hover-filter: invert(1) hue-rotate(180deg) brightness(1.5) contrast(0.6);
|
||||
--map-layers-overlays: var(--app-color);
|
||||
--map-control-bar: var(--app-color);
|
||||
--no-map-filter: invert(1) brightness(1.5) contrast(.9);
|
||||
--workout-static-map-shadow-color: #d2d2d2;
|
||||
|
||||
--mountains-filter: invert(90%) sepia(19%) saturate(0%) hue-rotate(39deg)
|
||||
brightness(86%) contrast(102%);
|
||||
|
@ -81,10 +81,15 @@
|
||||
--map-control-color: #000000;
|
||||
--map-control-bg-color: #ffffff;
|
||||
--map-control-border-color: #bfc0ab;
|
||||
--map-attribution-text: rgba(255, 255, 255, 0.7);
|
||||
--map-attribution-text: var(--app-color);
|
||||
--map-display-hover-attribution-text: initial;
|
||||
--map-attribution-bg-color: rgba(255, 255, 255, 0.7);
|
||||
--map-filter: initial;
|
||||
--map-display-hover-filter: initial;
|
||||
--map-layers-overlays: initial;
|
||||
--map-control-bar: #bfc0ab;
|
||||
--no-map-filter: initial;
|
||||
--workout-static-map-shadow-color: var(--app-shadow-color);
|
||||
|
||||
--mountains-filter: invert(19%) sepia(9%) saturate(2921%) hue-rotate(169deg)
|
||||
brightness(85%) contrast(80%);
|
||||
|
Loading…
Reference in New Issue
Block a user