Small mobile responsiveness changes, few lines in translation changed for better CTA

This commit is contained in:
AlacrisDevs
2026-03-26 10:43:13 +02:00
parent 8705551269
commit 90f6bdc300
5 changed files with 9 additions and 8 deletions

View File

@@ -5,7 +5,7 @@ import Image from "next/image";
import { useTranslations } from "next-intl";
import { SLIDES, type CarouselSlide } from "./constants";
import { BLUR_PLACEHOLDERS } from "@/lib/blurPlaceholders";
import {gray} from "next/dist/lib/picocolors";
import { gray } from "next/dist/lib/picocolors";
function blurKey(src: string) {
return src.replace('/images/', '').replace(/\.\w+$/, '');
@@ -116,7 +116,7 @@ export default function CarouselSection({ sectionRef }: CarouselSectionProps) {
{/* Mobile: stacked slides, no hero images, no transitions */}
<div className="lg:hidden">
{SLIDES.map((slide, i) => (
<div key={i} className="relative w-full h-[60vw] min-h-[320px] overflow-hidden border-t-4 border-primary-50">
<div key={i} className="relative w-full overflow-hidden border-t-4 border-primary-50">
<Image
src={slide.bgImage}
alt=""
@@ -127,7 +127,7 @@ export default function CarouselSection({ sectionRef }: CarouselSectionProps) {
sizes="100vw"
className="object-cover pointer-events-none"
/>
<div className="relative z-1 flex flex-col gap-4 justify-end h-full p-6 pb-12">
<div className="relative z-1 flex flex-col gap-4 py-16 px-6">
<h3 className="text-h1 text-text-light text-shadow-teaser">{t(slide.titleKey)}</h3>
<p className="text-p-lg text-text-light max-w-[500px]">{t(slide.descKey)}</p>
</div>

View File

@@ -62,7 +62,7 @@ export default function EndSection() {
/>
<div className="relative z-1 flex flex-col items-center justify-center h-full gap-8 xl:gap-16 2xl:gap-32 p-6 lg:p-12 xl:p-16">
{/* Ticket stats */}
<div className="flex gap-6 xl:gap-12 text-center text-text-light">
<div className="flex flex-col xl:flex-row gap-6 xl:gap-12 text-center text-text-light">
<CountUpStat end={0} suffix="€" label={t("teaser.tickets.earlyVisitor")} />
<CountUpStat end={0} suffix="€" label={t("teaser.tickets.supporter")} />
</div>
@@ -95,7 +95,7 @@ export default function EndSection() {
/>
<div className="relative z-1 flex flex-col items-center justify-center h-full gap-8 xl:gap-16 2xl:gap-32 p-6 lg:p-12 xl:p-16">
{/* Sponsor stats */}
<div className="flex gap-6 xl:gap-12 text-center text-text-light">
<div className="flex flex-col xl:flex-row gap-6 xl:gap-12 text-center text-text-light">
<CountUpStat end={900} suffix="+" label={t("teaser.sponsors.visitors")} />
<CountUpStat end={10000} suffix="+" label={t("teaser.sponsors.streamViewers")} format={formatK} />
</div>
@@ -104,7 +104,7 @@ export default function EndSection() {
<h2 className="text-h1 text-text-light text-center text-shadow-teaser">
{t("teaser.sponsors.cta")}
</h2>
<a href="mailto:tipilan@ituk.ee" className="btn-primary-lg text-btn-lg hover:opacity-80">
<a href="mailto:tipilan@ituk.ee" className="btn-primary-lg text-btn-lg hover:opacity-80" style={{ backgroundColor: "#FFAB00", color: "#1a1a1a" }}>
{t("teaser.sponsors.contactButton")}
</a>
</div>

View File

@@ -95,6 +95,7 @@ export default function HeroSection({ onScrollDown }: HeroSectionProps) {
<a
href="mailto:tipilan@ituk.ee"
className="btn-primary-lg text-btn-lg hover:opacity-80 text-center"
style={{ backgroundColor: "#FFAB00", color: "#1a1a1a" }}
>
{t("teaser.sponsors.contactButton")}
</a>

View File

@@ -32,7 +32,7 @@
"visitors": "TipiLAN 2025\nvisitor count",
"streamViewers": "2025 livestream\nviewer count",
"cta": "Bring your booth to our expo area!",
"contactButton": "Write to us"
"contactButton": "Partner with us"
},
"footer": {
"organization": "MTÜ FOR Tsükkel",

View File

@@ -32,7 +32,7 @@
"visitors": "TipiLAN 2025\nkülastajate arv",
"streamViewers": "2025 otseülekande\nvaatajate arv",
"cta": "Tule oma boksiga meie messialale!",
"contactButton": "Kirjuta meile"
"contactButton": "Tule partneriks"
},
"footer": {
"organization": "MTÜ FOR Tsükkel",