Auto stash before merge of "UMBE" and "origin/UMBE"

Umbe update

src/components/Ausweis/Warmwasseranteil.svelte

@@ -0,0 +1,57 @@
+<script lang="ts">
+
+    import HelpLabel from "#labels/HelpLabel.svelte";
+    import Inputlabel from "#labels/InputLabel.svelte";
+    
+    export let ausweis: VerbrauchsausweisWohnenClient;
+
+</script>
+
+<div id="B" class="bereich-box grid 
+	grid-cols-1 gap-x-4 gap-y-8
+	sm:grid-cols-2 sm:gap-x-6 sm:gap-y-8
+	xl:grid-cols-3 xl:gap-x-8 xl:gap-y-8
+	">
+
+
+	<div class="input-standard order-1 md:order-1 xl:order-1">
+		<Inputlabel title="Warmwasser im Verbrauch enthalten"></Inputlabel>
+
+<div class="ring-1 ring-gray-500/50 h-[38px] grid grid-cols-[80px_1fr] items-center py-[6px] px-[10px]">
+	
+<div class="grid grid-cols-[20px_40px] items-center">
+	<label for="warmwasser_enthalten">Ja</label>
+	<input
+	type="checkbox"
+	class="checkbox"
+	name="warmwasser_enthalten"
+	data-test="warmwasser_enthalten"
+	bind:checked={ausweis.warmwasser_enthalten}
+	/>
+</div>
+
+<div class="grid grid-cols-[100px_40px] items-center">
+	<label for="warmwasser_anteil_bekannt">Anteil bekannt</label>
+	<input
+	type="checkbox"
+	class="checkbox"
+	name="warmwasser_anteil_bekannt"
+	data-test="warmwasser_anteil_bekannt"
+	bind:checked={ausweis.warmwasser_anteil_bekannt}
+	disabled={!ausweis.warmwasser_enthalten}
+/>
+</div>
+
+
+</div>
+
+<div class="help-label">
+	<HelpLabel>
+		Bitte geben Sie hier die Straße und Hausnummer des Gebäudes ein.
+	</HelpLabel>
+</div>
+
+
+</div>
+</div>
+

src/components/design/content/ProduktVergleich.svelte

@@ -4,7 +4,7 @@
 
 <div class="mt-12 m-auto w-[90%] relative">
 
-<div id="saeulen">
+<div id="produktvergleich">
 
     <div class="saeule">
         <div class="blue-top">
@@ -78,7 +78,7 @@
 
 
 
-#saeulen{@apply 
+#produktvergleich{@apply 
     grid grid-cols-[1fr] gap-y-3 gap-x-6
     lg:grid-cols-2
     xl:grid-cols-2;

src/components/design/sidebars/cards/cardPriceiInfo.svelte

@@ -2,31 +2,42 @@
 	import { PRICES } from "#lib/constants";
 </script>
 
-<div 	id ="cardPreisinfo" class="box card hidden lg:block">
+<div id ="cardPriceinfo" class="box card hidden lg:block">
 			
 <h2>Was wird der Energieausweis kosten?</h2>
-<hr class="mb-4 bg-primary h-[2px]">
-<p>Verbrauchsausweis Wohngebäude</p>
-<p>ab&nbsp;{PRICES.VerbrauchsausweisWohnen[0]}€&nbsp;inkl.&nbsp;MwSt.</p>
-<hr>
-<p>Bedarfsausweis Wohngebäude</p>
-<p>ab&nbsp;{PRICES.BedarfsausweisWohnen[0]}€&nbsp;inkl.&nbsp;MwSt.</p>
-<hr>
-<p>Verbrauchsausweis Gewerbe</p>
-<p>ab&nbsp;{PRICES.VerbrauchsausweisGewerbe[0]}€&nbsp;inkl.&nbsp;MwSt.</p>
-<hr>
-<p>Bedarfsausweis Gewerbe</p>
-<p>ab&nbsp;300€&nbsp;inkl.&nbsp;MwSt.</p>
-<hr>
-<p>GEG-Nachweis Wohngebäude</p>
-<p>ab&nbsp;400€&nbsp;inkl.&nbsp;MwSt.</p>
-<hr>
-<p>GEG-Nachweis Gewerbe</p>
-<p>ab&nbsp;450€ inkl.&nbsp;MwSt.</p>
+
+<hr class="trenner-h">
+<div>Verbrauchsausweis Wohngebäude</div>
+<div>ab&nbsp;<span class="price">{PRICES.VerbrauchsausweisWohnen[0]}€</span>&nbsp;inkl.&nbsp;MwSt.</div>
+
+<hr class="trenner">
+<div>Bedarfsausweis Wohngebäude</div>
+<div>ab&nbsp;<span class="price">{PRICES.BedarfsausweisWohnen[0]}€</span>&nbsp;inkl.&nbsp;MwSt.</div>
+
+<hr class="trenner">
+<div>Verbrauchsausweis Gewerbe</div>
+<div>ab&nbsp;<span class="price">{PRICES.VerbrauchsausweisGewerbe[0]}€</span>&nbsp;inkl.&nbsp;MwSt.</div>
+
+<hr class="trenner">
+<div>Bedarfsausweis Gewerbe</div>
+<div>ab&nbsp;<span class="price">300€</span>&nbsp;inkl.&nbsp;MwSt.</div>
+
+<hr class="trenner">
+<div>GEG-Nachweis Wohngebäude</div>
+<div>ab&nbsp;<span class="price">400€</span>&nbsp;inkl.&nbsp;MwSt.</div>
+
+<hr class="trenner">
+<div>GEG-Nachweis Gewerbe</div>
+<div>ab&nbsp;<span class="price">450€</span>&nbsp;inkl.&nbsp;MwSt.</div>
+
 <hr class="mt-2">
 
 </div>
 
