Merge pull request #230 from IBCornelsen/UMBE

upDate UMBE

src/components/Ausweis/BilderZusatzsysteme.svelte

@@ -24,19 +24,19 @@
 
  var sanierungsoptionen =[
     
-    {"id":1,"name":"zentralheizung","value":"ZH","bindchecked":"gebaeude_aufnahme_allgemein.zentralheizung","label":"Zentral/Etage"},
+    {"id":1,"name":"zentralheizung","value":"ZH","bindchecked":gebaeude_aufnahme_allgemein.zentralheizung,"label":"Zentral/Etage"},
-    {"id":2,"name":"einzelofen","value":"EO","bindchecked":"{gebaeude_aufnahme_allgemein.einzelofen}","label":"Einzelofen"},
+    {"id":2,"name":"einzelofen","value":"EO","bindchecked":gebaeude_aufnahme_allgemein.einzelofen,"label":"Einzelofen"},
-    {"id":3,"name":"durchlauf_erhitzer","value":"DH","bindchecked":"{gebaeude_aufnahme_allgemein.durchlauf_erhitzer}","label":"Durchlauferhitzer"},
+    {"id":3,"name":"durchlauf_erhitzer","value":"DH","bindchecked":gebaeude_aufnahme_allgemein.durchlauf_erhitzer,"label":"Durchlauferhitzer"},
-    {"id":4,"name":"standard_kessel","value":"SK","bindchecked":"{gebaeude_aufnahme_allgemein.standard_kessel}","label":"Standardkessel"},
+    {"id":4,"name":"standard_kessel","value":"SK","bindchecked":gebaeude_aufnahme_allgemein.standard_kessel,"label":"Standardkessel"},
-    {"id":5,"name":"solarsystem_warmwasser","value":"SSWW","bindchecked":"{gebaeude_aufnahme_allgemein.solarsystem_warmwasser}","label":"Solarsystem für Warmwasser"},
+    {"id":5,"name":"solarsystem_warmwasser","value":"SSWW","bindchecked":gebaeude_aufnahme_allgemein.solarsystem_warmwasser,"label":"Solarsystem für Warmwasser"},
-    {"id":6,"name":"waermepumpe","value":"WP","bindchecked":"{gebaeude_aufnahme_allgemein.waermepumpe}","label":"Wärmepumpe"},
+    {"id":6,"name":"waermepumpe","value":"WP","bindchecked":gebaeude_aufnahme_allgemein.waermepumpe,"label":"Wärmepumpe"},
     
-    {"id":7,"name":"niedertemperatur_kessel","value":"NK","bindchecked":"{gebaeude_aufnahme_allgemein.niedertemperatur_kessel}","label":"Niedertemperaturkessel"},
+    {"id":7,"name":"niedertemperatur_kessel","value":"NK","bindchecked":gebaeude_aufnahme_allgemein.niedertemperatur_kessel,"label":"Niedertemperaturkessel"},
-    {"id":8,"name":"brennwert_kessel","value":"BWK","bindchecked":"{gebaeude_aufnahme_allgemein.brennwert_kessel}","label":"Brennwertkessel"},
+    {"id":8,"name":"brennwert_kessel","value":"BWK","bindchecked":gebaeude_aufnahme_allgemein.brennwert_kessel,"label":"Brennwertkessel"},
-    {"id":9,"name":"warmwasser_rohre_gedaemmt","value":"BWK","bindchecked":"{gebaeude_aufnahme_allgemein.warmwasser_rohre_gedaemmt}","label":"Warmwasserrohre gedämmt"},
+    {"id":9,"name":"warmwasser_rohre_gedaemmt","value":"BWK","bindchecked":gebaeude_aufnahme_allgemein.warmwasser_rohre_gedaemmt,"label":"Warmwasserrohre gedämmt"},
-    {"id":10,"name":"heizungsrohre_gedaemmt","value":"HRGD","bindchecked":"{gebaeude_aufnahme_allgemein.heizungsrohre_gedaemmt}","label":"Heizungsrohre gedämmt"},
+    {"id":10,"name":"heizungsrohre_gedaemmt","value":"HRGD","bindchecked":gebaeude_aufnahme_allgemein.heizungsrohre_gedaemmt,"label":"Heizungsrohre gedämmt"},
-    {"id":11,"name":"zirkulation","value":"ZK","bindchecked":"{gebaeude_aufnahme_allgemein.zirkulation}","label":"Zirkulation"},
+    {"id":11,"name":"zirkulation","value":"ZK","bindchecked":gebaeude_aufnahme_allgemein.zirkulation,"label":"Zirkulation"},
-    {"id":12,"name":"raum_temperatur_regler","value":"RTR","bindchecked":"{gebaeude_aufnahme_allgemein.raum_temperatur_regler}","label":"Raumtemperaturregler"}
+    {"id":12,"name":"raum_temperatur_regler","value":"RTR","bindchecked":gebaeude_aufnahme_allgemein.raum_temperatur_regler,"label":"Raumtemperaturregler"}
     ];
 
 
@@ -69,8 +69,6 @@ xl:grid-cols-2 xl:gap-x-8 xl:gap-y-8
 
 	</div>
 
-
-
 {/each}
 
 </div>

src/components/design/header/Header.astro

@@ -2,17 +2,17 @@
 import HeaderLogin from "#header/headerLogin.svelte";
 ---
 
-<header>
+<header id="header">
 
-<div class="grid relative bg-white items-center gap-4 pt-4 px-0
+<div id="header-grid" class="grid relative bg-white items-center gap-x-4 pt-4 px-0
 
 grid-cols-1
 sm:grid-cols-1 
 md:grid-cols-1
 
-lg:grid-cols-[1fr_minmax(450px,450px)] lg:gap-3 lg:px-4 lg:py-4
+lg:grid-cols-[1fr_minmax(450px,450px)] lg:gap-x-3 lg:px-4 lg:py-4
-xl:grid-cols-[1fr_minmax(450px,450px)] xl:gap-4 xl:px-6 xl:py-4
+xl:grid-cols-[1fr_minmax(450px,450px)] xl:gap-x-4 xl:px-6 xl:py-4
-2xl:grid-cols-[1fr_minmax(450px,450px)] 2xl:gap-5 2xl:px-6 2xl:py-4">
+2xl:grid-cols-[1fr_minmax(450px,450px)] 2xl:gap-x-5 2xl:px-6 2xl:py-4">
 
 <div class="justify-self-center xs:justify-self-start">
 
@@ -23,7 +23,7 @@ lg:px-0 lg:gap-x-4">
 
 <div class="self-start justify-self-start">
 	<a href="/">
-		<img class="w-full 
+		<img id="header-logo" class="w-full 
 		xs:max-w-[64px] 
 		sm:max-w-[64px]
 		md:max-w-[64px] md:ml-6
@@ -35,7 +35,8 @@ lg:px-0 lg:gap-x-4">
 </div>
 
 <div class="self-center justify-self-center md:justify-self-start xs:mt-[20px] md:mt-[18px]">
-	<div class="text-secondary justify-self-center
+	
+	<div id="header-text-1"class="text-secondary justify-self-center
 	xs:[font-size:_clamp(15px,5vw,36px)] xs:justify-self-start xs:leading-[36px]
 
 	lg:[font-size:_clamp(15px,3vw,26px)]
@@ -43,7 +44,8 @@ lg:px-0 lg:gap-x-4">
 	xl:[font-size:_clamp(15px,3vw,36px)] 
 	xl:leading-[4.5rem] pt-[0px]">
 	Energieausweis online erstellen</div>
-	<div class="text-primary justify-self-center
+
+	<div id="header-text-2"class="text-primary justify-self-center
 	xs:[font-size:_clamp(15px,4vw,28px)] xs:justify-self-start xs:leading-[20px]
 
 	lg:[font-size:_clamp(15px,3vw,20px)] 
@@ -67,10 +69,8 @@ lg:px-0 lg:gap-x-4">
 </div>
 
 	<div class="col-start-1 col-span-3">
-		<div class="px-2 flex flex-row w-full justify-end items-center bg-primary
+		<div id="header-line" class="px-2 flex flex-row w-full justify-end items-center bg-primary
 					lg:h-[12px] xl:h-[12px]"></div>			
-		<div class="px-2 flex flex-row w-full justify-end items-center bg-secondary
-					lg:h-[0px] xl:h-[0px]"></div>			
 	</div>
 
 </header>

src/components/design/header/headerLogin.svelte

@@ -61,7 +61,7 @@
 
 
 
-		<div class="grid grid-cols-1 lg:grid-cols-[3fr_2fr] gap-2">
+		<div id="passwort-vergessen" class="grid grid-cols-1 lg:grid-cols-[3fr_2fr] gap-2">
 		
 
 			<div class="w-full text-left self-center">

src/layouts/Layout.astro

@@ -12,9 +12,67 @@ export interface Props {
 }
 
 const { title } = Astro.props;
-
 ---
 
