lapikud/tipilan
3
0
Fork 0
mirror of https://github.com/Lapikud/tipilan.git synced 2026-05-08 10:00:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add hero pictures in teasre carosel

Browse Source
This commit is contained in:
Rene Arumetsa
2026-04-30 16:18:53 +03:00
parent d20cdc6b98
commit 81de01fab8
1 changed files with 13 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/TeaserCarousel.tsx
View File

@@ -10,13 +10,14 @@ type Slide = {
key: "compete" | "play" | "explore"; key: "compete" | "play" | "explore";
image: string; image: string;
imageAlt: string; imageAlt: string;
hero: string;
href: "/turniirid" | "/piletid" | "/messiala"; href: "/turniirid" | "/piletid" | "/messiala";
}; };
const slides: Slide[] = [ const slides: Slide[] = [
{ key: "compete", image: "/images/landing/compete_teaser.jpg", imageAlt: "Võistle", href: "/turniirid" }, { key: "compete", image: "/images/landing/compete_teaser.jpg", imageAlt: "Võistle", hero: "/images/landing/compete_hero.png", href: "/turniirid" },
{ key: "play", image: "/images/landing/play_teaser.png", imageAlt: "Mängi", href: "/piletid" }, { key: "play", image: "/images/landing/play_teaser.png", imageAlt: "Mängi", hero: "/images/landing/play_hero.png", href: "/piletid" },
{ key: "explore", image: "/images/landing/explore_teaser.png", imageAlt: "Avasta", href: "/messiala" }, { key: "explore", image: "/images/landing/explore_teaser.png", imageAlt: "Avasta", hero: "/images/landing/explore_hero.png", href: "/messiala" },
]; ];
export default function TeaserCarousel() { export default function TeaserCarousel() {
@@ -73,8 +74,15 @@ export default function TeaserCarousel() {
</p> </p>
)} )}
</div> </div>
{/* Right side: image shows through */} {/* Right side: hero image */}
<div className="hidden md:block" /> <div className="hidden md:flex items-end justify-center relative">
<Image
src={slide.hero}
alt={slide.imageAlt}
fill
className="object-contain object-bottom"
/>
</div>
</div> </div>
</div> </div>
); );