+<style lang="postcss">
+
+.trenner-h{@apply mb-4 bg-primary h-[2px]}
+.trenner{@apply my-2}
+.price{@apply font-bold}
 
-<style lang="scss">
 </style>

src/layouts/Layout.astro

@@ -46,7 +46,8 @@ const { title } = Astro.props;
 
 		<SidebarLeft client:load/>
 		
-		<article class="box rounded-tl-none p-6">
+		<article class="box rounded-tl-none
+		xl:px-10 py-8">
 		<slot />
 		</article>
 		

src/modules/Ausweise/VerbrauchsausweisWohnenModule.svelte

@@ -10,6 +10,7 @@
 
 	import Ausweisart from "#components/Ausweis/Ausweisart.svelte";
 	import GebaeudeDaten from "#components/Ausweis/GebaeudeDaten.svelte";
+	import Warmwasseranteil from "#components/Ausweis/Warmwasseranteil.svelte";
 	
 	import Verbrauch from "#components/Ausweis/Verbrauch.svelte";
 	//import ZipSearch from "#components/PlzSuche.svelte";
@@ -207,6 +208,22 @@
 />
 </div>
 
+<!-- D Eingabe Warmwasseranteil und Verwendung von alternativen Energieversorgungssystemen -->
+
+<BereichLabel bereich="D">Eingabe&nbsp;Warmwasseranteil und&nbsp;Verwendung&nbsp;von&nbsp;alternativen Energieversorgungssystemen</BereichLabel>
+<div class="collapseBereich">
+	<Warmwasseranteil 
+	bind:ausweis
+/>
+	
+
+
+</div>
+
+
+
+
+
 
 </form>
 

src/style/global.css

@@ -41,8 +41,15 @@
 	font-family: "Antique Olive Compact bold";
 }
 
+.promo{
+	font-weight: 700;
+	box-sizing: border-box;
+	font-family: "Antique Olive Compact bold";
+	}
+
+
 body{
-	@apply bg-[url('/images/pattern.png')] bg-repeat bg-fixed max-w-[1920px] mx-auto border-gray-200 border-[1px] min-w-[320px];
+	@apply bg-[url('/images/pattern.png')] bg-repeat bg-fixed max-w-[1920px] mx-auto border-gray-200 border-[1px] min-w-[320px] 
 }
 
 .button {
@@ -92,7 +99,6 @@ article {
 /*BOXES*/
 .box{
 	@apply 	rounded-lg
-
 			lg:shadow-box lg:ring-1 lg:ring-gray-300
 			xl:rounded-xl;
 }

tailwind.config.cjs

@@ -49,25 +49,25 @@ module.exports = {
 			  },
 			
 			gridTemplateColumns: {
-				'formbutton-line': 'minmax(150px, 1fr) 1fr minmax(150px, 1fr) minmax(160px, 160px)',
-				'formbutton-line-md': 'minmax(150px, 1fr) 1fr minmax(150px, 1fr) minmax(160px, 160px)',
-				'formbutton-line-xl': 'minmax(150px, 1fr) 1fr minmax(150px, 1fr) minmax(160px, 160px)',
-				'formbutton-line-2xl': 'minmax(150px, 1fr) 1fr minmax(150px, 1fr) minmax(160px, 160px)',
-				
-				'bereich-A': '1fr',
-				'bereich-A-md': '2fr 2fr',
-				'bereich-A-xl': '2fr 2fr',
-				'bereich-A-2xl': '3fr 4fr',
-
-				'bereich-B': '1fr',
-				'bereich-B-lg': '2fr 2fr',
-				'bereich-B-xl': '2fr 2fr',
-				'bereich-B-2xl': '3fr 4fr',
-
-				'bereich-C': '1fr',
-				'bereich-C-lg': '2fr 2fr',
-				'bereich-C-xl': '2fr 2fr',
-				'bereich-C-2xl': '3fr 4fr',
+				//'formbutton-line': 'minmax(150px, 1fr) 1fr minmax(150px, 1fr) minmax(160px, 160px)',
+				//'formbutton-line-md': 'minmax(150px, 1fr) 1fr minmax(150px, 1fr) minmax(160px, 160px)',
+				//'formbutton-line-xl': 'minmax(150px, 1fr) 1fr minmax(150px, 1fr) minmax(160px, 160px)',
+				//'formbutton-line-2xl': 'minmax(150px, 1fr) 1fr minmax(150px, 1fr) minmax(160px, 160px)',
+				//
+				//'bereich-A': '1fr',
+				//'bereich-A-md': '2fr 2fr',
+				//'bereich-A-xl': '2fr 2fr',
+				//'bereich-A-2xl': '3fr 4fr',
+//
+				//'bereich-B': '1fr',
+				//'bereich-B-lg': '2fr 2fr',
+				//'bereich-B-xl': '2fr 2fr',
+				//'bereich-B-2xl': '3fr 4fr',
+//
+				//'bereich-C': '1fr',
+				//'bereich-C-lg': '2fr 2fr',
+				//'bereich-C-xl': '2fr 2fr',
+				//'bereich-C-2xl': '3fr 4fr',
 
 				
 				//'standard-sm': 'minmax(350px, 2fr) 6fr minmax(350px, 2fr)',