diff --git a/public/client-assets/home-hero-cave-lanterns.webp b/public/client-assets/home-hero-cave-lanterns.webp new file mode 100644 index 0000000..a924042 Binary files /dev/null and b/public/client-assets/home-hero-cave-lanterns.webp differ diff --git a/public/client-assets/home-hero-huangguoshu-hiker.webp b/public/client-assets/home-hero-huangguoshu-hiker.webp new file mode 100644 index 0000000..25c3948 Binary files /dev/null and b/public/client-assets/home-hero-huangguoshu-hiker.webp differ diff --git a/public/client-assets/home-hero-mountain-village.webp b/public/client-assets/home-hero-mountain-village.webp new file mode 100644 index 0000000..44aa84e Binary files /dev/null and b/public/client-assets/home-hero-mountain-village.webp differ diff --git a/public/client-assets/home-hero-waterfall-scale.webp b/public/client-assets/home-hero-waterfall-scale.webp new file mode 100644 index 0000000..25d6db8 Binary files /dev/null and b/public/client-assets/home-hero-waterfall-scale.webp differ diff --git a/src/TravelSite.tsx b/src/TravelSite.tsx index 0c6fde3..cc9525e 100644 --- a/src/TravelSite.tsx +++ b/src/TravelSite.tsx @@ -2523,15 +2523,32 @@ function HomePage() { const home = content.home; const heroSlides = useMemo( () => [ - '/client-assets/atlas-hero-waterfall.webp', - '/client-assets/hero-real-travelers.webp', - '/client-assets/hero-miao-home-meal.webp', + { + source: '/client-assets/home-hero-huangguoshu-hiker.webp', + alt: { zh: '黄果树瀑布前的贵州徒步旅行者', en: 'A traveler hiking in front of Huangguoshu Waterfall' }, + position: 'center 52%', + }, + { + source: '/client-assets/home-hero-waterfall-scale.webp', + alt: { zh: '贵州巨型瀑布前的旅行者', en: 'A traveler beneath a monumental Guizhou waterfall' }, + position: 'center 57%', + }, + { + source: '/client-assets/home-hero-mountain-village.webp', + alt: { zh: '贵州山谷中的传统村寨', en: 'A traditional village in a Guizhou mountain valley' }, + position: 'center 50%', + }, + { + source: '/client-assets/home-hero-cave-lanterns.webp', + alt: { zh: '贵州洞穴水面上的灯火与游船', en: 'Lantern light and boats inside a Guizhou cave' }, + position: 'center 52%', + }, ], [], ); const [heroIndex, setHeroIndex] = useState(0); const [heroPaused, setHeroPaused] = useState(false); - const activeHero = heroSlides[heroIndex % heroSlides.length] || home.hero.imageUrl; + const activeHero = heroSlides[heroIndex % heroSlides.length]; useGSAP( () => { @@ -2650,7 +2667,7 @@ function HomePage() {
- {language + {activeHero.alt[language]}
{pickText('贵州 · 中国西南', 'Guizhou · Southwest China', language)}
@@ -2671,7 +2688,7 @@ function HomePage() { aria-label={language === 'zh' ? `查看第 ${index + 1} 张首屏图` : `Show hero slide ${index + 1}`} aria-current={index === heroIndex ? 'true' : undefined} onClick={() => setHeroIndex(index)} - key={slide} + key={slide.source} /> ))}