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

Compare commits

base: Finn:1de7b09ceb322ab621a7817fdd17b11eb63d78fd
Branches Tags
Finn:main Finn:finn-staging
..
compare: Finn:main
Branches Tags
Finn:main Finn:finn-staging

5 Commits
1de7b09ceb ... main

Author SHA1 Message Date
SeekingGamer
f3ee755f47 fix(docs): Update Readme.md
All checks were successful
Deploy to talkpro / build-and-sync (push) Successful in 29s
Details
2026-05-21 10:19:30 +08:00
SeekingGamer
f8d97f46c5 Update Base.astro with new js
All checks were successful
Deploy to talkpro / build-and-sync (push) Successful in 31s
Details
2026-05-21 10:15:47 +08:00
SeekingGamer
edec5370b6 fix(style): Change IOS buttons style
Some checks failed
Deploy to talkpro / build-and-sync (push) Has been cancelled
Details
2026-05-20 16:17:12 +08:00
Finn
08699e6d0d Merge pull request 'fix(style): fix gaps and pop up screen ui' (#13) from finn-staging into main
All checks were successful
Deploy to talkpro / build-and-sync (push) Successful in 35s
Details 
Reviewed-on: #13
 2026-05-20 06:37:35 +00:00
SeekingGamer
74793fbc11 fix(style): fix gaps and pop up screen ui 2026-05-20 11:36:04 +08:00
5 changed files with 49 additions and 14 deletions
Expand all files Collapse all files

35
README.md
View File

@@ -94,6 +94,41 @@ Figma assets are stored in `public/assets/`. To re-download them (valid for 7 da
bash scripts/download-assets.sh bash scripts/download-assets.sh
``` ```
## Cloudflare Cache & the `site-links-client.js` Version Flag
The site is proxied through **Cloudflare**, which aggressively caches static files. Astro's built CSS/JS bundles are safe because they get **content-hashed filenames** on every build (e.g. `_astro/index.Bx3kF9.js`) — Cloudflare never has an old copy because the filename itself changes.
`public/site-links-client.js` is the exception. It lives in `public/` so it always deploys to the same URL (`/site-links-client.js`). Cloudflare caches this URL and will keep serving the old version until either:
- The Cloudflare cache is **purged** (Caching → Purge Everything in the dashboard), or
- The script URL is **versioned** so Cloudflare treats it as a new file.
The URL is versioned in `src/layouts/Base.astro`:
```html
<script src="/site-links-client.js?v=2" defer></script>
```
**Every time you change `site-links-client.js`**, bump this number (`?v=2` → `?v=3`, etc.) and redeploy. Cloudflare will fetch the latest file immediately without needing a cache purge.
| Change type | Cache action needed |
|---|---|
| CSS / Astro component change | None — hashed filename handles it |
| `site-links-client.js` change | Bump `?v=N` in `Base.astro` and redeploy |
| Emergency full reset | Cloudflare dashboard → Caching → Purge Everything |
## i18n — Adding or Updating Translations
All page copy lives in `src/i18n/translations.ts`. The English (`en`) entry is the base — every other language only needs to override the keys it wants to change; missing keys fall back to English automatically.
Supported languages: `en`, `zh-cn`, `zh-tw`, `es`, `vi`, `pt`, `de`, `fr`, `hi`, `ar`, `ru`, `id`, `ur`, `ja`, `ko`, `ms`.
To add a new language:
1. Add the locale code to the `languages` array at the top of `translations.ts`.
2. Add its label to `languageLabels` and `languageNames`.
3. Add a translation object under `translations` (only the keys you want to override are required).
4. Create the page route: copy `src/pages/[lang]/index.astro` if it doesn't exist.
## Design Source ## Design Source
Figma: [Talk Pro — Home Page Desktop](https://www.figma.com/design/Gb8WMJ2RLlcZ0bigoiOQx9/Talk-Pro?node-id=9505-537&m=dev) Figma: [Talk Pro — Home Page Desktop](https://www.figma.com/design/Gb8WMJ2RLlcZ0bigoiOQx9/Talk-Pro?node-id=9505-537&m=dev)

4
public/site-links-client.js
View File

@@ -56,6 +56,7 @@
const BTN = const BTN =
'cursor:pointer;border-radius:8px;padding:10px 14px;font-size:14px;font-weight:600;border:1px solid #ccc;background:#f5f5f5;color:#1a1a1a;'; 'cursor:pointer;border-radius:8px;padding:10px 14px;font-size:14px;font-weight:600;border:1px solid #ccc;background:#f5f5f5;color:#1a1a1a;';
const BTN_PRIMARY = 'border-color:#1a6cff;background:#1a6cff;color:#fff;'; const BTN_PRIMARY = 'border-color:#1a6cff;background:#1a6cff;color:#fff;';
const BTN_ORANGE = 'cursor:pointer;border-radius:14px;padding:10px 14px;font-size:14px;font-weight:600;border:1px solid #f28a4b;background:#f28a4b;color:#fff;';
function initInAppBrowserModal() { function initInAppBrowserModal() {
if (document.getElementById('inapp-browser-modal')) return; if (document.getElementById('inapp-browser-modal')) return;
@@ -185,8 +186,7 @@
MODAL_ACTIONS + MODAL_ACTIONS +
'">' + '">' +
'<button type="button" data-app-soon-close style="' + '<button type="button" data-app-soon-close style="' +
BTN + BTN_ORANGE +
BTN_PRIMARY +
'"></button>' + '"></button>' +
'</div></div>'; '</div></div>';
document.body.appendChild(wrap); document.body.appendChild(wrap);

2
src/layouts/Base.astro
View File

@@ -27,7 +27,7 @@ const {
</head> </head>
<body class="bg-surface font-sans overflow-x-hidden"> <body class="bg-surface font-sans overflow-x-hidden">
<slot /> <slot />
<script src="/site-links-client.js" defer></script> <script src="/site-links-client.js?v=2" defer></script>
<script> <script>
(() => { (() => {
const header = document.getElementById('site-header'); const header = document.getElementById('site-header');

14
src/styles/download.css
View File

@@ -28,7 +28,7 @@
align-items: center; align-items: center;
width: 100%; width: 100%;
max-width: 1280px; max-width: 1280px;
gap: 32px; gap: 0px;
margin: 0 auto; margin: 0 auto;
padding: 60px 16px; padding: 60px 16px;
} }
@@ -60,7 +60,7 @@
flex-wrap: nowrap; flex-wrap: nowrap;
align-items: center; align-items: center;
flex-shrink: 0; flex-shrink: 0;
gap: 20px; gap: 16px;
max-width: 100%; max-width: 100%;
} }
@@ -150,8 +150,8 @@ a.store-badge {
} }
.store-badge--ios { .store-badge--ios {
background: #383838; background: #121212F0;
border: 1px solid #141414; border: 1px solid #2C2C2C;
} }
.store-badge__icon { .store-badge__icon {
@@ -168,7 +168,7 @@ a.store-badge {
flex-shrink: 0; flex-shrink: 0;
width: 44px; width: 44px;
height: 44px; height: 44px;
background: #151515; background: #323232;
border-radius: 12px; border-radius: 12px;
} }
@@ -211,7 +211,7 @@ a.store-badge {
} }
.store-badge--ios .store-badge__platform { .store-badge--ios .store-badge__platform {
color: #ccc; color: #949494;
} }
.store-badge__label { .store-badge__label {
@@ -301,7 +301,7 @@ a.store-badge {
.download-cta__inner { .download-cta__inner {
flex-direction: row; flex-direction: row;
gap: 0; gap: 16px;
padding: 0 24px; padding: 0 24px;
} }

8
src/styles/why.css
View File

@@ -264,10 +264,6 @@
letter-spacing: var(--ls-42); letter-spacing: var(--ls-42);
} }
.why__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.why-card { .why-card {
padding: 36px; padding: 36px;
min-height: 152px; min-height: 152px;
@@ -287,6 +283,10 @@
padding-right: 36px; padding-right: 36px;
} }
.why__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.why__intro { .why__intro {
flex-direction: row; flex-direction: row;
} }