Finn/talk-pro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(feat): add locales and refine responsive landing page UI

Browse Source
This commit is contained in:
SeekingGamer
2026-05-15 12:11:50 +08:00
parent ce1095088d
commit ff7e4395ea
22 changed files with 1315 additions and 289 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/DownloadCTA.astro
View File

@@ -36,7 +36,9 @@ const phoneArt = "/assets/cta-phone-art.png";
<div class="store-badges">
<div class="store-badge store-badge--android">
<img alt={t.androidAlt} class="store-badge__icon" src={androidIcon} />
<div class="store-badge__icon-frame">
<img alt={t.androidAlt} class="store-badge__android-icon" src={androidIcon} />
</div>
<div class="store-badge__copy">
<p class="store-badge__platform">{t.android}</p>
<p class="store-badge__label">{t.androidCta}</p>

25
src/components/Hero.astro
View File

@@ -3,11 +3,14 @@ import type { Translations } from '../i18n/translations'
export interface Props {
t: Translations['hero']
download: Translations['download']
}
const { t } = Astro.props
const { t, download } = Astro.props
const heroBg = "/assets/hero-bg.png";
const phoneMockup = "/assets/hero-phone.png";
const androidIcon = "/assets/cta-android-icon.svg";
const appleIcon = "/assets/cta-apple-icon.svg";
---
<section id="hero" class="hero">
@@ -36,11 +39,23 @@ const phoneMockup = "/assets/hero-phone.png";
{t.description}
</p>
<div class="hero__actions">
<a href="#download" class="hero__button hero__button--primary">
<span class="hero__button-label">{t.download}</span>
<a href="#download" class="store-badge store-badge--android hero__store-badge">
<div class="store-badge__icon-frame">
<img alt={download.androidAlt} class="store-badge__android-icon" src={androidIcon} />
</div>
<div class="store-badge__copy">
<p class="store-badge__platform">{download.android}</p>
<p class="store-badge__label">{download.androidCta}</p>
</div>
</a>
<a href="#features" class="hero__button hero__button--secondary">
<span class="hero__button-label">{t.explore}</span>
<a href="#download" class="store-badge store-badge--ios hero__store-badge">
<div class="store-badge__icon-frame">
<img alt={download.appleAlt} class="store-badge__apple-icon" src={appleIcon} />
</div>
<div class="store-badge__copy">
<p class="store-badge__platform">{download.ios}</p>
<p class="store-badge__label">{download.iosCta}</p>
</div>
</a>
</div>
</div>