From d5769be2914144066875b57ee7cdb0d9ee48a844 Mon Sep 17 00:00:00 2001 From: Alireza Date: Mon, 21 Jun 2021 19:35:41 -0400 Subject: [PATCH] feat: Add i18n docs and light and dark theme styles --- docs/.gitignore | 1 - docs/CNAME | 1 - docs/README.md | 47 ------ docs/_redirects | 3 - docs/latest/.gitignore | 1 - docs/latest/.nojekyll | 0 docs/v2/.nojekyll | 0 docs/win-server-workaround.bat | 13 -- .../docs/docs/viewer/internationalization.md | 58 ++++++- platform/docs/docusaurus.config.js | 155 ++++++++---------- platform/docs/src/css/custom.css | 65 +++++++- 11 files changed, 180 insertions(+), 164 deletions(-) delete mode 100644 docs/.gitignore delete mode 100644 docs/CNAME delete mode 100644 docs/README.md delete mode 100644 docs/_redirects delete mode 100644 docs/latest/.gitignore delete mode 100644 docs/latest/.nojekyll delete mode 100644 docs/v2/.nojekyll delete mode 100644 docs/win-server-workaround.bat diff --git a/docs/.gitignore b/docs/.gitignore deleted file mode 100644 index 71b56df6a..000000000 --- a/docs/.gitignore +++ /dev/null @@ -1 +0,0 @@ -./_book/* diff --git a/docs/CNAME b/docs/CNAME deleted file mode 100644 index b6d936979..000000000 --- a/docs/CNAME +++ /dev/null @@ -1 +0,0 @@ -docs.ohif.org diff --git a/docs/README.md b/docs/README.md deleted file mode 100644 index 20d3ac4ed..000000000 --- a/docs/README.md +++ /dev/null @@ -1,47 +0,0 @@ -# How To: Documentation Step-by-Step - -We use [GitBook](https://www.gitbook.com/) to create our documentation. It primarily uses markdown, html, css, js, misc. plugins, and configuration to generate high quality, easy to read, and easy to maintain documentation. - -## Getting Started - -_Requirements:_ - -Make sure you have the [`gitbook-cli`](https://www.npmjs.com/package/gitbook-cli) installed globally: - -(Note that gitbook 3.2.3 works with node 10.19.0 and node 10.24.0, but not with node 14.x.) -> `npm install -g gitbook-cli` - -### Editing and Previewing Changes - -Currently, you can only edit and preview a single "book" at a time. We maintain one "book" per API major version. You can find each version's book at: - -_Past Versions:_ - -- Template: - - `/docs/v` -- Examples: - - `/docs/v1` - - `/docs/v2` - -_Latest Version:_ - -The latest version will always be located in `/docs/latest` - -_Live Preview:_ - -In your terminal / command prompt: - -```bash -cd /docs/latest -gitbook install -gitbook serve -``` - -Which should generate output like: - -> starting server... -> serving book on http://localhost:4000 - -Navigating to the the provided URL will show a preview of what the generated book should look like. Any edits you make to the book's markdown files should automatically update in your browser. - -### Publishing diff --git a/docs/_redirects b/docs/_redirects deleted file mode 100644 index d28537fec..000000000 --- a/docs/_redirects +++ /dev/null @@ -1,3 +0,0 @@ -# Netlify redirects -# SPA rules for our docs -/* /index.html 200 diff --git a/docs/latest/.gitignore b/docs/latest/.gitignore deleted file mode 100644 index 09ea21bf7..000000000 --- a/docs/latest/.gitignore +++ /dev/null @@ -1 +0,0 @@ -_book/ diff --git a/docs/latest/.nojekyll b/docs/latest/.nojekyll deleted file mode 100644 index e69de29bb..000000000 diff --git a/docs/v2/.nojekyll b/docs/v2/.nojekyll deleted file mode 100644 index e69de29bb..000000000 diff --git a/docs/win-server-workaround.bat b/docs/win-server-workaround.bat deleted file mode 100644 index ef9dffb6e..000000000 --- a/docs/win-server-workaround.bat +++ /dev/null @@ -1,13 +0,0 @@ -:: REQUIRES GLOBAL INSTALL OF GITBOOK and GITBOOK-CLI -:: -:: Call this script from the command line while in the directory of the book -:: you want to actively edit + preview -:: -:: `gitbook serve` can break with permission issues on Windows for misc. -:: machines. This script is a workaround. When `gitbook serve` fails, it silently -:: restarts it. -:: https://github.com/GitbookIO/gitbook/issues/1379#issuecomment-288048275 -@Echo off -:Start -call gitbook serve -goto Start \ No newline at end of file diff --git a/platform/docs/docs/viewer/internationalization.md b/platform/docs/docs/viewer/internationalization.md index 557d6dbdd..9b63133d3 100644 --- a/platform/docs/docs/viewer/internationalization.md +++ b/platform/docs/docs/viewer/internationalization.md @@ -327,7 +327,59 @@ Run the project as following to get full debug information: REACT_APP_I18N_DEBUG=true yarn run dev ``` -### Contributing with new languages +## Contributing with new languages -Contributions of any kind are welcome! Please check the -[instructions](../development/contributing.md). +We have integrated `i18next` into the OHIF Viewer and hooked it up with Locize for translation management. Now we need your help to get the app translated into as many languages as possible, and ensure that we haven't missed pieces of the app that need translation. Locize has graciously offered to provide us with free usage of their product. + +Once each crowd-sourcing project is completed, we can approve it and merge the changes into the main project. At that point, the language will be immediately available on https://viewer.ohif.org/ for testing, and can be used in any OHIF project. We will support usage through both the Locize CDN and by copying the language directly into the `@ohif/i18n` package, so that end users can serve the content from their own domains. + +Here are a couple examples: + +Spanish: +https://viewer.ohif.org/viewer/1.2.840.113619.2.5.1762583153.215519.978957063.78?lng=es + +Chinese: +https://viewer.ohif.org/viewer/1.2.840.113619.2.5.1762583153.215519.978957063.78?lng=zh + +Portugese: +https://viewer.ohif.org/viewer/1.2.840.113619.2.5.1762583153.215519.978957063.78?lng=pt-BR + +Here are some links you can use to sign up to help translate. All you have to do is sign up, translate the strings, and click Save. On our side, we have a dashboard to see how many strings are translated and by whom. + +This is a pretty random set of languages, so please post below if you'd like a new language link to be added: + +Languages: + +[French](https://www.locize.io/register?invitation=Nj8jRPaFKYwtIfNZ6Y5GVOJOpeiXNAdVuSiOg9ceaiveP6uF6y1wVXM9lgfKoYZX) + +[German](https://www.locize.io/register?invitation=gChNiVi66YINTPpbKESVAVYPapwg3DkpvMSSomLTvVqBJTXrdmPvxi0WZYHER11q) + +[Dutch](https://www.locize.io/register?invitation=2PGe7I184aN0cazM4GXMhzeLtGTf9Zen5uyOEFhHQ8vYkfKHkgR0mJ8dwbNlIeCG) + +[Turkish](https://www.locize.io/register?invitation=NOMIXsfneqPbFDqjce5wI7Z6p2swXSjc0rHOH4KLcM6qXSNA4LGyJaLxS7nqWAe3) + +[Chinese](https://www.locize.io/register?invitation=lrcUbt7DvV4aJmQeEA4SMAj5xNWr3rltOcaZW1cFc6eod0nvzSPFU4V383tDHGGn) + +[Japanese](https://www.locize.io/register?invitation=AaRq2S22o5FsxArwgVuw1gZcQjoe2ffyxarqlAXOpN7JnR2sf2mfamc5qV6LG1Mn) + +[Arabic](https://www.locize.io/register?invitation=BiqI6fOm1sC84N3YJLbImXmaOCk8Hc3TMGpXg7NH2R0b0OKuPCp9wlCHLoqMRpfQ) + +[Hindi](https://www.locize.io/register?invitation=ph7JmOGTV95DF3EFaI1kvK5Hx98dV9w2wj9h9UhUCWnkBNAwWEdWMcyjnF94zkWb) + +[Malay](https://www.locize.io/register?invitation=HsV9F5mKZyeUZYrC3XFRzNI2l0EsIh6hK0MUIKP8IYZA3GxuzfgkvWBLCFwCpDik) + +[Russian](https://www.locize.io/register?invitation=da4V9Q8DVO3M1FIlvfT50ZiS8NDNgvC0dE5hHUEAp47FXy6pLXmf1cp2lgLBfLmb) + +[Swedish](https://www.locize.io/register?invitation=uR4kzBZC1vhJe6jyMwYXgGPj84QDMulQRlt2s6rONU6ljUh5dgwuUyhJEtZ4REA3) + +[Italian](https://www.locize.io/register?invitation=viAS1NC5q342OxtuIv3JFX9DJ3KoR4SmGoElkBlRMphsDKt4hy9bW8JfBjHlfnd7) + +[Spanish](https://www.locize.io/register?invitation=ZikXW3KI4w4eo5Cf6L1aQMWaR69XAQ0a9Va3NGorH7mAPvEPXp8w8NLkPNLs5nG8) + +[Ukrainian](https://www.locize.io/register?invitation=TY0s6onqH3Asl05Bh1qB44SNSABL2pTYoturwxAmcNKRnzBZFK7bGfn7kVi23Vpg) + +[Vietnamese](https://www.locize.io/register?invitation=eqfHDm0vaqxGfQ5TGt6SeV0dx9b2dCp1RrMRdIRavqzOCOAfD3IElzUsyIT689cK) + +[Portugese-Brazil](https://www.locize.io/register?invitation=Qc5Dq449xbblQqLTpWeMfsyFiu3gACcgpj0EIucQjjs9Ph9pzPLpq3MnZupF9t6N) + +Don't see your language in the above list? Add a request [here](https://github.com/OHIF/Viewers/issues/618) so that we can create the language for your translation contribution. diff --git a/platform/docs/docusaurus.config.js b/platform/docs/docusaurus.config.js index 66263cc19..3c2e3e948 100644 --- a/platform/docs/docusaurus.config.js +++ b/platform/docs/docusaurus.config.js @@ -224,11 +224,11 @@ const isI18nStaging = process.env.I18N_STAGING === 'true'; liveCodeBlock: { playgroundPosition: 'bottom', }, - hideableSidebar: true, + hideableSidebar: false, colorMode: { - defaultMode: 'light', + defaultMode: 'dark', disableSwitch: false, - respectPrefersColorScheme: true, + // respectPrefersColorScheme: true, }, // announcementBar: { // id: 'v1-new-domain', @@ -298,98 +298,71 @@ const isI18nStaging = process.env.I18N_STAGING === 'true'; }, footer: { style: 'dark', - // links: [ - // { - // title: 'Learn', - // items: [ - // { - // label: 'Introduction', - // to: 'docs', - // }, - // { - // label: 'Installation', - // to: 'docs/installation', - // }, - // { - // label: 'Migration from v1 to v2', - // to: 'docs/migration', - // }, - // ], - // }, - // { - // title: 'Community', - // items: [ - // { - // label: 'Stack Overflow', - // href: 'https://stackoverflow.com/questions/tagged/docusaurus', - // }, - // { - // label: 'Feedback', - // to: 'feedback', - // }, - // { - // label: 'Discord', - // href: 'https://discordapp.com/invite/docusaurus', - // }, - // { - // label: 'Help', - // to: '/community/support', - // }, - // ], - // }, - // { - // title: 'More', - // items: [ - // { - // label: 'Blog', - // to: 'blog', - // }, - // { - // label: 'GitHub', - // href: 'https://github.com/OHIF/Viewers', - // }, - // { - // label: 'Twitter', - // href: 'https://twitter.com/docusaurus', - // }, - // { - // html: ` - // - // Deploys by Netlify - // - // `, - // }, - // ], - // }, - // { - // title: 'Legal', - // // Please do not remove the privacy and terms, it's a legal requirement. - // items: [ - // { - // label: 'Privacy', - // href: 'https://opensource.facebook.com/legal/privacy/', - // }, - // { - // label: 'Terms', - // href: 'https://opensource.facebook.com/legal/terms/', - // }, - // { - // label: 'Data Policy', - // href: 'https://opensource.facebook.com/legal/data-policy/', - // }, - // { - // label: 'Cookie Policy', - // href: 'https://opensource.facebook.com/legal/cookie-policy/', - // }, - // ], - // }, - // ], + links: [ + { + title: 'Learn', + items: [ + { + label: 'Introduction', + to: '/', + }, + { + label: 'Installation', + to: 'development/getting-started', + }, + ], + }, + { + title: 'Community', + items: [ + { + label: 'Feedback', + to: 'https://community.ohif.com/', + }, + { + label: 'Discourse Forum', + href: 'https://community.ohif.com/', + }, + { + label: 'Help', + to: '/help', + }, + ], + }, + { + title: 'More', + items: [ + { + label: 'GitHub', + href: 'https://github.com/OHIF/Viewers', + }, + { + label: 'Twitter', + href: 'https://twitter.com/OHIFviewer', + }, + { + html: ` + + Deploys by Netlify + + `, + }, + ], + }, + { + title: 'Legal', + // Please do not remove the privacy and terms, it's a legal requirement. + items: [ + + ], + }, + ], logo: { alt: 'OHIF ', - src: 'img/ohif.svg', + src: 'img/logo-ohif.svg', href: 'https://ohif.org', }, - copyright: `Copyright © OHIF`, + copyright: `MIT © OHIF`, }, }, }); diff --git a/platform/docs/src/css/custom.css b/platform/docs/src/css/custom.css index 74ba0f27f..9b35ba59f 100644 --- a/platform/docs/src/css/custom.css +++ b/platform/docs/src/css/custom.css @@ -1,25 +1,82 @@ +@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap"); + /* stylelint-disable docusaurus/copyright-header */ /** * Any CSS included here will be global. The classic template * bundles Infima by default. Infima is a CSS framework designed to * work well for content-centric websites. */ - /* You can override the default Infima variables here. */ +/* https://infima.dev/docs/utilities/colors */ +/* https://docs.theochu.com/docusaurus/styling/ */ :root { - --ifm-color-primary: #25c2a0; + /*--ifm-color-primary: #25c2a0; --ifm-color-primary-dark: rgb(33, 175, 144); --ifm-color-primary-darker: rgb(31, 165, 136); --ifm-color-primary-darkest: rgb(26, 136, 112); --ifm-color-primary-light: rgb(70, 203, 174); --ifm-color-primary-lighter: rgb(102, 212, 189); - --ifm-color-primary-lightest: rgb(146, 224, 208); + --ifm-color-primary-lightest: rgb(146, 224, 208);*/ + --ifm-color-primary: #1c296d; + --ifm-color-primary-dark: #192562; + --ifm-color-primary-darker: #18235d; + --ifm-color-primary-darkest: #141d4c; + --ifm-color-primary-light: #1f2d78; + --ifm-color-primary-lighter: #202f7d; + --ifm-color-primary-lightest: #24358e; --ifm-code-font-size: 95%; + --ifm-background-color: #f5ffff; + --ifm-background-surface-color: #f5ffff; + --ifm-menu-color: #002e85; +} +html[data-theme="dark"] { + --ifm-color-primary: #5acce6; + --ifm-color-primary-dark: #3ec3e2; + --ifm-color-primary-darker: #30bfe0; + --ifm-color-primary-darkest: #1da4c3; + --ifm-color-primary-light: #76d5ea; + --ifm-color-primary-lighter: #84d9ec; + --ifm-color-primary-lightest: #ade6f3; + --ifm-background-color: #080b2b; + --ifm-background-surface-color: #080b2b; + --ifm-menu-color: #7bb2ce; } - .docusaurus-highlight-code-line { background-color: rgb(72, 77, 91); display: block; margin: 0 calc(-1 * var(--ifm-pre-padding)); padding: 0 var(--ifm-pre-padding); } + + +html { + font-size: 18px; +} + +body { + font-family: "Inter", sans-serif; +} + +h1, +h2, +h3, +h4, +h5 { + color: var(--ifm-color-primary); + font-weight: 400; + font-family: "Inter", sans-serif; +} + +.menu { + font-weight: 400; + font-size: 1.0rem; +} + +.menu__list-item .menu__list{ + font-weight: 400; + font-size: 0.9rem; +} + +.table-of-contents { + font-size: 0.8rem; +}