Compare commits

...

2 Commits

Author SHA1 Message Date
Peter Meier 0b6174eb53 chore: update iconify subset (map-outline swap)
Deploy / verify (push) Successful in 51s
Deploy / deploy (push) Successful in 59s
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-13 15:31:42 +02:00
Peter Meier b4581e4d4f feat(windkarte): tap-to-activate overlay for mobile scroll fix
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-13 15:31:23 +02:00
3 changed files with 57 additions and 2 deletions
@@ -23,6 +23,7 @@ let areas = $state<WindArea[]>([]);
let resetMap: (() => void) | null = null;
let hiddenStatuses = $state<string[]>([]);
let hiddenRings = $state<string[]>(["2km", "5km"]);
let mapActive = $state(false);
function toggleStatus(status: string) {
hiddenStatuses = hiddenStatuses.includes(status)
@@ -131,6 +132,24 @@ let areas = $state<WindArea[]>([]);
</div>
{/if}
<!-- Mobile tap-to-activate overlay (touch devices only) -->
{#if !mapActive}
<button
type="button"
onclick={() => { mapActive = true; }}
class="map-activate-overlay"
aria-label={t(T.windkarte_tap_to_activate)}
>
<span class="map-activate-label">
<svg class="size-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M9 11l3 3L22 4"/>
<path d="M21 12v7a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h11"/>
</svg>
{t(T.windkarte_tap_to_activate)}
</span>
</button>
{/if}
<!-- Panel: bottom-sheet on mobile, side-panel on sm+ -->
<div class="panel-slide {selectedArea ? 'open' : ''}" style="pointer-events: none; z-index: 1001;">
<WindAreaPanel
@@ -217,6 +236,38 @@ let areas = $state<WindArea[]>([]);
}
}
/* Touch-only overlay — hidden on hover-capable devices (desktop/mouse) */
.map-activate-overlay {
display: none;
}
@media (hover: none) {
.map-activate-overlay {
display: flex;
position: absolute;
inset: 0;
z-index: 490;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.25);
cursor: pointer;
border: none;
padding: 0;
}
}
.map-activate-label {
display: flex;
align-items: center;
gap: 0.5rem;
background: rgba(255, 255, 255, 0.92);
border-radius: 0.5rem;
box-shadow: 0 2px 8px rgba(0,0,0,0.18);
color: #333735;
font-size: 0.875rem;
font-weight: 500;
padding: 0.625rem 1rem;
pointer-events: none;
}
.dashed-line {
display: inline-block;
width: 18px;
+5 -2
View File
@@ -69,8 +69,8 @@
"file-document-edit-outline": {
"body": "<path fill=\"currentColor\" d=\"M8 12h8v2H8zm2 8H6V4h7v5h5v3.1l2-2V8l-6-6H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h4zm-2-2h4.1l.9-.9V16H8zm12.2-5c.1 0 .3.1.4.2l1.3 1.3c.2.2.2.6 0 .8l-1 1l-2.1-2.1l1-1c.1-.1.2-.2.4-.2m0 3.9L14.1 23H12v-2.1l6.1-6.1z\"/>"
},
"file-document-outline": {
"body": "<path fill=\"currentColor\" d=\"M6 2a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm0 2h7v5h5v11H6zm2 8v2h8v-2zm0 4v2h5v-2z\"/>"
"map-outline": {
"body": "<path fill=\"currentColor\" d=\"m20.5 3l-.16.03L15 5.1L9 3L3.36 4.9c-.21.07-.36.25-.36.48V20.5a.5.5 0 0 0 .5.5l.16-.03L9 18.9l6 2.1l5.64-1.9c.21-.07.36-.25.36-.48V3.5a.5.5 0 0 0-.5-.5M10 5.47l4 1.4v11.66l-4-1.4zm-5 .99l3-1.01v11.7l-3 1.16zm14 11.08l-3 1.01V6.86l3-1.16z\"/>"
},
"map-marker-outline": {
"body": "<path fill=\"currentColor\" d=\"M12 6.5A2.5 2.5 0 0 1 14.5 9a2.5 2.5 0 0 1-2.5 2.5A2.5 2.5 0 0 1 9.5 9A2.5 2.5 0 0 1 12 6.5M12 2a7 7 0 0 1 7 7c0 5.25-7 13-7 13S5 14.25 5 9a7 7 0 0 1 7-7m0 2a5 5 0 0 0-5 5c0 1 0 3 5 9.71C17 12 17 10 17 9a5 5 0 0 0-5-5\"/>"
@@ -132,6 +132,9 @@
"home-outline": {
"body": "<path fill=\"currentColor\" d=\"m12 5.69l5 4.5V18h-2v-6H9v6H7v-7.81zM12 3L2 12h3v8h6v-6h2v6h6v-8h3\"/>"
},
"file-document-outline": {
"body": "<path fill=\"currentColor\" d=\"M6 2a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zm0 2h7v5h5v11H6zm2 8v2h8v-2zm0 4v2h5v-2z\"/>"
},
"share-variant-outline": {
"body": "<path fill=\"currentColor\" d=\"M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7s-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81c1.66 0 3-1.34 3-3s-1.34-3-3-3s-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.15c-.05.21-.08.43-.08.66c0 1.61 1.31 2.91 2.92 2.91s2.92-1.3 2.92-2.91s-1.31-2.92-2.92-2.92M18 4c.55 0 1 .45 1 1s-.45 1-1 1s-1-.45-1-1s.45-1 1-1M6 13c-.55 0-1-.45-1-1s.45-1 1-1s1 .45 1 1s-.45 1-1 1m12 7c-.55 0-1-.45-1-1s.45-1 1-1s1 .45 1 1s-.45 1-1 1\"/>"
},
+1
View File
@@ -198,6 +198,7 @@ const TRANSLATION_KEYS = [
"post_action_reading_time",
// Windkarte (WindkarteBlock / WindAreaPanel).
"windkarte_loading",
"windkarte_tap_to_activate",
"windkarte_panel_close",
"windkarte_reset_aria",
"windkarte_status_rechtskraeftig",