markus/AMPERION_Webpage
1
0
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor layout and styles for content section to improve alignment and responsiveness

Browse source
This commit is contained in:
astosic 2025-08-08 13:32:21 +02:00
parent 53eff1def7
commit d9e98dcf01
1 changed files with 9 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

15
layouts/index.html
View file

@ -219,19 +219,20 @@ document.addEventListener('DOMContentLoaded', function () {
</div> </div>
<!-- Inhalt --> <!-- Inhalt -->
<div class="row mt-4"> <div class="row mt-4 d-flex align-items-stretch" style="min-height: 400px;">
<!-- Textbereich --> <!-- Textbereich -->
<div class="col-md-9 col-sm-12" data-aos="fade-right" data-aos-delay="200"> <div class="col-md-7 col-sm-12 d-flex h-100" data-aos="fade-right" data-aos-delay="200">
<div class="text-left"> <div class="text-left w-100 my-auto"> <!-- vertikal zentriert -->
{{ with .content }}{{ . | markdownify }}{{ end }} {{ with .content }}{{ . | markdownify }}{{ end }}
</div> </div>
</div> </div>
<!-- Bildbereich --> <!-- Bildbereich -->
<div class="col-md-3 col-sm-12" data-aos="zoom-in" data-aos-delay="300"> <div class="col-md-5 col-sm-12 d-flex h-100" data-aos="zoom-in" data-aos-delay="300">
<div class="block text-center"> <div class="w-100 d-flex align-items-end" style="padding-top: 30px;"> <!-- Bild etwas nach unten -->
<img src="{{ .image | relURL }}" class="custom-image" alt="Über AMPERION Bild"> <img src="{{ .image | relURL }}" class="custom-image" alt="Über AMPERION Bild"
style="width: 100%; height: auto; object-fit: contain;">
</div> </div>
</div> </div>
@ -242,6 +243,8 @@ document.addEventListener('DOMContentLoaded', function () {
{{ end }} {{ end }}
<!-- CALL TO ACTION --> <!-- CALL TO ACTION -->
{{ if .Params.cta.enable }} {{ if .Params.cta.enable }}
{{ partial "cta.html" . }} {{ partial "cta.html" . }}