+<script>
+window.addEventListener("scroll", (event) => {
+    let scroll = window.scrollY;
+
+	if(scroll>=144){
+		console.log(scroll);
+		document.getElementById('header').style.position = 'fixed';
+		document.getElementById('header').style.zIndex = '1000';
+		document.getElementById('header').style.width = '100%';
+		document.getElementById('header').style.top = '0';
+
+		document.getElementById('header-grid')?.classList.add('2xl:py-0');
+		document.getElementById('header-grid')?.classList.remove('2xl:py-4')
+		document.getElementById('header-grid')?.classList.remove('bg-white');
+
+		document.getElementById('header-grid')?.classList.add('bg-secondary');
+		document.getElementById('header-text-1')?.classList.add('text-white');
+		document.getElementById('header-text-1')?.classList.add('hidden');
+		document.getElementById('header-text-2')?.classList.add('hidden');
+		document.getElementById('header-line')?.classList.add('xl:h-[6px]');
+		document.getElementById('header-logo').style.height = '62px';
+		document.getElementById('header-logo')?.classList.add('xl:bg-white','xl:px-2');
+;
+		document.getElementById('card-login')?.classList.remove('lg:ring-2');
+		document.getElementById('passwort-vergessen')?.classList.add('hidden');
+
+		document.getElementById('main').style.marginTop = '211px';
+
+	}else{
+
+		document.getElementById('header').style.position = 'relative';
+		document.getElementById('header').style.zIndex = '0';
+		document.getElementById('header').style.top = '0';
+
+		document.getElementById('header-grid')?.classList.add('2xl:py-4');
+		document.getElementById('header-grid')?.classList.remove('2xl:py-0');
+
+		document.getElementById('header-grid')?.classList.add('bg-white');
+		document.getElementById('header-grid')?.classList.remove('bg-secondary');
+
+		document.getElementById('header-text-1')?.classList.remove('text-white');
+		document.getElementById('header-text-1')?.classList.remove('hidden');
+		document.getElementById('header-text-2')?.classList.remove('hidden');
+		document.getElementById('header-line')?.classList.remove('xl:h-[6px]');
+		document.getElementById('header-logo').style.height = '107.53px';
+		document.getElementById('header-logo')?.classList.remove('xl:bg-white','xl:px-2');
+
+		document.getElementById('card-login')?.classList.add('lg:ring-2');
+		document.getElementById('passwort-vergessen')?.classList.remove('hidden');
+
+		document.getElementById('main').style.marginTop = '0px';
+
+	}
+    
+
+});
+
+</script>
+
 <!DOCTYPE html>
 <html lang="de">
 	<head>
@@ -34,7 +92,7 @@ const { title } = Astro.props;
 			
 		<Header />
 	
-		<main
+		<main id="main"
 		class="w-full p-0 grid
 		xs:grid-cols-[minmax(1fr,1fr)] xs:gap-1 xs:p-0
 		sm:grid-cols-[minmax(1fr,1fr)] sm:gap-1 sm:p-0

src/modules/BedarfsausweisWohnen/BedarfsausweisContent.svelte

@@ -7,7 +7,7 @@
 	import HelpLabel from "#components/HelpLabel.svelte";
 	import ZipSearch from "#components/PlzSuche.svelte";
 	import { hotWaterProductionTypes } from "./HotWaterProductionTypes.js";
-	import BilderZusatzsysteme from "../Ausweis/BilderZusatzsysteme.svelte";
+	import BilderZusatzsysteme from "../../components/Ausweis/BilderZusatzsysteme.svelte";
 	import moment from "moment";
 	import { BitChecker } from "src/lib/BitChecker.js";
 	import { Enums } from "@ibcornelsen/database/client";

src/pages/energieausweis-erstellen/bedarfsausweis-wohngebaeude/index.astro

@@ -1,7 +1,7 @@
 ---
 
 import AusweisLayout from "#layouts/AusweisLayout.astro";
-import BedarfsausweisContent from "#components/Bedarfsausweis/BedarfsausweisContent.svelte";
+import BedarfsausweisContent from "#modules/BedarfsausweisWohnen/BedarfsausweisContent.svelte";
 import { BedarfsausweisWohnenClient } from "#components/Ausweis/types";
 import { createCaller } from "#lib/caller";
 

src/pages/energieausweis-erstellen/verbrauchsausweis-wohngebaeude/index.astro

@@ -1,6 +1,6 @@
 ---
 import AusweisLayout from "#layouts/AusweisLayout.astro";
-import VerbrauchsausweisWohnenModule from "#modules/Ausweise/VerbrauchsausweisWohnenModule.svelte";
+import VerbrauchsausweisWohnenModule from "#modules/VerbrauchsausweisWohnen/VerbrauchsausweisWohnenModule.svelte";
 import { VerbrauchsausweisWohnenClient } from "#components/Ausweis/types";
 import { createCaller } from "#lib/caller";