feat: improve map zoom controls

This commit is contained in:
2026-07-21 12:28:07 +01:00
parent 5851517a6b
commit f76b553fc4
2 changed files with 97 additions and 0 deletions
+53
View File
@@ -312,6 +312,54 @@ button:disabled {
top: 16px;
right: 16px;
left: auto;
overflow: hidden;
background: var(--panel);
border: 1px solid var(--panel-border);
border-radius: 14px;
backdrop-filter: blur(16px);
box-shadow: var(--shadow);
}
.map-wrap .ol-zoom button,
.map-wrap .ol-visible-layers-extent button {
width: 2.0625em;
height: 2.0625em;
margin: 0;
background: linear-gradient(135deg, var(--accent) 0%, #2b9a79 100%);
color: #fffefb;
font-size: 1rem;
line-height: 1;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.24);
}
.map-wrap .ol-zoom button + button {
border-top: 1px solid rgba(255, 255, 255, 0.35);
}
.map-wrap .ol-zoom button:hover,
.map-wrap .ol-zoom button:focus,
.map-wrap .ol-visible-layers-extent button:hover,
.map-wrap .ol-visible-layers-extent button:focus {
background: linear-gradient(135deg, var(--accent-strong) 0%, var(--accent) 100%);
color: #fff;
outline: 2px solid rgba(31, 122, 98, 0.35);
outline-offset: -2px;
}
.map-wrap .ol-visible-layers-extent {
top: 96px;
right: 16px;
left: auto;
overflow: hidden;
background: var(--panel);
border: 1px solid var(--panel-border);
border-radius: 14px;
backdrop-filter: blur(16px);
box-shadow: var(--shadow);
}
.map-wrap .ol-visible-layers-extent button {
font-size: 1.3rem;
}
/* OpenLayers hides this control while the view is north-up. */
@@ -364,6 +412,11 @@ button:disabled {
right: 12px;
}
.map-wrap .ol-visible-layers-extent {
top: 92px;
right: 12px;
}
.map-wrap .ol-rotate {
right: 12px;
bottom: 12px;