Template für Box mit Bulletpoints erstellt (z.B. für "Folgende Punkte ändern sich")

src/components/design/content/TextboxCardTemplate.svelte

@@ -0,0 +1,47 @@
+
+<script lang="ts">
+	export let TitelName: string;
+	export let BulletPoints: [string, boolean][];
+</script>
+
+<div class="border rounded-xl">
+	<div class="flex flex-row w-full bg-secondary rounded-t-3xl pl-5 pt-1 pb-1">
+			<h3 class="text-white">{TitelName}</h3>
+	</div>
+
+	<div class="bg-white">
+		<div class="white">
+			{#each BulletPoints as [point]}
+			<div class="services">
+				<ul class="custom-list pl-6 space-y-2"><li>{point}</li></ul>
+			</div>
+			{/each}
+		</div>
+	</div>
+</div>
+
+<style lang="scss">
+	.white {
+		@apply text-center text-black p-6;
+	}
+
+	.services {
+		@apply text-start py-2;
+	}
+	.services:not(:last-child) {
+		@apply border-b-[0px] border-gray-300;
+	}
+
+	.custom-list {
+  @apply list-none pl-6; /* Entfernt Standardpunkte */
+
+  li {
+    @apply relative text-gray-700 text-lg list-none; /* Entfernt Standardpunkte */
+
+    &::before {
+      @apply absolute left-[-1.5rem] top-[0.4rem] w-3 h-3 bg-primary content-[""];
+      /* Quadrat mit `w-2`, `h-2`, orange Hintergrund */
+    }
+  }
+}
+</style>