Rahmen bleiben rot wenn man Feld ausgefüllt hat

src/components/Ausweis/ButtonWeiterHilfe.svelte

@@ -52,6 +52,11 @@
 			if (!value && element.required) {
 				element.setCustomValidity("Eine Auswahl ist verpflichtend.")
 				element.dataset["isinvalid"] = "true"
+				
+				element.addEventListener("change", () => {
+					element.setCustomValidity("")
+					element.dataset["isinvalid"] = "false"
+				})
 			} else {
 				element.setCustomValidity("")
 			}

src/components/Ausweis/GebaeudeDaten.svelte

@@ -1,9 +1,8 @@
 <script lang="ts">
 	import HelpLabel from "#components/labels/HelpLabel.svelte";
 	import Inputlabel from "#components/labels/InputLabel.svelte";
+	import PlzSuche from "#components/PlzSuche.svelte";
 
-	
-	import ZipSearch from "#components/PlzSuche.svelte";
 	import { Enums } from "#lib/client/prisma.js";
 	import { AufnahmeClient, ObjektClient } from "./types.js";
 
@@ -27,6 +26,8 @@
 			event.preventDefault();
 		}
 	}
+
+	let ortInput: HTMLInputElement;
 </script>
 
 <div
@@ -69,9 +70,12 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 		<div class="input-noHelp">
 			<Inputlabel title="PLZ *"></Inputlabel>
 
-			<ZipSearch
+			<PlzSuche
 				bind:zip={objekt.plz}
 				bind:city={objekt.ort}
+				onchange={(e) => {
+					ortInput.dispatchEvent(new Event('change'));
+				}}
 				name="plz"
 			/>
 		</div>
@@ -85,6 +89,7 @@ xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
 				readonly={false}
 				required
 				bind:value={objekt.ort}
+				bind:this={ortInput}
 				type="text"
 			/>
 

src/components/Dashboard/DashboardAusweis.svelte

@@ -746,6 +746,7 @@
 	<div class="card-body">
 		<div class="flex flex-col flex-wrap items-left gap-2">
 			
+			{#if aufnahme.bilder.length > 0}
 				<h3 class="font-semibold text-lg">Bilder</h3>
 				<div class="grid grid-cols-[1fr] md:grid-cols-[1fr,1fr,1fr] lg:grid-cols-[1fr,1fr,1fr] justify-start items-center gap-2">
 					{#each aufnahme.bilder as bild, i (i)}
@@ -753,6 +754,8 @@
 					{/each}
 				</div>
 				<hr>
+			{/if}
+			{#if aufnahme.unterlagen.length > 0}
 				<h3 class="font-semibold text-lg">Unterlagen</h3>
 				<div class="text-sm">
 					{#if aufnahme.unterlagen.length > 0}
@@ -761,9 +764,11 @@
 						{/each}
 					{/if}
 				</div>
+			{/if}
 		</div>
 
-		<div class="dropdown dropdown-top items-end absolute bottom-4 right-4 z-50">
+		<!-- Benachrichtigungen -->
+		<!-- <div class="dropdown dropdown-top items-end absolute bottom-4 right-4 z-50">
 			<div class="indicator">
 				{#if Object.keys($notifications).length > 0}
 					<span class="indicator-item badge badge-accent text-xs"
@@ -782,7 +787,7 @@
 			>
 				<NotificationProvider component={DashboardNotification} />
 			</ul>
-		</div>
+		</div> -->
 
 	</div>
 </div>

src/components/PlzSuche.svelte

@@ -5,7 +5,7 @@
 	export let readonly: boolean = false;
 	export let city: string | null | undefined;
 	export let zip: string | null = "";
-
+	export let onchange: (event: Event) => void;
 
 	let hideZipDropdown: boolean = true;
 	let zipCodes: inferOutput<API["postleitzahlen"]["GET"]> = [];
@@ -58,6 +58,7 @@
 		{...$$restProps}
 		bind:value={zip}
 		on:input={fetchZipCodeInformation}
+		on:change={onchange}
 		on:focus={() => {
 			if (zipCodes.length > 0) {
 				hideZipDropdown = false

src/lib/Klimafaktoren.ts

@@ -3,7 +3,7 @@ import { memoize } from "./Memoization.js";
 import { api } from "astro-typesafe-api/client"
 
 export const getKlimafaktoren = memoize(async (date: Date, plz: string) => {
-	if (!plz || !date) {
+	if (!plz || plz.length < 5 || !date) {
 		return null;
 	}