Juli 2025

layouts/index.html

@@ -1,5 +1,10 @@
 {{ define "main" }}
-<header>
+Um den ersten Bereich der Seite beim Scrollen nach unten verschwinden zu lassen und beim Scrollen nach ganz oben wieder erscheinen zu lassen, kannst du JavaScript verwenden, um den Bereich zu verstecken oder anzuzeigen, basierend auf der Scroll-Position. Hier ist, wie du das machen kannst:
+Schritt 1: Füge eine ID oder Klasse zum Header hinzu
+
+Füge eine ID oder Klasse zum <header>-Element hinzu, damit du es leicht mit JavaScript ansprechen kannst.
+
+<header id="mainHeader">
 
 
   {{ with .Params.banner }}
@@ -89,6 +94,35 @@
   });
 </script>
 
+<script>
+  document.addEventListener('DOMContentLoaded', function() {
+    var header = document.getElementById('mainHeader');
+    var lastScrollPosition = window.scrollY;
+
+    window.addEventListener('scroll', function() {
+      var currentScrollPosition = window.scrollY;
+
+      // Wenn der Benutzer nach unten scrollt, verstecke den Header
+      if (currentScrollPosition > lastScrollPosition) {
+        header.style.top = '-100vh'; // Passe diesen Wert an die Höhe deines Headers an
+      }
+      // Wenn der Benutzer nach oben scrollt, zeige den Header wieder an
+      else {
+        header.style.top = '0';
+      }
+
+      // Wenn der Benutzer ganz nach oben scrollt, zeige den Header an
+      if (currentScrollPosition === 0) {
+        header.style.top = '0';
+      }
+
+      lastScrollPosition = currentScrollPosition;
+    });
+  });
+</script>
+
+
+
 <div style="height: 200px;"></div>
 
 <!-- whyamperion -->
@@ -101,7 +135,7 @@
 
 
 
-<!-- service -->
+<!-- services -->
 {{ with site.GetPage "/service" }}
 {{ with .Params.service }}
 <section id="service" class="service">
@@ -134,9 +168,9 @@
 </section>
 {{ end }}
 {{ end }}
-<!-- /service -->
+<!-- /services -->
 
-<!-- service -->
+<!-- focustopics -->
 {{ with site.GetPage "/focustopic" }} <!-- Hier den Pfad zur service2.md anpassen -->
 {{ with .Params.service }}
 <section id="service" class="service">
@@ -166,12 +200,11 @@
 </section>
 {{ end }}
 {{ end }}
-<!-- /service -->
+<!-- /focustopics -->
 
 <div style="height: 100px;"></div>
 
-<!-- Include the new services section -->
-
+<!-- why amperion -->
 {{ with site.GetPage "/why-amperion" }}
 <section class="services-section">
   <h2 class="services-title">{{ .Params.service.title | default "OUR SERVICES" }}</h2>
@@ -188,7 +221,7 @@
 </section>
 {{ end }}
 
-
+<!-- /why amperion -->
 
 <div style="height: 100px;"></div>
 
@@ -214,14 +247,16 @@
         <div class="services-description">
           {{ with .description }}<h3>{{ . | markdownify }}</h3>{{ end }}
         </div>
-
-        <div style="height: 20px;"></div>
       </div>
     </div>
     <div class="row">
       <div class="col-md-9 col-sm-12">
-        <div class="block">
-          {{ with .content }}{{ . | markdownify }}{{ end }}
+        <div class="text-left">
+          {{ with .content }}{{ . | markdownify }}{{ end }}</div>
+          <div class="hover-link"> 
+          {{ with .link_text }}
+            <a href="{{ "/about/" | relURL }}">{{ . }}</a>
+          {{ end }}
         </div>
       </div>
       <div class="col-md-3 col-sm-12">
@@ -236,6 +271,7 @@
 {{ end }}
 <!-- /about -->
 
+
 <div style="height: 100px;"></div>
 <!-- call to action -->
 {{ if .Params.cta.enable }}