From 1f0f2bdb37e315fc614590b3651d335c332d7e4e Mon Sep 17 00:00:00 2001 From: Jackson Harper Date: Thu, 26 Jan 2023 22:35:42 +0800 Subject: [PATCH] Add Chinese language version of about page --- packages/web/components/templates/About.tsx | 28 +- .../landing/LandingSectionsContainer.tsx | 277 ++++++++---------- packages/web/pages/about.tsx | 2 +- packages/web/pages/index.tsx | 2 +- packages/web/pages/zh/index.tsx | 4 +- 5 files changed, 153 insertions(+), 160 deletions(-) diff --git a/packages/web/components/templates/About.tsx b/packages/web/components/templates/About.tsx index e4e8394e6..3a2bb88aa 100644 --- a/packages/web/components/templates/About.tsx +++ b/packages/web/components/templates/About.tsx @@ -6,7 +6,11 @@ import { } from './landing/LandingSectionsContainer' import { LandingFooter } from './landing/LandingFooter' -export function About(): JSX.Element { +type AboutProps = { + lang: 'en' | 'zh' +} + +export function About(props: AboutProps): JSX.Element { return ( <> @@ -39,8 +43,10 @@ export function About(): JSX.Element { textAlign: 'center', }} > - Omnivore is the free, open source, read-it-later app for serious - readers. + {props.lang == 'zh' + ? `Omnivore 为认真读者提供免付费read-it-later应用程序` + : `Omnivore is the free, open source, read-it-later app for serious + readers.`} - Distraction free. Privacy focused. Open source. Designed for - knowledge workers and lifelong learners. + {props.lang == 'zh' + ? `休闲阅读。保护隐私。Open source。专为知识工作者和终身学习者设计。` + : `Distraction free. Privacy focused. Open source. Designed for + knowledge workers and lifelong learners.`} - Save articles, newsletters, and documents and read them later — + {props.lang == 'zh' + ? `为您保存文章、邮件订阅或文件，等休闲时再去阅读。可以随意添加注释和高亮。按自己喜好设定阅读列表。还可与其他个人电子设备同步。` + : `Save articles, newsletters, and documents and read them later — focused and distraction free. Add notes and highlights. Organize your reading list the way you want and sync it across all your - devices. + devices.`} - + - + diff --git a/packages/web/components/templates/landing/LandingSectionsContainer.tsx b/packages/web/components/templates/landing/LandingSectionsContainer.tsx index 090b84a89..bd3bdcb7f 100644 --- a/packages/web/components/templates/landing/LandingSectionsContainer.tsx +++ b/packages/web/components/templates/landing/LandingSectionsContainer.tsx @@ -2,7 +2,11 @@ import { VStack, Box } from '../../elements/LayoutPrimitives' import { Button } from '../../elements/Button' import { LandingSection } from './LandingSection' -export function GetStartedButton(): JSX.Element { +type GetStartedButtonProps = { + lang: 'en' | 'zh' +} + +export function GetStartedButton(props: GetStartedButtonProps): JSX.Element { return ( ) } @@ -78,7 +82,110 @@ const callToActionText = { }, } -export function LandingSectionsContainer(): JSX.Element { +type LandingSectionsContainerProps = { + lang: 'en' | 'zh' +} + +const sections = [ + { + en: { + titleText: `Save it now. Read it later.`, + descriptionText: `Save articles, PDFs, and Twitter threads as you come across them + using Omnivore&aposs mobile apps and browser extensions. Read them + later using our distraction free reader.`, + }, + zh: { + titleText: `先保存，后阅读`, + descriptionText: `看到有趣的内容，但没时间阅读？不论是文章、PDF或是推特线程，只需将它们保存下来，等稍后有空再阅读。Omnivore 应用程序适用于iOS、Android 和主要网络浏览扩展程序。`, + }, + imageIdx: `03`, + }, + { + en: { + titleText: `Get all your newsletters in one place.`, + descriptionText: `Send newsletters directly to your Omnivore library rather than + scattered across multiple inboxes. Read them on your own time, away + from the constant distractions and interruptions of your email.`, + }, + zh: { + titleText: `集合邮件订阅`, + descriptionText: `您不再需要到不同收件箱提取订阅的邮件，只要将它们发送到 Omnivore Library，即可在同一处随心阅读，不受其他电子邮件或 substack 的干扰。`, + }, + imageIdx: `04`, + }, + { + en: { + titleText: `Keep your reading organized, whatever that means to you.`, + descriptionText: `Keep your reading organized and easily available with labels, + filters, rules, and fully indexed text searches. We&aposre not here + to tell you how to stay organized — our job is to give you the tools + to build a system that works for you.`, + }, + zh: { + titleText: `按喜好组织阅读系统`, + descriptionText: `我们不会限定您如何组织系统，只提供您所需的工具，如标签、过滤器和完整的文本索引搜索，让您按自己的喜好和需求设定组织规则。`, + }, + imageIdx: `05`, + }, + { + en: { + titleText: `Add highlights and notes.`, + descriptionText: `Become a better reader — engage your brain and improve retention by + reading actively, not passively. Highlight key sections and add + notes as you read. You can access your highlights and notes any time + — they stay with your articles forever.`, + }, + zh: { + titleText: `添加高亮和注释`, + descriptionText: `想提高阅读效率？积极动用大脑，为关键的段落添加高亮或注释，能提高您阅读记忆的保留。这些标注将永久保存在文件里，方便您随时搜索使用。`, + }, + imageIdx: `06`, + }, + { + en: { + titleText: `Sync with your second brain.`, + descriptionText: `Omnivore syncs with popular Personal Knowledge Management systems + including Logseq and Obsidian, so you can pull all your saved + reading, highlights, and notes into your second brain.`, + }, + zh: { + titleText: `与您的“第二大脑”同步`, + descriptionText: `Omnivore 应用程序能与个人知识管理系统如 Logseq 和 Obsidian 同步，让您轻而易举地综合所有保存文章、高亮和注释。`, + }, + imageIdx: `07`, + }, + { + en: { + titleText: `Listen to your reading with text-to-speech.`, + descriptionText: `Work through your to-be-read list and give your eyes a break with + TTS, exclusively in the Omnivore app for iOS. Realistic, + natural-sounding AI voices will read any saved article aloud.`, + }, + zh: { + titleText: `使用 text-to-speech 功能聆听阅读`, + descriptionText: `使用TTS逼真、自然的人工智能声音为您阅读待读列表中的读物，让眼睛好好休息一下。这便是我们iOS 版Omnivore 应用程序的独家功能。`, + }, + imageIdx: `08`, + maxWidth: '85%', + }, + { + en: { + titleText: `Open source means you're in control.`, + descriptionText: `Reading is a lifetime activity, and you shouldn't have to worry + you'll lose your library after you've spent years building + it. Our open-source platform ensures your reading won't be held + prisoner in a proprietary system.`, + }, + zh: { + titleText: `开源软件给予您控制权`, + descriptionText: `阅读是终身的活动，不应担心失去自己多年辛苦建立的图书馆。我们的开源平台，就是为了确保您的阅读不会受限于任何专有系统。`, + }, + imageIdx: `09`, + }, +] +export function LandingSectionsContainer( + props: LandingSectionsContainerProps +): JSX.Element { return ( - -

- Save articles, PDFs, and Twitter threads as you come across them - using Omnivore&aposs mobile apps and browser extensions. Read them - later using our distraction free reader. -

- - } - image={ - landing-3 { + return ( + {section[props.lang].descriptionText}

} + image={ + {`landing-${section.imageIdx}`} + } /> - } - /> - - - Send newsletters directly to your Omnivore library rather than - scattered across multiple inboxes. Read them on your own time, away - from the constant distractions and interruptions of your email. -

- } - image={ - landing-4 - } - /> - - - Keep your reading organized and easily available with labels, - filters, rules, and fully indexed text searches. We&aposre not here - to tell you how to stay organized — our job is to give you the tools - to build a system that works for you. -

- } - image={ - landing-5 - } - /> - - - Become a better reader — engage your brain and improve retention by - reading actively, not passively. Highlight key sections and add - notes as you read. You can access your highlights and notes any time - — they stay with your articles forever. -

- } - image={ - landing-6 - } - /> - - - Omnivore syncs with popular Personal Knowledge Management systems - including Logseq and Obsidian, so you can pull all your saved - reading, highlights, and notes into your second brain. -

- } - image={ - landing-7 - } - /> - - - Work through your to-be-read list and give your eyes a break with - TTS, exclusively in the Omnivore app for iOS. Realistic, - natural-sounding AI voices will read any saved article aloud. -

- } - image={ - landing-8 - } - /> - - - Reading is a lifetime activity, and you shouldn't have to worry - you'll lose your library after you've spent years building - it. Our open-source platform ensures your reading won't be held - prisoner in a proprietary system. -

