IBCornelsen/online-energieausweis
1
0
Fork 0
Code Issues 272 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

.

Browse Source
This commit is contained in:
Robert Jagtiani
2025-04-02 14:33:36 +02:00
parent e1a83aed77
commit 15b818acdb
8 changed files with 146 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
src/layouts/AusweisLayoutDaten.astro
View File

@@ -17,7 +17,7 @@ export interface Props {
const { title } = Astro.props;
---
<script>
<script>
import { H } from "highlight.run";
if (import.meta.env.PROD) {
@@ -29,76 +29,77 @@ const { title } = Astro.props;
enabled: true,
recordHeadersAndBody: true
}
})
});
}
window.addEventListener("scroll", (event) => {
const skala = document.getElementById("skala");
window.addEventListener("scroll", () => {
const skala = document.getElementById("skala");
if (skala?.classList.contains("no-scroll")) {
if (skala) {
skala.classList.remove(
"2xl:fixed",
"2xl:py-4",
"2xl:top-0",
"2xl:z-20"
);
skala.classList.add("w-full");
skala.style.borderBottom = "none";
}
if (!skala) return;
document
.getElementById("formInput-1")
?.classList.remove("2xl:mt-[370px]");
return;
}
// Wenn skala "no-scroll" hat, alles zurücksetzen
if (skala.classList.contains("no-scroll")) {
skala.classList.remove(
"2xl:fixed",
"2xl:py-4",
"2xl:top-0",
"2xl:z-20"
);
skala.classList.add("w-full");
skala.style.borderBottom = "none";
skala.style.width = ""; // zurücksetzen
let scroll = window.scrollY;
if (scroll >= 400) {
if (skala) {
skala.classList.add(
"2xl:fixed",
"2xl:py-4",
"2xl:top-0",
"2xl:z-20"
);
skala.classList.remove("w-full");
skala.style.borderBottom = "3px solid #e6e6e6";
}
document.getElementById("formInput-1")?.classList.remove("2xl:mt-[370px]");
return;
}
const performanceBox =
document.getElementById("performance-box");
if (performanceBox) {
performanceBox.style.maxWidth = "688.5px";
}
const progressBox = document.getElementById("progress-box");
let scroll = window.scrollY;
if (scroll >= 400) {
// Breite einmal auslesen und festsetzen
const skalaWidth = skala.offsetWidth + "px";
skala.style.width = skalaWidth;
if (progressBox) {
progressBox.style.maxWidth = "688.5px";
}
skala.classList.add(
"2xl:fixed",
"2xl:py-4",
"2xl:top-0",
"2xl:z-20"
);
skala.classList.remove("w-full");
skala.style.borderBottom = "3px solid #e6e6e6";
document
.getElementById("formInput-1")
?.classList.add("2xl:mt-[370px]");
} else {
if (skala) {
skala.classList.remove(
"2xl:fixed",
"2xl:py-4",
"2xl:top-0",
"2xl:z-20"
);
skala.classList.add("w-full");
skala.style.borderBottom = "none";
}
document.getElementById("formInput-1")?.classList.add("2xl:mt-[370px]");
} else {
skala.classList.remove(
"2xl:fixed",
"2xl:py-4",
"2xl:top-0",
"2xl:z-20"
);
skala.classList.add("w-full");
skala.style.borderBottom = "none";
skala.style.width = ""; // zurücksetzen
document.getElementById("formInput-1")?.classList.remove("2xl:mt-[370px]");
}
});
window.addEventListener("resize", () => {
const skala = document.getElementById("skala");
if (!skala) return;
// Nur aktualisieren, wenn gerade "fixed" ist
if (skala.classList.contains("2xl:fixed")) {
// Temporär zurücksetzen, um echte Breite zu bekommen
skala.style.width = "";
const skalaWidth = skala.offsetWidth + "px";
skala.style.width = skalaWidth;
}
});
document
.getElementById("formInput-1")
?.classList.remove("2xl:mt-[370px]");
}
});
</script>
<html lang="de">
<head>
<meta charset="UTF-8" />

78
src/layouts/AusweisLayoutDaten_immowelt.astro
View File

@@ -26,23 +26,71 @@ const { tabHover5 } = Astro.props;
const { tabHover6 } = Astro.props;
---
<script>
window.addEventListener("scroll", (event) => {
let scroll = window.scrollY;
window.addEventListener("scroll", () => {
const skala = document.getElementById("skala");
// if(scroll>=400){
//
// document.getElementById('skala')?.classList.add('2xl:w-[calc(100%-6rem)]', '2xl:fixed','2xl:py-4','2xl:top-0','2xl:z-20' ,'2xl:[box-shadow:0_2px_12px_#ccc;]');
// document.getElementById('formInput-1')?.classList.add('2xl:mt-[270px]');
// }else{
//
// document.getElementById('skala')?.classList.remove('2xl:w-[calc(100%-6rem)]','2xl:fixed','2xl:py-4','2xl:top-0','2xl:z-20','2xl:[box-shadow:0_0_20px_#000;]');
// document.getElementById('formInput-1')?.classList.remove('2xl:mt-[270px]');
// }
if (!skala) return;
// Wenn skala "no-scroll" hat, alles zurücksetzen
if (skala.classList.contains("no-scroll")) {
skala.classList.remove(
"2xl:fixed",
"2xl:py-4",
"2xl:top-0",
"2xl:z-20"
);
skala.classList.add("w-full");
skala.style.borderBottom = "none";
skala.style.width = ""; // zurücksetzen
document.getElementById("formInput-1")?.classList.remove("2xl:mt-[370px]");
return;
}
let scroll = window.scrollY;
if (scroll >= 400) {
// Breite einmal auslesen und festsetzen
const skalaWidth = skala.offsetWidth + "px";
skala.style.width = skalaWidth;
skala.classList.add(
"2xl:fixed",
"2xl:py-4",
"2xl:top-0",
"2xl:z-20"
);
skala.classList.remove("w-full");
skala.style.borderBottom = "3px solid #e6e6e6";
document.getElementById("formInput-1")?.classList.add("2xl:mt-[370px]");
} else {
skala.classList.remove(
"2xl:fixed",
"2xl:py-4",
"2xl:top-0",
"2xl:z-20"
);
skala.classList.add("w-full");
skala.style.borderBottom = "none";
skala.style.width = ""; // zurücksetzen
document.getElementById("formInput-1")?.classList.remove("2xl:mt-[370px]");
}
});
window.addEventListener("resize", () => {
const skala = document.getElementById("skala");
if (!skala) return;
// Nur aktualisieren, wenn gerade "fixed" ist
if (skala.classList.contains("2xl:fixed")) {
// Temporär zurücksetzen, um echte Breite zu bekommen
skala.style.width = "";
const skalaWidth = skala.offsetWidth + "px";
skala.style.width = skalaWidth;
}
});
</script>
<!DOCTYPE html>
@@ -93,11 +141,11 @@ window.addEventListener("scroll", (event) => {
<Header {tabHover1} {tabHover2} {tabHover3} {tabHover4} {tabHover5} {tabHover6}/>
<main class="w-full p-0 grid grid-cols-1">
<main class="w-full p-0 grid grid-cols-1 rounded-none">
<!--<SidebarLeft />-->
<article class="p-0 lg:p-2">
<article class="p-0 lg:p-20">
<slot />
</article>