feat(windkarte): InfoAccordion, anlagen-Hinweis, Tooltip ohne Icons
Deploy / verify (push) Successful in 1m6s
Deploy / deploy (push) Successful in 1m18s

- Disclaimer aus CMS-Feld (hinweis_text) via InfoAccordion statt Hardcode
- info_text-Feld für Block-Fließtext ergänzt
- anlagen_geplant_hinweis-Feld in WindArea + Panel-Anzeige
- Tooltip-Icons entfernt (square-outline/wind-turbine/map-marker inline SVGs)
- Panel: square-outline → ruler-square für Fläche
- Iconify-Subset neu generiert

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Peter Meier
2026-06-11 12:35:29 +02:00
parent 1c63f68c0b
commit 41597f87b5
9 changed files with 146 additions and 33 deletions
+35 -3
View File
@@ -3,6 +3,7 @@
import "$lib/iconify-offline";
import type { WindArea, TextFragment } from "$lib/windkarte";
import { useTranslate, T } from "$lib/translations";
import InfoAccordion from "$lib/components/InfoAccordion.svelte";
let {
area,
@@ -119,22 +120,53 @@
<div class="flex flex-col divide-y divide-stein-100 border border-stein-100 rounded-lg overflow-hidden text-sm">
{#if area.flaeche_ha != null}
<div class="flex items-center justify-between px-3 py-1.5">
<span class="text-xs text-stein-500">{t(T.windkarte_label_flaeche)}</span>
<span class="flex items-center gap-1.5 text-xs text-stein-500">
<Icon icon="mdi:ruler-square" class="size-3.5 text-stein-400" />
{t(T.windkarte_label_flaeche)}
</span>
<span class="font-semibold text-stein-800">{area.flaeche_ha.toFixed(1)} ha</span>
</div>
{/if}
{#if area.anlagen_geplant != null}
<div class="flex items-center justify-between px-3 py-1.5">
<span class="flex items-center gap-1.5 text-xs text-stein-500">
<Icon icon="mdi:wind-turbine" class="size-3.5 text-stein-400" />
{t(T.windkarte_label_anlagen_geplant)}
</span>
<span class="flex items-center gap-1.5 font-semibold text-stein-800">
{area.anlagen_geplant}
{#if area.anlagen_geplant_hinweis}
<Icon icon="mdi:information-outline" class="size-3.5 text-amber-700" />
{/if}
</span>
</div>
{/if}
{#if area.investor}
<div class="flex items-center justify-between px-3 py-1.5">
<span class="text-xs text-stein-500">{t(T.windkarte_label_investor)}</span>
<span class="flex items-center gap-1.5 text-xs text-stein-500">
<Icon icon="mdi:domain" class="size-3.5 text-stein-400" />
{t(T.windkarte_label_investor)}
</span>
<span class="font-semibold text-stein-800">{area.investor}</span>
</div>
{/if}
</div>
{#if area.anlagen_geplant_hinweis}
<InfoAccordion
title={t(T.windkarte_label_anlagen_hinweis)}
body={area.anlagen_geplant_hinweis}
variant="amber"
/>
{/if}
<!-- Gemeinden -->
{#if area.gemeinden && area.gemeinden.length > 0}
<div>
<p class="mb-2 text-xs font-medium uppercase tracking-wide text-stein-500">{t(T.windkarte_label_gemeinden)}</p>
<p class="mb-2 flex items-center gap-1.5 text-xs font-medium uppercase tracking-wide text-stein-500">
<Icon icon="mdi:map-marker" class="size-3.5 text-stein-400" />
{t(T.windkarte_label_gemeinden)}
</p>
<div class="flex flex-wrap gap-1.5">
{#each area.gemeinden as g}
<span class="rounded-full bg-himmel-100 px-2.5 py-0.5 text-xs font-medium text-himmel-800">{g}</span>