dm/fuz-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Hero, zmiana wielu h2 na

Browse Source
This commit is contained in:
dm
2025-11-21 04:59:59 +01:00
parent c5c757f3de
commit 5b4d8f0654
2 changed files with 26 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/hero/Hero.astro
View File

@@ -29,18 +29,22 @@ const {
} }
<!-- Podtytuły (lista) --> <!-- Podtytuły (lista) -->
{subtitle && ( {subtitle && Array.isArray(subtitle) && (
Array.isArray(subtitle) <div class="fuz-hero-subtitles">
? (
<div class="fuz-hero-subtitles"> <!-- Pierwszy: H2 -->
{subtitle.map((line, i) => ( <h2 class="fuz-hero-subtitle" style={`--delay:0`}>
<h2 class="fuz-hero-subtitle" style={`--delay:${i}`}>{line}</h2> {subtitle[0]}
))} </h2>
</div>
) <!-- Reszta: <p> (dla SEO najlepsze) -->
: ( {subtitle.slice(1).map((line, i) => (
<h2 class="fuz-hero-subtitle">{subtitle}</h2> <p class="fuz-hero-subline" style={`--delay:${i + 1}`}>
) {line}
</p>
))}
</div>
)} )}
<!-- Opis --> <!-- Opis -->

10
src/styles/hero.css
View File

@@ -35,8 +35,16 @@
animation-fill-mode: forwards; animation-fill-mode: forwards;
/* Opóźnienie zależne od numeru elementu */ /* Opóźnienie zależne od numeru elementu */
animation-delay: calc(var(--delay) * 0.3s); /* animation-delay: calc(var(--delay) * 0.3s); */
} }
.fuz-hero-subline {
@apply text-xl md:text-4xl font-semibold mb-2 opacity-0;
color: var(--fuz-text-subtle);
animation: fade-in 0.3s ease-out forwards;
animation-delay: calc(var(--delay) * 0.4s);
}
.fuz-hero-description { .fuz-hero-description {
@apply max-w-6xl mx-auto text-lg md:text-xl my-6 leading-relaxed; @apply max-w-6xl mx-auto text-lg md:text-xl my-6 leading-relaxed;
color: var(--fuz-text-subtle); color: var(--fuz-text-subtle);