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

Refactor typography styles for improved readability and layout consistency

Browse source
This commit is contained in:
astosic 2025-07-31 15:11:52 +02:00
parent ba53804650
commit 421ecc1d2a
4 changed files with 98 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

45
layouts/partials/page-title.html
View file

@ -1,21 +1,40 @@
<section class="page-title gif-background" style="position: relative; padding: 64px 0 40px;">
<!-- Transparenter Overlay für bessere Lesbarkeit -->
<div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;
background: rgba(0, 0, 0, 0.4); z-index: 1;"></div>
<div class="container" style="position: relative; z-index: 2;">
<section class="page-title gif-background">
<div class="container1">
<div class="row">
<div class="col-md-12 text-center">
<h1 style="color: white; font-weight: 600; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); margin-bottom: 0;">
{{ .Title }}
</h1>
<div class="servie-title fade-in">
<h1>{{ .Title }}</h1>
</div>
{{ with .Params.description }}
<h2 style="color: white; font-weight: 400; text-shadow: 1px 1px 3px rgba(0,0,0,0.4); margin-top: 0;">
{{ . | markdownify }}
</h2>
</div>
{{ end }}
</div>
</div>
</div>
</section>
<style>
.fade-in {
animation: fadeInUp 1s ease-out
}
.container1 {
position: relative;
z-index: 2;
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
</style>