- } - image={ - landing-9 - } - /> + ) + })} - Get Started With Omnivore Today - + {props.lang == 'en' && ( + Get Started With Omnivore Today + )} + ) diff --git a/packages/web/pages/about.tsx b/packages/web/pages/about.tsx index c20f7e268..534b75998 100644 --- a/packages/web/pages/about.tsx +++ b/packages/web/pages/about.tsx @@ -49,7 +49,7 @@ export default function LandingPage(): JSX.Element { description="Omnivore is the free, open source, read-it-later app for serious readers." /> - + ) } diff --git a/packages/web/pages/index.tsx b/packages/web/pages/index.tsx index 9b1eb20ab..a5b3cce3e 100644 --- a/packages/web/pages/index.tsx +++ b/packages/web/pages/index.tsx @@ -72,7 +72,7 @@ export default function LandingPage(): JSX.Element { description="Omnivore is the free, open source, read-it-later app for serious readers." /> - + ) } diff --git a/packages/web/pages/zh/index.tsx b/packages/web/pages/zh/index.tsx index 2d7a538c2..df1c34a7e 100644 --- a/packages/web/pages/zh/index.tsx +++ b/packages/web/pages/zh/index.tsx @@ -46,10 +46,10 @@ export default function LandingPage(): JSX.Element { title="Omnivore" path="/about" ogImage="/static/images/og-homepage-zh.png" - description="Omnivore is the free, open source, read-it-later app for serious readers." + description="Omnivore 为认真读者提供免付费read-it-later应用程序" /> - + ) }