3024588
/
trihub-ernaehrung-advinters
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

banner ausrichtung für alle 3 seiten behoben

V-S-US-01-03-Pakete-Online-buchen
Vincent Laux 2026-09-30 16:33:17 +02:00
parent 6c9133edf9
commit 33698b11b0
4 changed files with 21 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
css/paketdetails.css
View File

@ -211,7 +211,8 @@
}
/* Das Hintergrundbild erstreckt sich vollflächig über den gesamten Hero-Bereich */
/* Das Hintergrundbild erstreckt sich vollflächig über den gesamten Hero-Bereich
Das ist die Standardausrichtung für für die Banner */
.paket-detail__hero .hero__image {
position: absolute;
inset: 0;
@ -221,6 +222,20 @@
object-position: right top; /* Bildschwerpunkt rechts ausrichten */
z-index: -2;
}
/* Starter-Paket Ausrichtung*/
body.paket-starter .hero__image {
object-position: right top;
}
/* 2. Standard-Paket */
body.paket-standard .hero__image {
object-position: 60% 30%;
}
/* 3. Premium-Paket */
body.paket-premium .hero__image {
object-position: 30% center;
}
.paket-detail__hero::after {
position: absolute;

6
html/paket-PREMIUM.html
View File

@ -17,7 +17,7 @@
<script src="../js/navigation.js" defer></script>
</head>
<body>
<body class="paket-premium">
<!-- Gemeinsame Navigation -->
<header class="site-navigation">
<div class="site-navigation__bar">
@ -50,10 +50,10 @@
<!-- Einstieg / Hero -->
<section class="produktuebersicht paket-detail__hero" aria-labelledby="paket-title">
<div class="hero">
<img class="hero__image" src="../images/paket-starter.jpg" alt="Zwei ältere Sportler besprechen ihren Ernährungsplan neben einem Fahrrad am See." width="1200" height="800" fetchpriority="high">
<img class="hero__image" src="../images/paket-premium.jpg" alt="Zwei ältere Sportler besprechen ihren Ernährungsplan neben einem Fahrrad am See." width="1200" height="800" fetchpriority="high">
<div class="container hero__inner">
<div class="hero__content">
<p class="hero__eyebrow">Ernährungsberatung · Starter</p>
<p class="hero__eyebrow">Ernährungsberatung · Premium</p>
<h1 id="paket-title">Dein erster Schritt.<span>Gut versorgt starten.</span></h1>
<p class="hero__description">Du möchtest deine Ernährung bewusster auf dein Training abstimmen? Wir begleiten deinen Einstieg – mit einem persönlichen Gespräch, einem Plan für dich und konkreten Ideen für deinen Alltag.</p>
<div class="paket-detail__actions">

2
html/paket-STANDARD.html
View File

@ -17,7 +17,7 @@
<script src="../js/navigation.js" defer></script>
</head>
<body>
<body class="paket-standard">
<!-- Gemeinsame Navigation -->
<header class="site-navigation">
<div class="site-navigation__bar">

2
html/paket-starter.html
View File

@ -17,7 +17,7 @@
<script src="../js/navigation.js" defer></script>
</head>
<body>
<body class="paket-starter">
<!-- Gemeinsame Navigation -->
<header class="site-navigation">
<div class="site-navigation__bar">