From c04864f693e8d7864b5f2b0212b982436b117e87 Mon Sep 17 00:00:00 2001 From: Maurice Date: Thu, 5 Nov 2026 22:56:55 +0100 Subject: [PATCH] feat(native): TREK Cloud wordmark lockup on the cloud screen, fix a German string --- .../fonts/museomoderno-italic-600.woff2 | Bin 0 -> 1212 bytes client/native-shell/main.ts | 8 +++- client/native-shell/shell.css | 43 ++++++++++++++++++ shared/src/i18n/de/native.ts | 5 +- 4 files changed, 52 insertions(+), 4 deletions(-) create mode 100644 client/native-shell/fonts/museomoderno-italic-600.woff2 diff --git a/client/native-shell/fonts/museomoderno-italic-600.woff2 b/client/native-shell/fonts/museomoderno-italic-600.woff2 new file mode 100644 index 0000000000000000000000000000000000000000..3e8cd7bebda78d95643a17b1b7caff067b735374 GIT binary patch literal 1212 zcmV;t1Vj6GPew8T0RR9100g`M5C8xG00__k00dtE0RR9100000000000000000000 z0000Q78`*C94H20KT}jeR6qb!5eN!}6ofGg5C8!-0we<*1Rw>4AO|1}2OCQV$OInv z@3cR6GO4EYPQkDuvz4c7r2A+u{Q3L|Clkj^m*)uKPu=A8rWY2JSV7g zey1V;PZYg`5QX~iD&Rpp=}48;jh%SUk7pd3 zw~qz3NCL`7v@|u>u^*LndAp;6DUi2|H&n!R?RMdiUgv16P^1h*;)pus#)8mXm^md{g~>BNV-tJT4SE zz4V@aV*gu)$KGO}bmyxc_Lm>O89Z*hRqVg(xv!LsFP^!BeQzh<|1f)BFZ=1!V*i;l ziqh#}KY5aU&wQdNontLGKBH`W@Sv!VQC&+*Qxm;k9!ZLwiXCx}Ow*|z?t4yt zkePMEHGTT@S8d);gk|AdI-gZ)s~m3Md#tRj+h1!mRVF7?n^JzujjHw62vyn^i*r}% z3z8;l8pjO2<) z{J!{ndu3u~c16mj^28$3baU5uNruPXxAH2YS~dlq_V)LwE4fPVr}zBHbID&LR;gVp zsF<%Sw#>A*%o&PmRtn1J>x)b?tu3>LEX`7Gjcqg}onKBgms{c+jR_a_)BnFI-o311 zYAwH`(w37onCG78p6Ykp7^(Nr8@kP#nybo+)B( z^u(v!W_KKOe5~Ih*C65Y+A?RbK94;8O^#y@^jp~eJ7324xQgEp;x=NX?Wp1=Owv4Y zl19F8-*7fpHgLs;%WEu@%LWDehar$hnqL?FIYy8wtQZMT5s%T)$XSd`E_Y+}gmVPr zLN={vZ!(Fb5E7pF_PEe}fC$GI=wN~cW+-Qgc{bC-1T#!AjpoN|ER&B#+O~#`Rc2U5 zKZ^odXrh@q3JzA6cjzd|6)dsLc3do!L6vl@{$f=+nPvi&YPVKa zSz?w6Z1ap|tUnJ1>gXCO$D8|@ZUk*CvG7ci7g%J5aXH>ZC)-(ON3(1z aNcnO5oPUCo9T$j`__A;wep literal 0 HcmV?d00001 diff --git a/client/native-shell/main.ts b/client/native-shell/main.ts index aa0ea3aa3..45cffbab0 100644 --- a/client/native-shell/main.ts +++ b/client/native-shell/main.ts @@ -303,7 +303,13 @@ function showCloud(opts: { back?: boolean } = {}): void { 'div', {}, topbar(() => showWelcome({ back: true })), - el('h1', { className: 'title-sm' }, t('native.cloud.title')), + el( + 'div', + { className: 'cloud-wordmark', role: 'img', ariaLabel: t('native.cloud.title') }, + el('img', { src: logoWhite, alt: '', className: 'on-dark' }), + el('img', { src: logoBlack, alt: '', className: 'on-light' }), + el('span', { className: 'cloud-tag' }, 'cloud') + ), el('p', { className: 'sub' }, t('native.cloud.sub')), el( 'div', diff --git a/client/native-shell/shell.css b/client/native-shell/shell.css index 26edaa738..4333f68df 100644 --- a/client/native-shell/shell.css +++ b/client/native-shell/shell.css @@ -38,6 +38,14 @@ font-display: swap; src: url('./fonts/museomoderno-latin-600.woff2') format('woff2'); } +/* Italic, subset to the letters of "cloud" — the wordmark's badge, nothing else. */ +@font-face { + font-family: 'MuseoModerno'; + font-style: italic; + font-weight: 600; + font-display: swap; + src: url('./fonts/museomoderno-italic-600.woff2') format('woff2'); +} :root { --bg: #09090b; @@ -366,6 +374,41 @@ body::after { letter-spacing: -0.01em; line-height: 1.08; } + +/* The TREK Cloud lockup (cloud intro screen): the wordmark plus the "cloud" + badge in italic MuseoModerno, an inverted pill, exactly as on liketrek.com. */ +.cloud-wordmark { + display: inline-flex; + align-items: center; + gap: 9px; +} +.cloud-wordmark img { + display: block; + height: 38px; + width: auto; +} +.cloud-wordmark .on-light { + display: none; +} +@media (prefers-color-scheme: light) { + .cloud-wordmark .on-dark { + display: none; + } + .cloud-wordmark .on-light { + display: block; + } +} +.cloud-tag { + font-family: 'MuseoModerno', system-ui, sans-serif; + font-style: italic; + font-weight: 600; + font-size: 0.95rem; + line-height: 1.35; + padding: 2px 11px; + border-radius: 999px; + color: var(--bg); + background: var(--ink); +} .title-sm { font-size: 1.5rem; line-height: 1.18; diff --git a/shared/src/i18n/de/native.ts b/shared/src/i18n/de/native.ts index b8137ed5c..0cf6bc9aa 100644 --- a/shared/src/i18n/de/native.ts +++ b/shared/src/i18n/de/native.ts @@ -26,8 +26,7 @@ const native: TranslationStrings = { 'native.settings.server': 'Server', // same-as-en 'native.settings.serverHint': 'Diese App ist mit {server} verbunden.', 'native.welcome.headline': 'Deine Reisen.\nDein Plan.', - 'native.welcome.sub': - 'Gemeinsam in Echtzeit planen: Touren, Budgets, Journal, Fotobuch — mit KI. Web, Handy, offline.', + 'native.welcome.sub': 'Gemeinsam in Echtzeit planen: Touren, Budgets, Journal, Fotobuch — mit KI.', 'native.welcome.connect': 'Mit deinem TREK verbinden', 'native.welcome.connectSub': 'Die Adresse öffnen, die du schon nutzt', 'native.welcome.getCloud': 'TREK Cloud holen', @@ -39,7 +38,7 @@ const native: TranslationStrings = { 'native.cloud.f2': 'In Minuten eingerichtet, Updates übernehmen wir', 'native.cloud.f3': 'Deine Daten bleiben deine — keine Werbung, kein Tracking', 'native.cloud.cta': 'Loslegen', - 'native.cloud.haveServer': 'Ich habe schon ein TREK', + 'native.cloud.haveServer': 'Ich habe schon einen TREK-Server', 'native.connecting': 'Verbinde mit {host}', 'native.back': 'Zurück', 'native.plans.title': 'Tarif wählen',