diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml index 8fbdf64..b9553c4 100644 --- a/.github/FUNDING.yml +++ b/.github/FUNDING.yml @@ -9,4 +9,4 @@ community_bridge: # Replace with a single Community Bridge project-name e.g., cl liberapay: # Replace with a single Liberapay username issuehunt: # Replace with a single IssueHunt username otechie: # Replace with a single Otechie username -custom: ["https://www.paypal.me/yang991178", "https://hyliu.me/fluent-reader/imgs/alipay.jpg", "https://hyliu.me/fluent-reader/imgs/wechat-pay.jpg"] +custom: ["https://www.paypal.me/yang991178", "https://hyliu.me/fluent-reader/imgs/alipay.jpg"] diff --git a/.gitignore b/.gitignore index 83cfce9..ac0cb12 100644 --- a/.gitignore +++ b/.gitignore @@ -3,4 +3,5 @@ dist/*.js dist/*.js.map dist/*.html bin/* -package-lock.json \ No newline at end of file +package-lock.json +.DS_Store \ No newline at end of file diff --git a/README.md b/README.md index dc321f8..382aa41 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ For Windows 10 users, the recommended way of installation is through [Microsoft Store](https://www.microsoft.com/store/apps/9P71FC94LRH8?cid=github). This enables auto-update and experimental ARM64 support. -If you are using macOS or an older version of Windows, you can also [get Fluent Reader from GitHub releases](https://github.com/yang991178/fluent-reader/releases). +If you are using macOS, Linux, or an older version of Windows, you can also [get Fluent Reader from GitHub releases](https://github.com/yang991178/fluent-reader/releases). ## Features diff --git a/dist/icons/logo.svg b/dist/icons/logo.svg index 52321e8..c3aedbd 100644 --- a/dist/icons/logo.svg +++ b/dist/icons/logo.svg @@ -1,5 +1,45 @@ + @@ -33,29 +73,29 @@ - + - + - - - + + + - - + + - - + + - - F + + F diff --git a/dist/styles.css b/dist/styles.css index c446e06..7337992 100644 --- a/dist/styles.css +++ b/dist/styles.css @@ -15,6 +15,7 @@ --black: #000; --white: #fff; --whiteConstant: #fff; + --navHeight: 32px; } @media (prefers-color-scheme: dark) { :root { @@ -36,7 +37,9 @@ --whiteConstant: #f8f8f8; } } - +body.darwin { + --navHeight: 38px; +} html, body { background-color: transparent; @@ -104,7 +107,7 @@ i.ms-Nav-chevron { } #root > nav { - height: 32px; + height: var(--navHeight); -webkit-app-region: drag; user-select: none; overflow: hidden; @@ -130,17 +133,20 @@ nav .progress { } #root > nav span.title { font-size: 12px; - line-height: 32px; + line-height: var(--navHeight); vertical-align: top; letter-spacing: 2px; margin: 0 4px; display: inline-block; - max-width: 300px; + max-width: 280px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: var(--black); } +body.darwin #root > nav span.title { + max-width: 220px; +} .btn-group { display: inline-block; user-select: none; @@ -148,14 +154,14 @@ nav .progress { } .btn-group .seperator { display: inline-block; - width: 32px; + width: var(--navHeight); font-size: 12px; color: #c8c6c4; text-align: center; vertical-align: middle; } body.darwin .btn-group .seperator { - line-height: 32px; + display: none; } .btn-group .seperator::before { content: "|"; @@ -171,6 +177,13 @@ body.darwin .btn-group .seperator { font-size: 14px; vertical-align: top; } +#root > nav .btn-group .btn, .menu .btn-group .btn { + height: var(--navHeight); + line-height: var(--navHeight); +} +body.darwin #root > nav .btn-group .btn:first-of-type { + margin-left: 72px; +} #root > nav .btn-group .btn.system { position: relative; z-index: 10; @@ -215,6 +228,9 @@ nav.menu-on .btn-group .btn.system, nav.item-on .btn-group .btn.system { .btn-group .btn.inline-block-wide { display: none; } +body.darwin .btn-group .btn.system { + display: none; +} .menu-container, .article-container { position: fixed; @@ -237,8 +253,12 @@ nav.menu-on .btn-group .btn.system, nav.item-on .btn-group .btn.system { height: 100%; background-color: var(--neutralLighterAlt); } +body.darwin .menu .btn-group { + display: flex; + flex-direction: row-reverse; +} .menu-container .menu .nav-wrapper { - max-height: calc(100% - 32px); + max-height: calc(100% - var(--navHeight)); overflow: hidden auto; } .menu-container .menu p.subs-header { @@ -356,7 +376,7 @@ img.favicon.dropdown { } .main { - margin-top: -32px; + margin-top: calc(-1 * var(--navHeight)); height: 100%; overflow: hidden; background-color: var(--neutralLighterAlt); @@ -365,11 +385,11 @@ img.favicon.dropdown { content: ""; display: block; position: sticky; - top: 32px; + top: var(--navHeight); left: 0; width: calc(100% - 16px); - height: 32px; - margin-bottom: -32px; + height: var(--navHeight); + margin-bottom: calc(-1 * var(--navHeight)); background: linear-gradient(var(--neutralLighterAlt), #faf9f800); z-index: 1; } @@ -383,18 +403,31 @@ img.favicon.dropdown { margin: 4px 16px; border: none; -webkit-app-region: none; - height: 28px; + height: calc(var(--navHeight) - 4px); box-shadow: 0 1.6px 3.6px 0 rgba(0,0,0,.132), 0 0.3px 0.9px 0 rgba(0,0,0,.108); } +body.darwin .article-search { + left: 108px; + max-width: calc(100% - 384px); +} .list-main .article-search { max-width: 294px; margin: 4px 10px; } +body.darwin .list-main .article-search { + max-width: 314px; + left: 0; + top: var(--navHeight); + margin: 0 10px; +} @media (min-width: 1441px) { #root > nav.menu-on { padding-left: 296px; } + #root > nav.menu-on span.title, body.darwin #root > nav.menu-on span.title { + max-width: 300px; + } nav.menu-on .btn-group .btn { display: inline-block; } @@ -436,10 +469,18 @@ img.favicon.dropdown { left: 280px; max-width: calc(100% - 728px); } + body.darwin .menu-on .article-search { + left: 280px; + max-width: calc(100% - 556px); + } .list-main.menu-on .article-search { left: 0; width: 330px; } + body.darwin .list-main.menu-on .article-search { + left: 0; + top: 4px; + } nav.hide-btns .btn-group .btn, nav.menu-on .btn-group .btn.hide-wide, .menu .btn-group .btn.hide-wide { display: none; @@ -500,8 +541,8 @@ img.favicon.dropdown { } .side-article-wrapper, .side-logo-wrapper { flex-grow: 1; - padding-top: 32px; - height: calc(100% - 32px); + padding-top: var(--navHeight); + height: calc(100% - var(--navHeight)); background: var(--white); } .side-logo-wrapper { @@ -542,7 +583,7 @@ img.favicon.dropdown { width: 100%; border-bottom: 1px solid var(--neutralQuaternaryAlt); position: absolute; - top: 31px; + top: calc(var(--navHeight) - 1px); } .list-main { @@ -550,7 +591,7 @@ img.favicon.dropdown { flex-wrap: wrap; height: 100%; position: relative; - margin-top: -32px; + margin-top: calc(-1 * var(--navHeight)); overflow: hidden; background: var(--white); } @@ -572,8 +613,8 @@ img.favicon.dropdown { box-shadow: inset 5px 0 25px #0004; } .list-feed { - margin-top: 32px; - height: calc(100% - 32px); + margin-top: var(--navHeight); + height: calc(100% - var(--navHeight)); overflow: hidden scroll; position: relative; } @@ -589,7 +630,7 @@ img.favicon.dropdown { padding: 12px; height: calc(100% - 56px); overflow: hidden scroll; - margin-top: 32px; + margin-top: var(--navHeight); } .cards-feed-container > div.load-more-wrapper, .flex-fix { text-align: center; diff --git a/docs/imgs/logo.svg b/docs/imgs/logo.svg index 52321e8..c3aedbd 100644 --- a/docs/imgs/logo.svg +++ b/docs/imgs/logo.svg @@ -1,5 +1,45 @@ + @@ -33,29 +73,29 @@ - + - + - - - + + + - - + + - - + + - - F + + F diff --git a/docs/imgs/wechat-pay.jpg b/docs/imgs/wechat-pay.jpg deleted file mode 100644 index f15306a..0000000 Binary files a/docs/imgs/wechat-pay.jpg and /dev/null differ diff --git a/package.json b/package.json index 937e8bc..0f683f1 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "fluent-reader", - "version": "0.4.0", + "version": "0.4.1", "description": "A simplistic, modern desktop RSS reader", "main": "./dist/electron.js", "scripts": { @@ -37,7 +37,8 @@ "languages": [ "zh-CN", "en-US", - "fr-FR" + "fr-FR", + "es" ], "showNameOnTiles": true, "setBuildNumber": true diff --git a/src/components/menu.tsx b/src/components/menu.tsx index 80d5549..2fcd959 100644 --- a/src/components/menu.tsx +++ b/src/components/menu.tsx @@ -119,7 +119,9 @@ export class Menu extends React.Component {
e.stopPropagation()}>
- + + +
{this.props.state.title} diff --git a/src/components/settings/app.tsx b/src/components/settings/app.tsx index 6ec3f0d..7e259e0 100644 --- a/src/components/settings/app.tsx +++ b/src/components/settings/app.tsx @@ -80,6 +80,7 @@ class AppTab extends React.Component { languageOptions = (): IDropdownOption[] => [ { key: "default", text: intl.get("followSystem") }, { key: "en-US", text: "English" }, + { key: "es", text: "Español"}, { key: "fr-FR", text: "Français"}, { key: "zh-CN", text: "中文（简体）"}, ] diff --git a/src/electron.ts b/src/electron.ts index 55c926f..379606a 100644 --- a/src/electron.ts +++ b/src/electron.ts @@ -37,7 +37,8 @@ function createWindow() { height: mainWindowState.height, minWidth: 992, minHeight: 600, - frame: false, + frame: process.platform === "darwin", + titleBarStyle: "hiddenInset", fullscreenable: false, show: false, webPreferences: { diff --git a/src/scripts/i18n/README.md b/src/scripts/i18n/README.md new file mode 100644 index 0000000..7558739 --- /dev/null +++ b/src/scripts/i18n/README.md @@ -0,0 +1,12 @@ +## Internationalization + +Currently, Fluent Reader supports the following languages. + +| Locale | Language | Credit | +| --- | --- | --- | +| en-US | English | [@yang991178](https://github.com/yang991178) | +| es | Español | [@kant](https://github.com/kant) | +| fr-FR | Français | [@Toinane](https://github.com/Toinane) | +| zh-CN | 中文（简体） | [@yang991178](https://github.com/yang991178) | + +Refer to the repo of [react-intl-universal](https://github.com/alibaba/react-intl-universal) to get started on internationalization. diff --git a/src/scripts/i18n/_locales.ts b/src/scripts/i18n/_locales.ts index 852e47c..fcdb929 100644 --- a/src/scripts/i18n/_locales.ts +++ b/src/scripts/i18n/_locales.ts @@ -1,11 +1,13 @@ import en_US from "./en-US.json" import zh_CN from "./zh-CN.json" import fr_FR from "./fr-FR.json" +import es from "./es.json" const locales = { "en-US": en_US, "zh-CN": zh_CN, "fr-FR": fr_FR, + "es": es, } export default locales \ No newline at end of file diff --git a/src/scripts/i18n/sp-SP.json b/src/scripts/i18n/es.json similarity index 100% rename from src/scripts/i18n/sp-SP.json rename to src/scripts/i18n/es.json diff --git a/src/scripts/utils.ts b/src/scripts/utils.ts index 9e2f117..01078e7 100644 --- a/src/scripts/utils.ts +++ b/src/scripts/utils.ts @@ -35,7 +35,7 @@ export async function parseRSS(url: string) { throw new Error(result.statusText) } } catch { - throw new Error("A network error has occured.") + throw new Error("A network error has occurred.") } }