astosic/AMPERION_Webpage
1
0
Fork 0
forked from markus/AMPERION_Webpage
Code Pull requests Activity

Refactor SCSS and HTML for improved layout, typography, and call-to-action sections

Browse source
This commit is contained in:
astosic 2025-08-09 12:38:57 +02:00
parent b62687cac4
commit 5083ef7e3c
6 changed files with 328 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

50
layouts/index.html
View file

@ -261,18 +261,21 @@ document.addEventListener('DOMContentLoaded', function () {
<div class="row mt-4 d-flex align-items-stretch about-row">
<!-- Textbereich -->
<div class="col-md-7 col-sm-12 d-flex h-100" data-aos="fade-right" data-aos-delay="200">
<div class="col-md-7 col-sm-12 d-flex h-1000" data-aos="fade-right" data-aos-delay="200">
<div class="text-left w-100 my-auto">
{{ with .content }}{{ . | markdownify }}{{ end }}
</div>
<a href="/about/" class="about-cta">MEHR ÜBER UNS</a>
</div>
<!-- Bildbereich -->
<div class="col-md-5 col-sm-12 d-flex h-100" data-aos="zoom-in" data-aos-delay="300">
<div class="col-md-5 col-sm-12 d-flex h-10" data-aos="zoom-in" data-aos-delay="300">
<div class="about-image-wrap">
<img src="{{ .image | relURL }}" class="about-image" alt="Über AMPERION Bild">
</div>
</div>
</div>
</div>
@ -283,7 +286,48 @@ document.addEventListener('DOMContentLoaded', function () {
<!-- CALL TO ACTION -->
{{ $impressum := site.GetPage "page" "impressum" }}
{{ if .Params.cta.enable }}
{{ partial "cta.html" . }}
<section id="cta" class="cta">
<!-- BG -->
<div class="cta__bg" aria-hidden="true">
<div class="cta__grad"></div>
<div class="cta__pan"></div>
</div>
<div class="my-container">
<div class="cta__wrap">
<h2 class="cta__title">
Lassen Sie uns Ihre Vision mit unserer Expertise zur Realität machen.
</h2>
<p class="cta__lead">
Bereit für Ihr Energieprojekt?
<span class="cta__accent">Kostenfreie Erstberatung sichern!</span>
</p>
<div class="cta__actions">
<a class="cta__btn" href="mailto:{{ $impressum.Params.email }}">
<span aria-hidden="true">✉️</span><span>E-Mail senden</span>
</a>
<a class="cta__btn" href="tel:{{ $impressum.Params.telefon }}">
<span aria-hidden="true">📞</span><span>Anrufen</span>
</a>
</div>
<div class="cta__social">
<a class="cta__social-link" href="https://www.instagram.com/amperion.at/" target="_blank" rel="noopener" aria-label="Instagram">
<img src="/images/social/instagram.svg" alt="">
</a>
<a class="cta__social-link" href="https://www.linkedin.com/company/amperion-gmbh/" target="_blank" rel="noopener" aria-label="LinkedIn">
<img src="/images/social/linkedin.svg" alt="">
</a>
<a class="cta__social-link" href="https://www.facebook.com/share/1CZ7xm6cdw/?mibextid=wwXIfr" target="_blank" rel="noopener" aria-label="Facebook">
<img src="/images/social/facebook.svg" alt="">
</a>
</div>
</div>
</div>
</section>
{{ end }}
{{ end }}

27
layouts/partials/cta.html
View file

@ -1,27 +0,0 @@
{{ $impressum := site.GetPage "page" "impressum" }}
{{ with site.GetPage "/" }}
{{ with .Params.cta }}
<section class="call-to-action bg-1 section-sm overly" style="background-image: url('{{ .bg_image | relURL }}'); position: relative; background-attachment: fixed; background-size: cover;">
<div class="overlay-dark"></div> <!-- DAS NEUE OVERLAY -->
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="block" style="position: relative; z-index: 1;">
{{ with .title }}<h2>{{ . | markdownify }}</h2>{{ end }}
{{ with .content }}<p>{{ . | markdownify }}</p>{{ end }}
{{ with .button }}
{{ if .enable }}
<a class="btn btn-main btn-solid-border" href="mailto:{{ $impressum.Params.email }}">E-mail</a>
<br>
<a class="btn btn-main btn-solid-border" href="tel:{{ index $impressum.Params.telefon }}">TELEFON</a>
{{ end }}
{{ end }}
</div>
</div>
</div>
</div>
</section>
{{ end }}
{{ end }}