forked from markus/AMPERION_Webpage
Änderungern11080046
This commit is contained in:
parent
6cd592a3ff
commit
23aa8074ac
5 changed files with 194 additions and 161 deletions
|
|
@ -41,21 +41,22 @@
|
|||
|
||||
|
||||
|
||||
<!-- Mission/Vision/Ziel (grau, Heading + Tabs) -->
|
||||
<!-- Mission/Vision/Ziel Section -->
|
||||
{{ with .Params.mission_vision }}
|
||||
{{ if .enable }}
|
||||
<section class="mission-section section pt-0" style="background-color:#f3f3f3;">
|
||||
<div class="my-container">
|
||||
<section class="mission-section section pt-0" style="background-color: #f8f9fa;">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-10">
|
||||
<!-- Titelblock abgestimmt auf Index -->
|
||||
<div class="text-center mb-4" data-aos="fade-up">
|
||||
<!-- Schlanker, mittiger Content-Bereich -->
|
||||
<div>
|
||||
<!-- Headings -->
|
||||
<div class="text-center mb-3">
|
||||
<h1>Mission · Vision · Ziel</h1>
|
||||
<h2><em>Wofür wir stehen und wo wir hinwollen.</em></h2>
|
||||
<h2>Die Grundpfeiler unserer Arbeit.</h2>
|
||||
</div>
|
||||
|
||||
<div class="mission-tabs-wrapper">
|
||||
<!-- Tabs -->
|
||||
<!-- Tabs (zentriert) -->
|
||||
<ul class="nav nav-tabs mission-tabs justify-content-center" role="tablist">
|
||||
{{ range $index, $elements := .tabs }}
|
||||
<li class="nav-item" role="presentation">
|
||||
|
|
@ -71,14 +72,12 @@
|
|||
{{ end }}
|
||||
</ul>
|
||||
|
||||
<!-- Tab Content -->
|
||||
<!-- Inhalte (ohne fade, damit kein Flackern) -->
|
||||
<div class="tab-content mission-tab-content">
|
||||
{{ range $index, $elements := .tabs }}
|
||||
<div class="tab-pane fade {{ if eq $index 0 }}show active{{ end }}"
|
||||
<div class="tab-pane {{ if eq $index 0 }}active{{ end }}"
|
||||
id="content-{{ .name | urlize }}"
|
||||
role="tabpanel"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay="100">
|
||||
role="tabpanel">
|
||||
<div class="tab-inner">
|
||||
{{ .content | $.Page.RenderString (dict "display" "block") }}
|
||||
</div>
|
||||
|
|
@ -86,6 +85,7 @@
|
|||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -94,7 +94,9 @@
|
|||
{{ end }}
|
||||
|
||||
|
||||
<!-- Kompetenzen: Layout & Karten wie "Darum AMPERION" auf der Startseite -->
|
||||
|
||||
|
||||
<!-- Was uns auszeichnet -->
|
||||
<section class="section" style="background-color:#ffffff;">
|
||||
<div class="my-container">
|
||||
<div class="row">
|
||||
|
|
@ -104,21 +106,25 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Karten (Re-Use der Service-Card Struktur von der Startseite) -->
|
||||
<div class="why-grid mt-5">
|
||||
<div class="why-grid mt-5" style="
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
gap: 2rem;
|
||||
justify-items: center;
|
||||
">
|
||||
{{ $delay := 0 }}
|
||||
{{ $step := 100 }}
|
||||
|
||||
<article class="service-card text-center" data-aos="zoom-in" data-aos-delay="{{ $delay = add $delay $step }}">
|
||||
<img src="/icons/stamp.svg" alt="Staatlich geprüft" class="service-icon mb-3">
|
||||
<h3 class="service-card-title">Staatlich geprüftes Ingenieurbüro</h3>
|
||||
<img src="/icons/stamp.svg" alt="Staatlich geprüft" class="service-icon mb-3" style="filter: invert(57%) sepia(94%) saturate(602%) hue-rotate(359deg) brightness(101%) contrast(103%);">
|
||||
<h3 class="service-card-title">Staatlich geprüft & konzessioniert</h3>
|
||||
<p class="service-card-description">
|
||||
<strong>Konzessionierter Elektrotechnikbetrieb –</strong> Planung und Prüfung mit Qualität & Sicherheit.
|
||||
<strong>Ingenieurbüro und Elektrotechnikbetrieb –</strong> Planung und Prüfung mit Qualität & Sicherheit.
|
||||
</p>
|
||||
</article>
|
||||
|
||||
<article class="service-card text-center" data-aos="zoom-in" data-aos-delay="{{ $delay = add $delay $step }}">
|
||||
<img src="/icons/brain.svg" alt="Erfahrung & Innovation" class="service-icon mb-3">
|
||||
<img src="/icons/brain.svg" alt="Erfahrung & Innovation" class="service-icon mb-3" style="filter: invert(57%) sepia(94%) saturate(602%) hue-rotate(359deg) brightness(101%) contrast(103%);">
|
||||
<h3 class="service-card-title">Erfahrung & Innovation</h3>
|
||||
<p class="service-card-description">
|
||||
<strong>Über 10 Jahre Praxis –</strong> kombiniert mit modernen Methoden und Tools.
|
||||
|
|
@ -126,7 +132,7 @@
|
|||
</article>
|
||||
|
||||
<article class="service-card text-center" data-aos="zoom-in" data-aos-delay="{{ $delay = add $delay $step }}">
|
||||
<img src="/icons/earth.svg" alt="Ganzheitlicher Ansatz" class="service-icon mb-3">
|
||||
<img src="/icons/earth.svg" alt="Ganzheitlicher Ansatz" class="service-icon mb-3" style="filter: invert(57%) sepia(94%) saturate(602%) hue-rotate(359deg) brightness(101%) contrast(103%);">
|
||||
<h3 class="service-card-title">Ganzheitlicher Ansatz</h3>
|
||||
<p class="service-card-description">
|
||||
<strong>Technik, Wirtschaft & Umwelt –</strong> von Beginn an zukunftssicher gedacht.
|
||||
|
|
@ -134,7 +140,7 @@
|
|||
</article>
|
||||
|
||||
<article class="service-card text-center" data-aos="zoom-in" data-aos-delay="{{ $delay = add $delay $step }}">
|
||||
<img src="/icons/briefcase-business.svg" alt="Unabhängige Beratung" class="service-icon mb-3">
|
||||
<img src="/icons/briefcase-business.svg" alt="Unabhängige Beratung" class="service-icon mb-3" style="filter: invert(57%) sepia(94%) saturate(602%) hue-rotate(359deg) brightness(101%) contrast(103%);">
|
||||
<h3 class="service-card-title">Unabhängige Beratung</h3>
|
||||
<p class="service-card-description">
|
||||
<strong>Herstellerneutral –</strong> wir empfehlen, was zu Ihrem Projekt wirklich passt.
|
||||
|
|
@ -145,6 +151,7 @@
|
|||
</section>
|
||||
|
||||
|
||||
|
||||
<!-- Team Section (grau, konsistent) -->
|
||||
{{ with .Params.about }}
|
||||
{{ if .enable }}
|
||||
|
|
@ -161,7 +168,7 @@
|
|||
<div class="col-lg-4 col-md-12 order-lg-1 order-2" data-aos="fade-right" data-aos-delay="100">
|
||||
<div class="founder-card">
|
||||
{{ with .left_person }}
|
||||
<h3 class="founder-name">{{ .name | markdownify }}</h3>
|
||||
<h4 class="founder-name">{{ .name | markdownify }}</h4>
|
||||
<div class="founder-description">
|
||||
{{ .description | $.Page.RenderString (dict "display" "block") }}
|
||||
</div>
|
||||
|
|
@ -182,7 +189,7 @@
|
|||
<div class="col-lg-4 col-md-12 order-lg-3 order-3" data-aos="fade-left" data-aos-delay="300">
|
||||
<div class="founder-card">
|
||||
{{ with .right_person }}
|
||||
<h3 class="founder-name">{{ .name | markdownify }}</h3>
|
||||
<h4 class="founder-name">{{ .name | markdownify }}</h4>
|
||||
<div class="founder-description">
|
||||
{{ .description | $.Page.RenderString (dict "display" "block") }}
|
||||
</div>
|
||||
|
|
@ -226,11 +233,11 @@
|
|||
<div class="my-container">
|
||||
<div class="cta__wrap">
|
||||
<h2 class="cta__title">
|
||||
Lassen Sie uns Ihre Vision mit unserer Expertise zur Realität machen.
|
||||
Mehr Energie - Mit UNS!
|
||||
</h2>
|
||||
<p class="cta__lead">
|
||||
Bereit für Ihr Energieprojekt?
|
||||
<span class="cta__accent">Kostenfreie Erstberatung sichern!</span>
|
||||
Ihr Weg zu nachhaltiger Energie beginnt hier.
|
||||
<span class="cta__accent">Lassen Sie uns starten!</span>
|
||||
</p>
|
||||
<div class="cta__actions">
|
||||
<a class="cta__btn" href="mailto:{{ $impressum.Params.email }}">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue