Update120825
This commit is contained in:
parent
0962f9325b
commit
2ae734e906
13 changed files with 368 additions and 173 deletions
|
|
@ -733,7 +733,7 @@ body {
|
||||||
/* ÄNDERUNG: deutlich kleinere Buttons (Höhe, Breite, Schrift) */
|
/* ÄNDERUNG: deutlich kleinere Buttons (Höhe, Breite, Schrift) */
|
||||||
--btn-py: clamp(1rem, 1.2vw, 1.5rem); /* vorher 1.8–2.5rem -> jetzt kompakter */
|
--btn-py: clamp(1rem, 1.2vw, 1.5rem); /* vorher 1.8–2.5rem -> jetzt kompakter */
|
||||||
--btn-px: clamp(1rem, 1.6vw, 1.5rem); /* vorher 1.8–2.5rem -> schmaler */
|
--btn-px: clamp(1rem, 1.6vw, 1.5rem); /* vorher 1.8–2.5rem -> schmaler */
|
||||||
--btn-fs: clamp(1.5rem, 1.15vw, 1.5rem);/* vorher 1.8–2.5rem -> p-nahe Größe */
|
--btn-fs: clamp(1.8rem, 1.6vw, 2.5rem);/* vorher 1.8–2.5rem -> p-nahe Größe */
|
||||||
|
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
@ -924,55 +924,33 @@ body {
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cta__btn {
|
.cta__btn,
|
||||||
display: inline-flex;
|
button.cta__btn{
|
||||||
align-items: center;
|
display:inline-flex; align-items:center; gap:.7rem;
|
||||||
gap: .7rem;
|
padding:var(--btn-py,12px) var(--btn-px,22px);
|
||||||
padding: var(--btn-py) var(--btn-px); /* nutzt die kleineren Presets oben */
|
|
||||||
border-radius:9999px;
|
border-radius:9999px;
|
||||||
background:#fff;
|
background:#fff;
|
||||||
color: var(--cta-primary);
|
color:var(--cta-primary,#0a8f8d);
|
||||||
border:1px solid rgba(0,0,0,.06);
|
border:1px solid rgba(0,0,0,.06);
|
||||||
box-shadow:0 1px 3px rgba(0,0,0,.06);
|
box-shadow:0 1px 3px rgba(0,0,0,.06);
|
||||||
text-decoration:none;
|
text-decoration:none;
|
||||||
font-weight:700;
|
font-weight:700;
|
||||||
font-size: var(--btn-fs); /* nutzt die kleinere Schrift */
|
font-size:var(--btn-fs,1rem);
|
||||||
transition:background .15s ease, color .15s ease, box-shadow .2s ease, transform .04s ease;
|
transition:background .15s ease, color .15s ease, box-shadow .2s ease, transform .04s ease;
|
||||||
position: relative;
|
position:relative; overflow:hidden;
|
||||||
overflow: hidden;
|
-webkit-appearance:none; appearance:none; /* wichtig bei <button> */
|
||||||
|
}
|
||||||
&::before {
|
.cta__btn::before{
|
||||||
content: '';
|
content:""; position:absolute; top:50%; left:50%;
|
||||||
position: absolute;
|
width:0; height:0; border-radius:50%;
|
||||||
top: 50%;
|
background:var(--cta-accent,#F5A623);
|
||||||
left: 50%;
|
|
||||||
width: 0;
|
|
||||||
height: 0;
|
|
||||||
border-radius: 50%;
|
|
||||||
background: var(--cta-accent);
|
|
||||||
transform:translate(-50%,-50%);
|
transform:translate(-50%,-50%);
|
||||||
transition: width 0.6s ease, height 0.6s ease;
|
transition:width .6s ease, height .6s ease; z-index:-1;
|
||||||
z-index: -1;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background: var(--cta-accent);
|
|
||||||
color: #fff;
|
|
||||||
box-shadow: 0 8px 22px rgba(245,166,35,.35);
|
|
||||||
|
|
||||||
&::before {
|
|
||||||
width: 300%;
|
|
||||||
height: 300%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active { transform: translateY(1px); }
|
|
||||||
|
|
||||||
&:focus-visible {
|
|
||||||
outline: 2px dashed var(--cta-accent);
|
|
||||||
outline-offset: 3px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
.cta__btn:hover{ background:var(--cta-accent,#F5A623); color:#fff; box-shadow:0 8px 22px rgba(245,166,35,.35) }
|
||||||
|
.cta__btn:hover::before{ width:300%; height:300% }
|
||||||
|
.cta__btn:active{ transform:translateY(1px) }
|
||||||
|
.cta__btn:focus-visible{ outline:2px dashed var(--cta-accent,#F5A623); outline-offset:3px }
|
||||||
|
|
||||||
/* Social-Icons (etwas größer, Teal-Hover) */
|
/* Social-Icons (etwas größer, Teal-Hover) */
|
||||||
.cta__social {
|
.cta__social {
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,7 @@ summaryLength = 10 # see https://gohugo.io/content-management/excerpts/
|
||||||
# disqus short name
|
# disqus short name
|
||||||
disqusShortname = "themefisher-template" # we use disqus to show comments in blog posts . To install disqus please follow this tutorial https://portfolio.peter-baumgartner.net/2017/09/10/how-to-install-disqus-on-hugo/
|
disqusShortname = "themefisher-template" # we use disqus to show comments in blog posts . To install disqus please follow this tutorial https://portfolio.peter-baumgartner.net/2017/09/10/how-to-install-disqus-on-hugo/
|
||||||
# disable language
|
# disable language
|
||||||
disableLanguages = [ "fr", "it"
|
disableLanguages = [ "en", "fr", "it"
|
||||||
] # example: ["fr"] for disable french language. see https://gohugo.io/content-management/multilingual/
|
] # example: ["fr"] for disable french language. see https://gohugo.io/content-management/multilingual/
|
||||||
hasCJKLanguage = false # If hasCJKLanguage true, auto-detect Chinese/Japanese/Korean Languages in the content. see: https://gohugo.io/getting-started/configuration/#hascjklanguage
|
hasCJKLanguage = false # If hasCJKLanguage true, auto-detect Chinese/Japanese/Korean Languages in the content. see: https://gohugo.io/getting-started/configuration/#hascjklanguage
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -69,11 +69,6 @@ weight = 5
|
||||||
|
|
||||||
# Footer-Menü
|
# Footer-Menü
|
||||||
|
|
||||||
[[footer]]
|
|
||||||
name = "Leistungen"
|
|
||||||
url = "leistungen/"
|
|
||||||
weight = 1
|
|
||||||
|
|
||||||
[[footer]]
|
[[footer]]
|
||||||
name = "Kontakt"
|
name = "Kontakt"
|
||||||
url = "contact/"
|
url = "contact/"
|
||||||
|
|
|
||||||
12
content/german/contact.md
Normal file
12
content/german/contact.md
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
---
|
||||||
|
title: "Kontakt"
|
||||||
|
description: ""
|
||||||
|
bg_image: ""
|
||||||
|
layout: "contact"
|
||||||
|
draft: false
|
||||||
|
|
||||||
|
############################# call to action #################################
|
||||||
|
cta:
|
||||||
|
enable : true
|
||||||
|
# call to action content comes from "_index.md"
|
||||||
|
---
|
||||||
|
|
@ -43,7 +43,7 @@ contents:
|
||||||
ATU80426326
|
ATU80426326
|
||||||
|
|
||||||
email: office@amperion.at
|
email: office@amperion.at
|
||||||
telefon: +436776209042
|
telefon: +43 677 62090425
|
||||||
############################# call to action #################################
|
############################# call to action #################################
|
||||||
cta:
|
cta:
|
||||||
enable : true
|
enable : true
|
||||||
|
|
|
||||||
43
content/german/karriere.md
Normal file
43
content/german/karriere.md
Normal file
|
|
@ -0,0 +1,43 @@
|
||||||
|
---
|
||||||
|
title: "Karriere"
|
||||||
|
slug: "karriere"
|
||||||
|
layout: "karriere"
|
||||||
|
image: "/images/karriere/karriere_hero.webp"
|
||||||
|
og_image: "/images/karriere/karriere_hero.webp"
|
||||||
|
date: 2025-01-01
|
||||||
|
draft: false
|
||||||
|
|
||||||
|
menu:
|
||||||
|
main:
|
||||||
|
name: "Karriere"
|
||||||
|
weight: 50
|
||||||
|
|
||||||
|
hero:
|
||||||
|
title: "Karriere bei AMPERION"
|
||||||
|
lead: "Du möchtest die Energiewende praktisch mitgestalten? Bei **AMPERION** bieten wir nicht nur einen Job, sondern eine Chance, Teil eines dynamischen Teams zu werden, das sich für **Innovation** und **Nachhaltigkeit** in der Energiebranche einsetzt. Wir bieten ein inspirierendes Arbeitsumfeld, in dem Kreativität und Eigeninitiative geschätzt werden, sowie vielfältige Entwicklungsmöglichkeiten für unsere Mitarbeiter.
|
||||||
|
"
|
||||||
|
|
||||||
|
values:
|
||||||
|
- title: "Innovation"
|
||||||
|
text: "Wir entwickeln praktikable Lösungen für reale Energie-Herausforderungen."
|
||||||
|
- title: "Nachhaltigkeit"
|
||||||
|
text: "Wir planen wirtschaftlich und ressourcenschonend – mit Blick auf den Lebenszyklus."
|
||||||
|
- title: "Exzellenz"
|
||||||
|
text: "Präzision, Normtreue und Transparenz in jeder Projektphase."
|
||||||
|
|
||||||
|
benefits_left:
|
||||||
|
- "Flexible Arbeitszeiten, je nach Rolle **Hybrid/Remote**"
|
||||||
|
- "**Weiterbildung** & Zertifizierungen"
|
||||||
|
- "Moderne Tools, strukturierte Prozesse, kurze Entscheidungswege"
|
||||||
|
benefits_right:
|
||||||
|
- "Eigenverantwortung & Gestaltungsspielraum in Projekten"
|
||||||
|
- "Faire Vergütung & Entwicklungsmöglichkeiten"
|
||||||
|
- "Messbarer **CO₂-Impact** in Kundenprojekten"
|
||||||
|
|
||||||
|
cta:
|
||||||
|
enable: true
|
||||||
|
cta_text: "Gestalte die Energiewende mit uns."
|
||||||
|
cta_label: "Jetzt bewerben"
|
||||||
|
cta_href: "/kontakt/"
|
||||||
|
|
||||||
|
---
|
||||||
55
content/german/pricing.md
Normal file
55
content/german/pricing.md
Normal file
|
|
@ -0,0 +1,55 @@
|
||||||
|
---
|
||||||
|
title: "Unsere Preise"
|
||||||
|
description: "this is meta description"
|
||||||
|
bg_image: ""
|
||||||
|
layout: "pricing"
|
||||||
|
draft: false
|
||||||
|
|
||||||
|
################################ pricing ################################
|
||||||
|
pricing:
|
||||||
|
enable : true
|
||||||
|
pricing_table:
|
||||||
|
# pricing table loop
|
||||||
|
- name : "Basic"
|
||||||
|
price: "$99"
|
||||||
|
content : "Perfect for single freelancers who work by themselves"
|
||||||
|
link : "#"
|
||||||
|
services:
|
||||||
|
- Unlimited agents
|
||||||
|
- 10 PSD Design
|
||||||
|
- HTML5 Markup
|
||||||
|
- Basic SEO
|
||||||
|
- Email Marketing
|
||||||
|
- 24/7 Tech Support
|
||||||
|
|
||||||
|
# pricing table loop
|
||||||
|
- name : "Premium"
|
||||||
|
price: "$199"
|
||||||
|
content : "Suitable for small businesses with up to 5 employees"
|
||||||
|
link : "#"
|
||||||
|
services:
|
||||||
|
- Unlimited agents
|
||||||
|
- 10 PSD Design
|
||||||
|
- HTML5 Markup
|
||||||
|
- Basic SEO
|
||||||
|
- Email Marketing
|
||||||
|
- 24/7 Tech Support
|
||||||
|
|
||||||
|
# pricing table loop
|
||||||
|
- name : "Advance"
|
||||||
|
price: "$299"
|
||||||
|
content : "Suitable for large businesses with unlimited employees"
|
||||||
|
link : "#"
|
||||||
|
services:
|
||||||
|
- Unlimited agents
|
||||||
|
- 10 PSD Design
|
||||||
|
- HTML5 Markup
|
||||||
|
- Basic SEO
|
||||||
|
- Email Marketing
|
||||||
|
- 24/7 Tech Support
|
||||||
|
|
||||||
|
############################# call to action #################################
|
||||||
|
cta:
|
||||||
|
enable : true
|
||||||
|
# call to action content comes from "_index.md"
|
||||||
|
---
|
||||||
|
|
@ -157,16 +157,15 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p class="form-legal">
|
<p class="form-legal">
|
||||||
<label>
|
|
||||||
<input type="checkbox" required>
|
<input type="checkbox" required>
|
||||||
Ich bin mit der Verarbeitung meiner Daten zum Zweck der Kontaktaufnahme einverstanden. (Datenschutzhinweise beachten)
|
Ich bin mit der Verarbeitung meiner Daten zum Zweck der Kontaktaufnahme einverstanden. (Datenschutzhinweise beachten)
|
||||||
</label>
|
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<button class="cta__btn" type="submit">
|
<button class="cta__btn" type="submit" style="--btn-fs:1.5rem; --btn-py:14px; --btn-px:26px;">
|
||||||
<span aria-hidden="true">➜</span><span>Nachricht senden</span>
|
<span aria-hidden="true">➜</span><span>Nachricht senden</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
{{ end }}{{ end }}
|
{{ end }}{{ end }}
|
||||||
|
|
|
||||||
188
layouts/_default/karriere.html
Normal file
188
layouts/_default/karriere.html
Normal file
|
|
@ -0,0 +1,188 @@
|
||||||
|
{{ define "main" }}
|
||||||
|
{{ partial "page-title.html" . }}
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container-wide{width:100%;max-width:1360px;margin:0 auto;padding:0 16px}
|
||||||
|
.section{padding:56px 0} .band{background:#f4f6f6}
|
||||||
|
|
||||||
|
/* HERO */
|
||||||
|
.hero-media{border-radius:14px;overflow:hidden;box-shadow:0 6px 30px rgba(0,0,0,.06)}
|
||||||
|
.hero-media img{display:block;width:100%;height:auto}
|
||||||
|
.hero-lead{opacity:.9;margin-top:.5rem}
|
||||||
|
|
||||||
|
/* Werte – Cards */
|
||||||
|
.value-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:14px;
|
||||||
|
padding:18px;text-align:center;box-shadow:0 6px 24px rgba(0,0,0,.06)}
|
||||||
|
.value-ico{width:44px;height:44px;border-radius:12px;margin:0 auto 8px;
|
||||||
|
display:flex;align-items:center;justify-content:center;
|
||||||
|
background:rgba(245,166,35,.12);color:#F5A623;line-height:0}
|
||||||
|
.value-ico svg{width:22px;height:22px;display:block}
|
||||||
|
.value-title{margin:.2rem 0 .25rem;font-weight:700}
|
||||||
|
.value-text{margin:0;opacity:.9}
|
||||||
|
|
||||||
|
/* Benefits – Ticks in 2 Spalten */
|
||||||
|
.val-list{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
|
||||||
|
.tick{display:flex;gap:.6rem;align-items:flex-start}
|
||||||
|
.tick svg{flex:0 0 20px;margin-top:2px;color:#F5A623}
|
||||||
|
|
||||||
|
/* kleine Helfer */
|
||||||
|
[data-reveal]{opacity:0;transform:translateY(12px);transition:opacity .5s, transform .5s}
|
||||||
|
[data-reveal].is-visible{opacity:1;transform:none}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<!-- ========= HERO ========= -->
|
||||||
|
{{ $h := .Params.hero }}
|
||||||
|
{{ $img := or (and $h $h.image) .Params.image }}
|
||||||
|
{{ $alt := or (and $h $h.image_alt) (printf "Arbeiten bei %s" .Site.Title) }}
|
||||||
|
|
||||||
|
<section class="section">
|
||||||
|
<div class="container-wide">
|
||||||
|
<div class="row align-items-center gx-5 gy-4">
|
||||||
|
<div class="col-lg-7" data-reveal>
|
||||||
|
<h2>
|
||||||
|
{{ if $h }}
|
||||||
|
{{ with $h.title }}{{ . }}{{ else }}Karriere bei {{ $.Site.Title }}{{ end }}
|
||||||
|
{{ else }}
|
||||||
|
Karriere bei {{ .Site.Title }}
|
||||||
|
{{ end }}
|
||||||
|
</h2>
|
||||||
|
{{ with $h }}{{ with .lead }}
|
||||||
|
<div class="hero-lead">{{ . | markdownify }}</div>
|
||||||
|
{{ end }}{{ end }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-lg-5" data-reveal>
|
||||||
|
{{ with $img }}
|
||||||
|
<figure class="hero-media">
|
||||||
|
<img src="{{ . | relURL }}" alt="{{ $alt }}" width="1200" height="800" loading="eager">
|
||||||
|
</figure>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- ========= UNSERE WERTE (Cards) ========= -->
|
||||||
|
{{ with .Params.values }}
|
||||||
|
<section class="section band">
|
||||||
|
<div class="container-wide">
|
||||||
|
<h2 class="mb-3">Unsere Werte</h2>
|
||||||
|
<div class="row g-4">
|
||||||
|
{{ range $i, $v := . }}
|
||||||
|
<div class="col-md-4" data-reveal>
|
||||||
|
<article class="value-card">
|
||||||
|
<div class="value-ico" aria-hidden="true">
|
||||||
|
{{/* simple Icon-Rotation */}}
|
||||||
|
{{ if eq (mod $i 3) 0 }}
|
||||||
|
<!-- target -->
|
||||||
|
<svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="9" fill="currentColor" opacity=".14"/><circle cx="12" cy="12" r="6" fill="none" stroke="currentColor" stroke-width="1.5"/><circle cx="12" cy="12" r="2" fill="currentColor"/></svg>
|
||||||
|
{{ else if eq (mod $i 3) 1 }}
|
||||||
|
<!-- badge -->
|
||||||
|
<svg viewBox="0 0 24 24"><circle cx="12" cy="9" r="5" fill="currentColor" opacity=".18"/><circle cx="12" cy="9" r="5" fill="none" stroke="currentColor" stroke-width="1.5"/><path d="M8 14l-2 7 6-3 6 3-2-7" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/></svg>
|
||||||
|
{{ else }}
|
||||||
|
<!-- shield -->
|
||||||
|
<svg viewBox="0 0 24 24"><path d="M12 3l7 3v6c0 5-3.6 9.4-7 10-3.4-.6-7-5-7-10V6l7-3z" fill="currentColor" opacity=".14"/><path d="M12 3l7 3v6c0 5-3.6 9.4-7 10-3.4-.6-7-5-7-10V6l7-3z" fill="none" stroke="currentColor" stroke-width="1.5"/></svg>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
<h3 class="value-title">{{ $v.title }}</h3>
|
||||||
|
<p class="value-text">{{ $v.text }}</p>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<!-- ========= WAS WIR BIETEN ========= -->
|
||||||
|
<section class="section">
|
||||||
|
<div class="container-wide">
|
||||||
|
<h2 class="mb-3">Was wir bieten</h2>
|
||||||
|
<div class="row g-4">
|
||||||
|
<div class="col-md-6" data-reveal>
|
||||||
|
<ul class="val-list">
|
||||||
|
{{ range .Params.benefits_left }}
|
||||||
|
<li class="tick">
|
||||||
|
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true"><path d="M20 6L9 17l-5-5" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>
|
||||||
|
<span>{{ . | markdownify }}</span>
|
||||||
|
</li>
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-6" data-reveal>
|
||||||
|
<ul class="val-list">
|
||||||
|
{{ range .Params.benefits_right }}
|
||||||
|
<li class="tick">
|
||||||
|
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true"><path d="M20 6L9 17l-5-5" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg>
|
||||||
|
<span>{{ . | markdownify }}</span>
|
||||||
|
</li>
|
||||||
|
{{ end }}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- CALL TO ACTION -->
|
||||||
|
{{ $impressum := site.GetPage "page" "impressum" }}
|
||||||
|
{{ $ctaEnabled := or (and .Params.cta .Params.cta.enable) (or .Params.cta_text .Params.cta_label) }}
|
||||||
|
{{ if $ctaEnabled }}
|
||||||
|
<section id="cta" class="cta">
|
||||||
|
<div class="cta__bg" aria-hidden="true">
|
||||||
|
<div class="cta__grid"></div>
|
||||||
|
<div class="cta__energy-lines">
|
||||||
|
<div class="energy-line-h energy-line-h1"></div>
|
||||||
|
<div class="energy-line-h energy-line-h2"></div>
|
||||||
|
<div class="energy-line-v energy-line-v1"></div>
|
||||||
|
<div class="energy-line-v energy-line-v2"></div>
|
||||||
|
<div class="energy-node energy-node1"></div>
|
||||||
|
<div class="energy-node energy-node2"></div>
|
||||||
|
</div>
|
||||||
|
<div class="cta__gradient-top"></div>
|
||||||
|
<div class="cta__gradient-bottom"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="my-container">
|
||||||
|
<div class="cta__wrap" data-reveal>
|
||||||
|
<h2 class="cta__title">
|
||||||
|
{{ .Params.cta_text | default "Gestalte die Energiewende mit uns." }}
|
||||||
|
</h2>
|
||||||
|
{{ with .Params.subtitle }}<p class="cta__lead">{{ . }}</p>{{ else }}
|
||||||
|
<p class="cta__lead">Wir freuen uns über deine Initiativbewerbung!</p>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<div class="cta__actions">
|
||||||
|
{{ with .Params.cta_label }}
|
||||||
|
<a class="cta__btn" href="{{ ($.Params.cta_href | default "/kontakt/") | relURL }}">
|
||||||
|
<span aria-hidden="true">⚡</span><span>{{ . }}</span>
|
||||||
|
</a>
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ if $impressum }}
|
||||||
|
<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>
|
||||||
|
{{ end }}
|
||||||
|
</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 }}
|
||||||
|
|
||||||
|
|
||||||
|
<script>
|
||||||
|
(function(){
|
||||||
|
if (window.__careerRevealInit) return; window.__careerRevealInit = true;
|
||||||
|
var els = document.querySelectorAll("[data-reveal]");
|
||||||
|
if(!('IntersectionObserver' in window)){ els.forEach(e=>e.classList.add('is-visible')); return; }
|
||||||
|
var io = new IntersectionObserver(function(es){ es.forEach(function(e){ if(e.isIntersecting){ e.target.classList.add('is-visible'); io.unobserve(e.target); } }); },{threshold:.12});
|
||||||
|
els.forEach(e=>io.observe(e));
|
||||||
|
})();
|
||||||
|
</script>
|
||||||
|
|
||||||
|
{{ end }}
|
||||||
|
|
@ -329,8 +329,6 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{{/* Fallback/Ergänzung: direkte Kontaktwege aus Impressum */}}
|
{{/* Fallback/Ergänzung: direkte Kontaktwege aus Impressum */}}
|
||||||
{{ if $impressum }}
|
{{ if $impressum }}
|
||||||
<a class="cta__btn" href="mailto:{{ $impressum.Params.email }}">
|
<a class="cta__btn" href="mailto:{{ $impressum.Params.email }}">
|
||||||
|
|
|
||||||
|
|
@ -3141,7 +3141,7 @@ body {
|
||||||
/* vorher 1.8–2.5rem -> jetzt kompakter */
|
/* vorher 1.8–2.5rem -> jetzt kompakter */
|
||||||
--btn-px: clamp(1rem, 1.6vw, 1.5rem);
|
--btn-px: clamp(1rem, 1.6vw, 1.5rem);
|
||||||
/* vorher 1.8–2.5rem -> schmaler */
|
/* vorher 1.8–2.5rem -> schmaler */
|
||||||
--btn-fs: clamp(1.5rem, 1.15vw, 1.5rem);
|
--btn-fs: clamp(1.8rem, 1.6vw, 2.5rem);
|
||||||
/* vorher 1.8–2.5rem -> p-nahe Größe */
|
/* vorher 1.8–2.5rem -> p-nahe Größe */
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
@ -3362,47 +3362,54 @@ body {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 2; }
|
z-index: 2; }
|
||||||
|
|
||||||
.cta__btn {
|
.cta__btn,
|
||||||
|
button.cta__btn {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: .7rem;
|
gap: .7rem;
|
||||||
padding: var(--btn-py) var(--btn-px);
|
padding: var(--btn-py, 12px) var(--btn-px, 22px);
|
||||||
/* nutzt die kleineren Presets oben */
|
|
||||||
border-radius: 9999px;
|
border-radius: 9999px;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
color: var(--cta-primary);
|
color: var(--cta-primary, #0a8f8d);
|
||||||
border: 1px solid rgba(0, 0, 0, 0.06);
|
border: 1px solid rgba(0, 0, 0, 0.06);
|
||||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
font-size: var(--btn-fs);
|
font-size: var(--btn-fs, 1rem);
|
||||||
/* nutzt die kleinere Schrift */
|
|
||||||
transition: background .15s ease, color .15s ease, box-shadow .2s ease, transform .04s ease;
|
transition: background .15s ease, color .15s ease, box-shadow .2s ease, transform .04s ease;
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden; }
|
overflow: hidden;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
/* wichtig bei <button> */ }
|
||||||
|
|
||||||
.cta__btn::before {
|
.cta__btn::before {
|
||||||
content: '';
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
width: 0;
|
width: 0;
|
||||||
height: 0;
|
height: 0;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background: var(--cta-accent);
|
background: var(--cta-accent, #F5A623);
|
||||||
transform: translate(-50%, -50%);
|
transform: translate(-50%, -50%);
|
||||||
transition: width 0.6s ease, height 0.6s ease;
|
transition: width .6s ease, height .6s ease;
|
||||||
z-index: -1; }
|
z-index: -1; }
|
||||||
|
|
||||||
.cta__btn:hover {
|
.cta__btn:hover {
|
||||||
background: var(--cta-accent);
|
background: var(--cta-accent, #F5A623);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
box-shadow: 0 8px 22px rgba(245, 166, 35, 0.35); }
|
box-shadow: 0 8px 22px rgba(245, 166, 35, 0.35); }
|
||||||
|
|
||||||
.cta__btn:hover::before {
|
.cta__btn:hover::before {
|
||||||
width: 300%;
|
width: 300%;
|
||||||
height: 300%; }
|
height: 300%; }
|
||||||
|
|
||||||
.cta__btn:active {
|
.cta__btn:active {
|
||||||
transform: translateY(1px); }
|
transform: translateY(1px); }
|
||||||
|
|
||||||
.cta__btn:focus-visible {
|
.cta__btn:focus-visible {
|
||||||
outline: 2px dashed var(--cta-accent);
|
outline: 2px dashed var(--cta-accent, #F5A623);
|
||||||
outline-offset: 3px; }
|
outline-offset: 3px; }
|
||||||
|
|
||||||
/* Social-Icons (etwas größer, Teal-Hover) */
|
/* Social-Icons (etwas größer, Teal-Hover) */
|
||||||
|
|
|
||||||
BIN
static/images/karriere/karriere_hero.webp
Normal file
BIN
static/images/karriere/karriere_hero.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 181 KiB |
|
|
@ -1,80 +0,0 @@
|
||||||
{{ define "main" }}
|
|
||||||
|
|
||||||
{{ partial "page-title.html" . }}
|
|
||||||
|
|
||||||
<section class="contact-form">
|
|
||||||
<div class="container">
|
|
||||||
{{ with site.Params.contact.form }}{{ if .enable -}}
|
|
||||||
<div class="row">
|
|
||||||
<form method="POST" {{ if .use_netlify }}name="{{ printf "contact_%s" $.Language.Lang }}" action="{{ "/message_sent" | relLangURL }}" netlify netlify-honeypot="nhp"{{ else }}name="contact" action="{{ .action | safeURL }}"{{ end }}>
|
|
||||||
<div class="col-md-6 col-sm-12">
|
|
||||||
<div class="block">
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="name" hidden>{{ i18n "contact_form_name" }}</label>
|
|
||||||
<input id="name" name="name" type="text" class="form-control" placeholder="{{ i18n "contact_form_name" }}" required>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="email" hidden>{{ i18n "contact_form_email" }}</label>
|
|
||||||
<input id="email" name="email" type="email" autocomplete="email" class="form-control" placeholder="{{ i18n "contact_form_email" }}" required>
|
|
||||||
</div>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="subject" hidden>{{ i18n "contact_form_subject" }}</label>
|
|
||||||
<input id="subject" name="subject" type="text" class="form-control" placeholder="{{ i18n "contact_form_subject" }}" required>
|
|
||||||
</div>
|
|
||||||
{{ if .use_netlify -}}
|
|
||||||
<div class="form-group-h">
|
|
||||||
<input name="nhp" type="text" class="form-control" placeholder="Are you made of flesh and bone?">
|
|
||||||
</div>
|
|
||||||
{{- end }}
|
|
||||||
{{ if .use_recaptcha -}}
|
|
||||||
<div class="form-group-h">
|
|
||||||
<input type="hidden" id="captchaResponse" name="g-recaptcha-response">
|
|
||||||
</div>
|
|
||||||
{{- end }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="col-md-6 col-sm-12">
|
|
||||||
<div class="block">
|
|
||||||
<div class="form-group-2">
|
|
||||||
<label for="message" hidden>{{ i18n "contact_form_message" }}</label>
|
|
||||||
<textarea id="message" name="message" class="form-control" rows="4" placeholder="{{ i18n "contact_form_message" }}" required></textarea>
|
|
||||||
</div>
|
|
||||||
<button class="btn btn-default" type="submit">{{ i18n "submit" }}</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
{{- end }}{{ end }}
|
|
||||||
<div class="contact-box row">
|
|
||||||
{{ with site.Params.contact -}}
|
|
||||||
<div class="col-md-6 col-sm-12">
|
|
||||||
<div class="block">
|
|
||||||
<h2>{{ i18n "address_title" }}</h2>
|
|
||||||
<ul class="address-block">
|
|
||||||
{{ $add_address_descriptors := .address_descriptors }}
|
|
||||||
{{ with site.Params.location }}<li><i class="fas fa-map-marker-alt"></i>{{ if $add_address_descriptors }}{{ i18n "location" | printf "%s: " }}{{ end }}<div>{{ . | markdownify }}</div></li>{{ end }}
|
|
||||||
{{ with site.Params.email }}<li><i class="fas fa-envelope"></i>{{ if $add_address_descriptors }}{{ i18n "email" | printf "%s: " }}{{ end }}{{ partial "cloak_email" . }}</li>{{ end }}
|
|
||||||
{{ with site.Params.phone }}<li><i class="fas fa-tty"></i>{{ if $add_address_descriptors }}{{ i18n "phone" | printf "%s: " }}{{ end }}{{ . }}</li>{{ end }}
|
|
||||||
</ul>
|
|
||||||
<ul class="social-icons">
|
|
||||||
{{ range site.Params.social -}}
|
|
||||||
<li><a href="{{ .link | safeURL }}"><i class="{{ .icon }}"></i></a></li>
|
|
||||||
{{- end }}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{{- end }}
|
|
||||||
{{ if site.Params.gmap.enable -}}
|
|
||||||
<div class="col-md-6 col-sm-12">
|
|
||||||
<div class="block">
|
|
||||||
<div class="google-map">
|
|
||||||
<div class="map" id="map" data-latitude="{{ site.Params.gmap.map_latitude }}" data-longitude="{{ site.Params.gmap.map_longitude }}" data-marker="{{ site.Params.gmap.map_marker | relURL }}" data-marker-name="{{ site.Title }}"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{{- end }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
{{ end }}
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue