From ed19ae5514b56b4cdd239698494507fcdd61993a Mon Sep 17 00:00:00 2001
From: matt <matt@creative-crafter.de>
Date: Fri, 31 Jan 2025 18:08:16 +0100
Subject: [PATCH] neu

---
 laden.html | 39 +++++++++++++++++++++++++++++++--------
 1 file changed, 31 insertions(+), 8 deletions(-)
diff --git a/laden.html b/laden.html
index c5ce9db..428b8c6 100644
--- a/laden.html
+++ b/laden.html
@@ -5,17 +5,40 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Ladeanimation Beispiel</title>
     <script type="module" src="https://cdn.jsdelivr.net/npm/ldrs/dist/auto/quantum.js"></script>
+    <style>
+        body, html {
+            height: 100%;
+            margin: 0;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+        }
+
+        .loader-container {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100%;
+            width: 100%;
+            position: fixed;
+            top: 0;
+            left: 0;
+            background-color: rgba(255, 255, 255, 0.8); /* Optional: Ein halbtransparenter Hintergrund */
+            z-index: 9999; /* Sicherstellen, dass die Ladeanimation immer im Vordergrund ist */
+        }
+    </style>
 </head>
 <body>
-    <!-- Deine anderen Inhalte hier -->
-
     <!-- Ladeanimation -->
-    <l-quantum
-        size="45"
-        speed="1.75"
-        color="black" 
-    ></l-quantum>
+    <div class="loader-container">
+        <l-quantum
+            size="45"
+            speed="1.75"
+            color="black" 
+        ></l-quantum>
+    </div>
 
-    <!-- Weitere Inhalte -->
+    <!-- Deine anderen Inhalte hier -->
 </body>
 </html>
+
