feat(windkarte): InfoAccordion, anlagen-Hinweis, Tooltip ohne Icons
- 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:
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user