1
0
Fork 1
mirror of https://github.com/SomboChea/ui synced 2024-05-20 02:11:36 +07:00

Compare commits

...

33 Commits

Author SHA1 Message Date
Priscila Oliveira 254d35ab93
Merge branch 'master' into master 2020-05-07 21:32:18 +02:00
刘相轩 70bb6b5e65
Improve zh-CN translation (#476) 2020-05-07 21:29:48 +02:00
Sambo Chea 563a6677f6 fixed khmer language icon missing 2020-05-06 09:07:12 +07:00
Sambo Chea c2c94929a7 add cambodia flag (khmer) and cleanup 2020-05-05 19:27:53 +07:00
Sambo Chea 484543dabc updated translation config for khmer 2020-05-05 19:14:17 +07:00
Sambo Chea 3c5fd072f0 updated translation config for khmer 2020-05-05 19:14:11 +07:00
Sambo Chea 35be83f560 updated trans lanuages for khmer 2020-05-05 19:12:43 +07:00
Sambo Chea ee9ef143d2 completed file trans for khmer language 2020-05-05 19:09:42 +07:00
Sambo Chea b06ae66961 completed file trans for khmer language 2020-05-05 19:09:24 +07:00
Sambo Chea 57f45e7867 completed file trans for khmer language 2020-05-05 19:09:20 +07:00
Sambo Chea 37e3574fb1 copy trans en-US to km-KH for Cambodia (Khmer) 2020-05-05 18:40:42 +07:00
Gjorgji Jankovski 7e56c8e7e2
fix: when scope is provided use proper separator (#457) 2020-05-05 09:17:33 +02:00
Mykola b59840d352
add a new language - Ukrainian && fix bug with dayjs locale (#472) 2020-05-03 17:45:17 +02:00
Priscila Oliveira 2965973f77
ref(doc): replaced cs_cz with czech (#474) 2020-05-03 15:28:38 +02:00
hdmr14 c9910c97b0
fix: time format localization (#471) 2020-05-03 15:17:38 +02:00
Priscila Oliveira 1e060474c7
ref(doc): updated translation section (#473) 2020-05-03 08:21:59 +02:00
Jean-Francois Thuong f8101ae90a
fix: update zh-CN.json (#466)
Improve list of languages in Chinese (Simplified) and other misc improvements

Co-authored-by: Juan Picado <juanpicado19@gmail.com>
2020-05-02 09:35:08 +02:00
Jean-Francois Thuong bf54b4abab
Update fr-FR.json (#467)
Improve list of languages in French
2020-05-01 20:14:09 +02:00
Juan Picado @jotadeveloper 5e3c006cbd
chore(release): 1.7.1 2020-04-27 21:37:54 +02:00
Priscila Oliveira f44abd7dd0
fix(i18n): fixed current locale (#462)
* fix(i18n): fixed current locale

* Update i18n/translations/ja-JP.json

Co-Authored-By: hdmr14 <58992133+hdmr14@users.noreply.github.com>

Co-authored-by: hdmr14 <58992133+hdmr14@users.noreply.github.com>
2020-04-27 21:36:40 +02:00
Juan Picado @jotadeveloper 730c3471c2
chore(release): 1.7.0 2020-04-24 07:40:57 +02:00
hdmr14 25def6ccd5
feat: add japanese translations (#460)
* feat: add japanese translations

* fix: remove redundant words in ja-JP translation

Co-authored-by: Juan Picado <juanpicado19@gmail.com>
2020-04-24 07:39:09 +02:00
Juan Picado @jotadeveloper ae0546c0e2
chore(release): 1.6.0 2020-04-23 08:24:14 +02:00
Priscila Oliveira 675ee980ee
feat(lng): Added change language on the fly (#456)
* feat(lng): added change language on the fly

* fixed dropdown

* applied feedbacks

* added translation

* updated bundlesize

* fixed error

* updated snaps

* added french language

* added language in storage

* updated styles

* fixed tests
2020-04-23 08:20:41 +02:00
Liam JACK b17368470d
feat: Add french language + minor english language fix (#459)
* feat: Add french language + minor english language fix

* Added fr-FR to i18n config + DayJS locale loader

Co-authored-by: Liam JACK <1422590-liamjack@users.noreply.gitlab.com>
2020-04-17 08:42:38 +02:00
Juan Picado @jotadeveloper 2a6ad969cc
chore(release): 1.5.0 2020-04-08 22:34:41 +02:00
dependabot-preview[bot] e0377991fa
build(deps-dev): bump @types/jest from 24.0.24 to 25.1.4 (#451) 2020-04-05 20:27:09 +02:00
Priscila Oliveira 07620e5d4b
feat(flag): Added Germany flag (#454) 2020-04-05 20:25:38 +02:00
Priscila Oliveira d29aa05cc6
fix(styles): Updated dark colors (#455)
* ref(styles): updated dark colors

* updated snaps
2020-04-05 19:34:42 +02:00
dependabot-preview[bot] 1e1c088ac3
build(deps-dev): bump in-publish from 2.0.0 to 2.0.1 (#450)
Bumps [in-publish](https://github.com/iarna/in-publish) from 2.0.0 to 2.0.1.
- [Release notes](https://github.com/iarna/in-publish/releases)
- [Commits](https://github.com/iarna/in-publish/compare/v2.0.0...v2.0.1)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>

Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>
Co-authored-by: Juan Picado @jotadeveloper <juanpicado19@gmail.com>
2020-04-04 22:32:39 +02:00
Juan Picado @jotadeveloper 7c45ac9f8d
chore: publish release as non-draft 2020-04-02 21:38:21 +02:00
Juan Picado @jotadeveloper 76115d2fdd
chore(release): 1.4.0 2020-04-02 21:36:55 +02:00
JackyChan 03114a842b
feat: added zh-CN translations to the UI (#448) 2020-04-02 09:07:56 +02:00
51 changed files with 1865 additions and 296 deletions

View File

@ -3,7 +3,7 @@
"files": null,
"lines": null
},
"generated_at": "2019-09-29T18:19:50Z",
"generated_at": "2020-05-05T12:14:08Z",
"plugins_used": [
{
"name": "AWSKeyDetector"
@ -23,6 +23,7 @@
"name": "HexHighEntropyString"
},
{
"keyword_exclude": null,
"name": "KeywordDetector"
},
{
@ -36,5 +37,9 @@
}
],
"results": {},
"version": "0.12.4"
}
"version": "0.13.0",
"word_list": {
"file": null,
"hash": null
}
}

View File

@ -2,6 +2,47 @@
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
### [1.7.1](https://github.com/verdaccio/ui/compare/v1.7.0...v1.7.1) (2020-04-27)
### Bug Fixes
* **i18n:** fixed current locale ([#462](https://github.com/verdaccio/ui/issues/462)) ([f44abd7](https://github.com/verdaccio/ui/commit/f44abd7dd08a8d68b1bfc2bf0c053f3e80a343d0))
## [1.7.0](https://github.com/verdaccio/ui/compare/v1.6.0...v1.7.0) (2020-04-24)
### Features
* add japanese translations ([#460](https://github.com/verdaccio/ui/issues/460)) ([25def6c](https://github.com/verdaccio/ui/commit/25def6ccd5a42d43af1c33e7ace4bd7fdbec0e64))
## [1.6.0](https://github.com/verdaccio/ui/compare/v1.5.0...v1.6.0) (2020-04-23)
### Features
* **lng:** Added change language on the fly ([#456](https://github.com/verdaccio/ui/issues/456)) ([675ee98](https://github.com/verdaccio/ui/commit/675ee980ee2c4c789e52d38553f751bb219d1270))
* Add french language + minor english language fix ([#459](https://github.com/verdaccio/ui/issues/459)) ([b173684](https://github.com/verdaccio/ui/commit/b17368470d63878292aca3e6d2f9adc97748ebac))
## [1.5.0](https://github.com/verdaccio/ui/compare/v1.4.0...v1.5.0) (2020-04-08)
### Features
* **flag:** Added Germany flag ([#454](https://github.com/verdaccio/ui/issues/454)) ([07620e5](https://github.com/verdaccio/ui/commit/07620e5d4b1ed54bae2266d936af5306bfbe2d8b))
### Bug Fixes
* **styles:** Updated dark colors ([#455](https://github.com/verdaccio/ui/issues/455)) ([d29aa05](https://github.com/verdaccio/ui/commit/d29aa05cc6ef31cb871e79de10c1b1ddd74f023e))
## [1.4.0](https://github.com/verdaccio/ui/compare/v1.3.0...v1.4.0) (2020-04-02)
### Features
* added zh-CN translations to the UI ([#448](https://github.com/verdaccio/ui/issues/448)) ([03114a8](https://github.com/verdaccio/ui/commit/03114a842b88ae0f482f389e7ae91af62e00bca4))
## [1.3.0](https://github.com/verdaccio/ui/compare/v1.0.4...v1.3.0) (2020-04-01)

View File

@ -105,6 +105,28 @@ If you have any issue you can try the following options, do no desist to ask or
Translations are handled locally. I18n files can be found in the folder ```i18n/translations/*``` of this repository. We would love to provide translations from other languages, embracing all our users, but unfortunately we cannot do this without your help. Would you like to help us? Please feel **super welcome** to add a locale by opening a pull request.
Your PR should contain:
1 - A json file in the folder ```i18n/translations/*``` with the translations. The file must be named according to the new added language
2 - The files ```i18n/config.ts``` and ```LanguageSwitch.tsx``` updated with the new language. Please see the current structure
3 - The other translations containing the new language in the language of the file. Example:
New language: ```cs_CZ ```
The file ```pt-BR ``` should contain:
```
"lng": {
...,
"czech": "Tcheco"
}
```
4 - A SVG flag of the new translated language in the the folder ```src/components/Icon/img/*```. You maybe want to compress the svg file using https://jakearchibald.github.io/svgomg/
### License
Verdaccio is [MIT licensed](https://github.com/verdaccio/verdaccio/blob/master/LICENSE)

View File

@ -5,6 +5,43 @@ import translationEN from './translations/en-US.json';
import translationPT from './translations/pt-BR.json';
import translationES from './translations/es-ES.json';
import translationDE from './translations/de-DE.json';
import translationFR from './translations/fr-FR.json';
import translationCN from './translations/zh-CN.json';
import translationJP from './translations/ja-JP.json';
import translationUA from './translations/uk-UA.json';
import translationKM from './translations/km-KH.json';
const languages = {
'en-US': {
translation: translationEN,
},
'pt-BR': {
translation: translationPT,
},
'es-ES': {
translation: translationES,
},
'de-DE': {
translation: translationDE,
},
'fr-FR': {
translation: translationFR,
},
'zh-CN': {
translation: translationCN,
},
'ja-JP': {
translation: translationJP,
},
'uk-UA': {
translation: translationUA,
},
'km-KH': {
translation: translationKM,
},
};
type Language = keyof typeof languages;
i18n
// pass the i18n instance to react-i18next.
@ -15,22 +52,9 @@ i18n
// in case window.VEDACCIO_LANGUAGE is undefined,it will fall back to 'en-US'
lng: window?.__VERDACCIO_BASENAME_UI_OPTIONS?.language,
fallbackLng: 'en-US',
whitelist: ['en-US', 'pt-BR', 'es-ES', 'de-DE'],
whitelist: ['en-US', 'pt-BR', 'es-ES', 'de-DE', 'fr-FR', 'zh-CN', 'ja-JP', 'uk-UA', 'km-KH'],
load: 'currentOnly',
resources: {
'en-US': {
translation: translationEN,
},
'pt-BR': {
translation: translationPT,
},
'es-ES': {
translation: translationES,
},
'de-DE': {
translation: translationDE,
},
},
resources: languages,
debug: false,
interpolation: {
escapeValue: false, // react already safes from xss
@ -38,3 +62,4 @@ i18n
});
export default i18n;
export { Language };

View File

@ -135,5 +135,18 @@
"app-context-not-correct-used": "Der App-Kontext wurde nicht korrekt verwendet",
"theme-context-not-correct-used": "Der Theme-Kontext wurde nicht korrekt verwendet",
"package-meta-is-required-at-detail-context": "packageMeta wird bei DetailContext benötigt"
}
},
"lng": {
"english": "Englisch",
"japanese": "Japanisch",
"portuguese": "Portugiesisch",
"spanish": "Spanisch",
"german": "Deutsch",
"chinese": "Chinesisch",
"french": "Französisch",
"ukraine": "Ukrainisch",
"khmer": "Khmer"
},
"help-to-translate": "Hilfe beim Übersetzen",
"change-language": "Sprache ändern"
}

View File

@ -8,7 +8,7 @@
},
"dialog": {
"registry-info": {
"title": "Register Info"
"title": "Registry Info"
}
},
"header": {
@ -132,8 +132,21 @@
"page-not-found": "404 - Page not found",
"sorry-we-could-not-find-it": "Sorry, we couldn't find it..."
},
"app-context-not-correct-used": "The app context was not correct used",
"theme-context-not-correct-used": "The theme context was not correct used",
"app-context-not-correct-used": "The app context was not used correctly",
"theme-context-not-correct-used": "The theme context was not used correctly",
"package-meta-is-required-at-detail-context": "packageMeta is required at DetailContext"
}
}
},
"lng": {
"english": "English",
"japanese": "Japanese",
"portuguese": "Portuguese",
"spanish": "Spanish",
"german": "German",
"chinese": "Chinese",
"french": "French",
"ukraine": "Ukraine",
"khmer": "Khmer"
},
"help-to-translate": "Help to translate",
"change-language": "Change language"
}

View File

@ -135,5 +135,18 @@
"app-context-not-correct-used": "El contexto de la aplicación no fue correctamente usado",
"theme-context-not-correct-used": "El contexto del tema no fue correctamente usado",
"package-meta-is-required-at-detail-context": "packageMeta es requerido en DetailContext"
}
},
"lng": {
"english": "Inglés",
"japanese": "Japonés",
"portuguese": "Portugués",
"spanish": "Español",
"german": "Alemán",
"chinese": "Chino",
"french": "Francés",
"ukraine": "Ucraniano",
"khmer": "Khmer"
},
"help-to-translate": "Ayuda a traducir",
"change-language": "Cambiar idioma"
}

View File

@ -0,0 +1,152 @@
{
"copy-to-clipboard": "Copier dans le presse-papier",
"author-anonymous": "Anonyme",
"action-bar-action": {
"visit-home-page": "Visiter la page d'accueil",
"open-an-issue": "Ouvrir un ticket",
"download-tarball": "Télécharger l'archive"
},
"dialog": {
"registry-info": {
"title": "Informations du Registry"
}
},
"header": {
"documentation": "Documentation",
"registry-info": "Informations du Registry",
"greetings": "Bonjour "
},
"search": {
"packages": "Rechercher des paquets"
},
"auto-complete": {
"loading": "En cours de chargement...",
"no-results-found": "Aucun resultat trouvé"
},
"tab": {
"uplinks": "Uplinks",
"versions": "Versions",
"dependencies": "Dépendances",
"readme": "Readme"
},
"uplinks": {
"title": "Uplinks",
"no-items": "{{name}} n'a pas de uplink."
},
"versions": {
"current-tags": "Tags courants",
"version-history": "Historique de version",
"not-available": "Non disponible"
},
"package": {
"published-on": "Publié le {{time}} •",
"version": "v{{version}}",
"visit-home-page": "Visiter la page d'accueil",
"homepage": "Page d'accueil",
"open-an-issue": "Ouvrir un ticket",
"bugs": "Bugs",
"download": "Télécharger {{what}}",
"the-tar-file": "le fichier tar",
"tarball": "Archive"
},
"dependencies": {
"has-no-dependencies": "{{package}} n'a aucune dépendance.",
"dependency-block": "{{package}}@{{version}}"
},
"form": {
"username": "Nom d'utilisateur",
"password": "Mot de passe"
},
"form-placeholder": {
"username": "Votre nom d'utilisateur",
"password": "Votre mot de passe"
},
"form-validation": {
"required-field": "Ce champ est obligatoire",
"required-min-length": "Ce champ doit faire au moins {{length}} caractères",
"unable-to-sign-in": "Connexion impossible",
"username-or-password-cant-be-empty": "Le nom d'utilisateur ou mot de passe ne peut pas être vide!"
},
"help": {
"title": "Aucun paquet publié pour l'instant.",
"sub-title": "Pour publier votre premier paquet:",
"first-step": "1. Se connecter",
"first-step-command-line": "npm adduser --registry {{registryUrl}}",
"second-step": "2. Publier",
"second-step-command-line": "npm publish --registry {{registryUrl}}",
"third-step": "3. Recharger cette page."
},
"sidebar": {
"detail": {
"latest-version": "Dernière v{{version}}",
"version": "v{{version}}"
},
"installation": {
"title": "Installation",
"install-using-yarn": "Installer avec yarn",
"install-using-yarn-command": "yarn add {{packageName}}",
"install-using-npm": "Installer avec npm",
"install-using-npm-command": "npm install {{packageName}}",
"install-using-pnpm": "Installer avec pnpm",
"install-using-pnpm-command": "pnpm install {{packageName}}"
},
"repository": {
"title": "Dépôt"
},
"author": {
"title": "Auteur"
},
"distribution": {
"title": "Dernière distribution",
"license": "Licence",
"size": "Taille",
"file-count": "nombre de fichiers"
},
"maintainers": {
"title": "Mainteneurs"
},
"contributors": {
"title": "Contributeurs"
},
"engines": {
"npm-version": "Version NPM",
"node-js": "NODE JS"
}
},
"footer": {
"powered-by": "Propulsé par",
"made-with-love-on": "Fait avec <0>♥</0> sur"
},
"button": {
"close": "Fermer",
"cancel": "Annuler",
"login": "Se connecter",
"logout": "Se déconnecter",
"go-to-the-home-page": "Aller à la page d'accueil",
"learn-more": "En savoir plus",
"fund-this-package": "<0>Financer</0> ce paquet"
},
"error": {
"unspecific": "Quelque chose a mal tourné.",
"404": {
"page-not-found": "404 - Page non trouvée",
"sorry-we-could-not-find-it": "Desolé, nous n'avons rien retrouvé..."
},
"app-context-not-correct-used": "Le contexte de l'application n'a pas été utilisé correctement",
"theme-context-not-correct-used": "Le contexte du thème n'a pas été utilisé correctement",
"package-meta-is-required-at-detail-context": "packageMeta est obligatoire à DetailContext"
},
"lng": {
"english": "Anglais",
"japanese": "Japonais",
"portuguese": "Portugais",
"spanish": "Espagnol",
"german": "Allemand",
"chinese": "Chinois",
"french": "Français",
"ukraine": "Ukrainien",
"khmer": "Khmer"
},
"help-to-translate": "Aide à la traduction",
"change-language": "Changer la langue"
}

View File

@ -0,0 +1,152 @@
{
"copy-to-clipboard": "クリップボードにコピー",
"author-anonymous": "匿名",
"action-bar-action": {
"visit-home-page": "ホームページへ移動",
"open-an-issue": "課題を開く",
"download-tarball": "tar形式でダウンロード"
},
"dialog": {
"registry-info": {
"title": "レジストリの設定方法"
}
},
"header": {
"documentation": "ドキュメント",
"registry-info": "レジストリ情報",
"greetings": "こんにちは、"
},
"search": {
"packages": "パッケージを検索"
},
"auto-complete": {
"loading": "ロード中...",
"no-results-found": "パッケージが見つかりませんでした"
},
"tab": {
"uplinks": "アップリンク",
"versions": "バージョン情報",
"dependencies": "依存パッケージ",
"readme": "Readme"
},
"uplinks": {
"title": "アップリンク",
"no-items": "{{name}}にアップリンクはありません"
},
"versions": {
"current-tags": "タグ一覧",
"version-history": "バージョン履歴",
"not-available": "利用できません"
},
"package": {
"published-on": "{{time}}に更新されました •",
"version": "v{{version}}",
"visit-home-page": "ホームページへ移動",
"homepage": "ホームページ",
"open-an-issue": "課題を開く",
"bugs": "バグ",
"download": "{{what}}ダウンロード",
"the-tar-file": "tar形式のファイル",
"tarball": "tar形式でダウンロード"
},
"dependencies": {
"has-no-dependencies": "{{package}}に依存パッケージはありません",
"dependency-block": "{{package}}@{{version}}"
},
"form": {
"username": "ユーザ名",
"password": "パスワード"
},
"form-placeholder": {
"username": "あなたのユーザ名",
"password": "あなたのパスワード"
},
"form-validation": {
"required-field": "この項目は必ず入力して下さい",
"required-min-length": "この項目は{{length}}文字以上入力して下さい",
"unable-to-sign-in": "サインインできません",
"username-or-password-cant-be-empty": "ユーザ名とパスワードは空にできません"
},
"help": {
"title": "まだパッケージが登録されていません",
"sub-title": "以下の手順で最初のパッケージを登録しましょう",
"first-step": "1. ログイン",
"first-step-command-line": "npm adduser --registry {{registryUrl}}",
"second-step": "2. 登録",
"second-step-command-line": "npm publish --registry {{registryUrl}}",
"third-step": "3. このページを再読み込みして下さい"
},
"sidebar": {
"detail": {
"latest-version": "最新バージョンは{{version}}です",
"version": "v{{version}}"
},
"installation": {
"title": "インストール方法",
"install-using-yarn": "yarnでインストール",
"install-using-yarn-command": "yarn add {{packageName}}",
"install-using-npm": "npmでインストール",
"install-using-npm-command": "npm install {{packageName}}",
"install-using-pnpm": "pnpmでインストール",
"install-using-pnpm-command": "pnpm install {{packageName}}"
},
"repository": {
"title": "リポジトリ"
},
"author": {
"title": "作者"
},
"distribution": {
"title": "最新の配信内容",
"license": "ライセンス",
"size": "サイズ",
"file-count": "ファイル数"
},
"maintainers": {
"title": "パッケージメンテナ"
},
"contributors": {
"title": "コントリビューター"
},
"engines": {
"npm-version": "NPM Version",
"node-js": "NODE JS"
}
},
"footer": {
"powered-by": "Powered by",
"made-with-love-on": "Made with <0>♥</0> on"
},
"button": {
"close": "閉じる",
"cancel": "キャンセル",
"login": "ログイン",
"logout": "ログアウト",
"go-to-the-home-page": "トップページに戻る",
"learn-more": "もっと知る",
"fund-this-package": "このパッケージに<0>投資</0>"
},
"error": {
"unspecific": "何か問題が発生したようです。",
"404": {
"page-not-found": "404 - Page not found",
"sorry-we-could-not-find-it": "残念ながら、ご指定のページはありませんでした…。"
},
"app-context-not-correct-used": "AppContextが正しく使用されませんでした",
"theme-context-not-correct-used": "ThemeContextが正しく使用されませんでした",
"package-meta-is-required-at-detail-context": "DetailContextではpackageMetaが必要です"
},
"lng": {
"english": "英語",
"japanese": "日本語",
"portuguese": "ポルトガル語",
"spanish": "スペイン語",
"german": "ドイツ語",
"chinese": "中国語",
"french": "フランス語",
"ukraine": "ウクライナ",
"khmer": "Khmer"
},
"help-to-translate": "翻訳を助ける",
"change-language": "言語を変更"
}

View File

@ -0,0 +1,152 @@
{
"copy-to-clipboard": "ចម្លងទៅក្ដារតម្បៀតខ្ទាស់",
"author-anonymous": "គ្មានអត្តសញ្ញាណ",
"action-bar-action": {
"visit-home-page": "ទស្សនាគេហទំព័រ",
"open-an-issue": "បើកកិច្ចការ",
"download-tarball": "ទាញយកកញ្ចប់ឯកសារ"
},
"dialog": {
"registry-info": {
"title": "ព័ត៌មានការចុះឈ្មោះ"
}
},
"header": {
"documentation": "ឯកសារ",
"registry-info": "ព័ត៌មានការចុះឈ្មោះ",
"greetings": "សួស្តី"
},
"search": {
"packages": "ស្វែងរកកញ្ចប់"
},
"auto-complete": {
"loading": "កំពុងផ្ទុក...",
"no-results-found": "រកមិនឃើញលទ្ធផល"
},
"tab": {
"uplinks": "ភ្ជាប់តំណទៅ",
"versions": "កំណែ",
"dependencies": "អាស្រ័យលើ",
"readme": "អានខ្ញុំជាមុនសិន"
},
"uplinks": {
"title": "ភ្ជាប់តំណទៅ",
"no-items": "{{name}} គ្មានភ្ជាប់តំណទៅ។"
},
"versions": {
"current-tags": "ស្លាកបច្ចុប្បន្ន",
"version-history": "ប្រវត្តិសាស្រ្តជំនាន់",
"not-available": "Not available"
},
"package": {
"published-on": "បោះពុម្ភផ្សាយ {{time}}។",
"version": "v{{version}}",
"visit-home-page": "ទស្សនាគេហទំព័រ",
"homepage": "គេហទំព័រ",
"open-an-issue": "បើកកិច្ចការ",
"bugs": "កំហុស",
"download": "ទាញយក {{what}}",
"the-tar-file": "ឯកសាជា tar",
"tarball": "ឯកសារ Tarball"
},
"dependencies": {
"has-no-dependencies": "{{package}} មិនមានភាពអាស្រ័យ។",
"dependency-block": "{{package}}@{{version}}"
},
"form": {
"username": "ឈ្មោះអ្នកប្រើប្រាស់",
"password": "ពាក្យសម្ងាត់"
},
"form-placeholder": {
"username": "ឈ្មោះអ្នកប្រើរបស់អ្នក",
"password": "ពាក្យសម្ងាត់ខ្លាំងរបស់អ្នក"
},
"form-validation": {
"required-field": "ចន្លោះនេះត្រូវតែំពេញ",
"required-min-length": "ប្រអប់នេះទាមទារប្រវែងអប្បបរមា {{length}}",
"unable-to-sign-in": "មិនអាចចូលបានទេ",
"username-or-password-cant-be-empty": "ឈ្មោះអ្នកប្រើឬពាក្យសម្ងាត់មិនអាចទទេ!"
},
"help": {
"title": "មិនទាន់មានការបោះពុម្ពផ្សាយកញ្ចប់នៅឡើយទេ។",
"sub-title": "ដើម្បីផ្សព្វផ្សាយកញ្ចប់ដំបូងរបស់អ្នកគ្រាន់តែ៖",
"first-step": "1. ចូល",
"first-step-command-line": "npm adduser --registry {{registryUrl}}",
"second-step": "2. ផ្សព្វផ្សាយ",
"second-step-command-line": "npm publish --registry {{registryUrl}}",
"third-step": "ផ្ទុកទំព័រនេះឡើងវិញ។"
},
"sidebar": {
"detail": {
"latest-version": "ចុងក្រោយ v{{version}}",
"version": "v{{version}}"
},
"installation": {
"title": "ការដំឡើង",
"install-using-yarn": "ដំឡើងដោយប្រើ yarn",
"install-using-yarn-command": "yarn add {{packageName}}",
"install-using-npm": "ដំឡើងដោយប្រើ npm",
"install-using-npm-command": "npm install {{packageName}}",
"install-using-pnpm": "ដំឡើងដោយប្រើ pnpm",
"install-using-pnpm-command": "pnpm install {{packageName}}"
},
"repository": {
"title": "ឃ្លាំង"
},
"author": {
"title": "អ្នកនិពន្ធ"
},
"distribution": {
"title": "ការចែកចាយចុងក្រោយ",
"license": "អាជ្ញាប័ណ្ណ",
"size": "ទំហំ",
"file-count": "រាប់ឯកសារ"
},
"maintainers": {
"title": "អ្នកថែរក្សា"
},
"contributors": {
"title": "អ្នកចូលរួមអភិវឌ្ឍ"
},
"engines": {
"npm-version": "NPM កំណែ",
"node-js": "NODE JS"
}
},
"footer": {
"powered-by": "ឧបត្ថម្ភដោយ",
"made-with-love-on": "ផលិតជាមួយ <0>♥</0> លើ"
},
"button": {
"close": "បិទ",
"cancel": "បោះបង់",
"login": "ចូល",
"logout": "ចាកចេញ",
"go-to-the-home-page": "ទៅទំព័រដើម",
"learn-more": "ស្វែងយល់បន្ថែម",
"fund-this-package": "<0>Fund</0> កញ្ចប់នេះ"
},
"error": {
"unspecific": "មានអ្វីមួយមិនប្រក្រតី។",
"404": {
"page-not-found": "៤០៤ - រកមិនឃើញទំព័រ",
"sorry-we-could-not-find-it": "សូមទោសយើងមិនអាចរកវាឃើញទេ..."
},
"app-context-not-correct-used": "បរិបទកម្មវិធីមិនត្រូវបានប្រើត្រឹមត្រូវទេ",
"theme-context-not-correct-used": "បរិបទទម្រង់មិនត្រូវបានប្រើត្រឹមត្រូវទេ",
"package-meta-is-required-at-detail-context": "packageMeta ត្រូវបានទាមទារនៅ DetailContext"
},
"lng": {
"english": "អង់គ្លេស",
"japanese": "ជប៉ុន",
"portuguese": "ព័រទុយហ្កាល់",
"spanish": "អេស្ប៉ាញ",
"german": "អាឡឺម៉ង់",
"chinese": "ចិន",
"french": "បារាំង",
"ukraine": "អ៊ុយក្រែន",
"khmer": "ខ្មែរ"
},
"help-to-translate": "ជួយបកប្រែ",
"change-language": "ប្ដូរភាសា"
}

View File

@ -114,7 +114,7 @@
}
},
"footer": {
"powered-by": "Distribuído por",
"powered-by": "Feito por",
"made-with-love-on": "Feito com amor <0>♥</0> no(a)"
},
"button": {
@ -135,5 +135,18 @@
"app-context-not-correct-used": "O contexto do aplicativo não foi usado corretamente",
"theme-context-not-correct-used": "O contexto do tema não foi usado corretamente",
"package-meta-is-required-at-detail-context": "packageMeta é requerido em DetailContext"
}
}
},
"lng": {
"english": "Inglês",
"japanese": "Japonês",
"portuguese": "Português",
"spanish": "Espanhol",
"german": "Alemão",
"chinese": "Chinês",
"french": "Francês",
"ukraine": "Ucraniano",
"khmer": "Khmer"
},
"help-to-translate": "Ajude a traduzir",
"change-language": "Mudar idioma"
}

View File

@ -0,0 +1,152 @@
{
"copy-to-clipboard": "Копіювати в буфер обміну",
"author-anonymous": "Анонімний",
"action-bar-action": {
"visit-home-page": "Відвідати домашню сторінку",
"open-an-issue": "Відкрити питання, проблему, ...",
"download-tarball": "Завантажити архів"
},
"dialog": {
"registry-info": {
"title": "Інформація про реєстр"
}
},
"header": {
"documentation": "Документація",
"registry-info": "Інформація про реєстр",
"greetings": "Привіт "
},
"search": {
"packages": "Пошук пакетів"
},
"auto-complete": {
"loading": "Завантаження...",
"no-results-found": "Нічого не знайдено"
},
"tab": {
"uplinks": "Публікації",
"versions": "Версії",
"dependencies": "Залежності",
"readme": "Опис"
},
"uplinks": {
"title": "Публікації",
"no-items": "{{name}} не опубліковано."
},
"versions": {
"current-tags": "Поточні теги",
"version-history": "Історія версій",
"not-available": "Недоступний"
},
"package": {
"published-on": "Опубліковано {{time}} •",
"version": "v{{version}}",
"visit-home-page": "Відвідати домашню сторінку",
"homepage": "Домашня сторінка",
"open-an-issue": "Відкрити питання, проблему, ...",
"bugs": "Помилки",
"download": "Завантажити {{what}}",
"the-tar-file": "файл tar",
"tarball": "Завантажити"
},
"dependencies": {
"has-no-dependencies": "{{package}} не має залежностей.",
"dependency-block": "{{package}}@{{version}}"
},
"form": {
"username": "Ім'я користувача",
"password": "Пароль"
},
"form-placeholder": {
"username": "Ваше ім'я користувача",
"password": "Ваш надійний пароль"
},
"form-validation": {
"required-field": "Це поле є обов'язковим",
"required-min-length": "Для цього поля потрібна мінімальна довжина {{length}}",
"unable-to-sign-in": "Неможливо ввійти",
"username-or-password-cant-be-empty": "Ім'я користувача або пароль не можуть бути порожніми !"
},
"help": {
"title": "Пакети ще не опубліковані",
"sub-title": "Опублікувати свій перший пакет просто:",
"first-step": "1. Підключіться",
"first-step-command-line": "npm adduser --registry {{registryUrl}}",
"second-step": "2. Опублікуйте",
"second-step-command-line": "npm publish --registry {{registryUrl}}",
"third-step": "3. Оновіть цю сторінку."
},
"sidebar": {
"detail": {
"latest-version": "Остання версія v{{version}}",
"version": "v{{version}}"
},
"installation": {
"title": "Встановлення",
"install-using-yarn": "Встановлення за допомогою yarn",
"install-using-yarn-command": "yarn add {{packageName}}",
"install-using-npm": "Встановлення за допомогою npm",
"install-using-npm-command": "npm install {{packageName}}",
"install-using-pnpm": "Встановлення за допомогою pnpm",
"install-using-pnpm-command": "pnpm install {{packageName}}"
},
"repository": {
"title": "Сховище"
},
"author": {
"title": "Автор"
},
"distribution": {
"title": "Умови поширення",
"license": "Ліцензія",
"size": "Розмір",
"file-count": "кількість файлів"
},
"maintainers": {
"title": "Технічне супроводження"
},
"contributors": {
"title": "Автори"
},
"engines": {
"npm-version": "NPM версія",
"node-js": "NODE JS"
}
},
"footer": {
"powered-by": "Працює на",
"made-with-love-on": "Зроблено з <0> ♥ </0> на"
},
"button": {
"close": "Закрити",
"cancel": "Скасувати",
"login": "Вхід",
"logout": "Вийти",
"go-to-the-home-page": "Перейдіть на головну сторінку",
"learn-more": "Вивчайте більше",
"fund-this-package": "<0>Фінансувати</0> цей пакет"
},
"error": {
"unspecific": "Щось пішло не так.",
"404": {
"page-not-found": "404 - Сторінку не знайдено",
"sorry-we-could-not-find-it": "На жаль, ми не змогли його знайти ..."
},
"app-context-not-correct-used": "Контекст програми не використовувався правильно",
"theme-context-not-correct-used": "Контекст теми використано неправильно",
"package-meta-is-required-at-detail-context": "packageMeta is required at DetailContext"
},
"lng": {
"english": "Англійська",
"japanese": "Японська",
"portuguese": "Португальська",
"spanish": "Іспанська",
"german": "Німецька",
"chinese": "Китайська",
"french": "Французька",
"ukraine": "Українська",
"khmer": "Khmer"
},
"help-to-translate": "Допоможіть перекласти",
"change-language": "Змінити мову"
}

View File

@ -0,0 +1,152 @@
{
"copy-to-clipboard": "复制到粘贴板",
"author-anonymous": "匿名",
"action-bar-action": {
"visit-home-page": "访问主页",
"open-an-issue": "提交问题",
"download-tarball": "下载 tarball"
},
"dialog": {
"registry-info": {
"title": "注册信息"
}
},
"header": {
"documentation": "文档",
"registry-info": "登记信息",
"greetings": "您好 "
},
"search": {
"packages": "查找Packages"
},
"auto-complete": {
"loading": "加载中...",
"no-results-found": "没有找到结果"
},
"tab": {
"uplinks": "Uplinks",
"versions": "版本",
"dependencies": "依赖",
"readme": "Readme"
},
"uplinks": {
"title": "Uplinks",
"no-items": "{{name}} has no uplinks."
},
"versions": {
"current-tags": "当前标签",
"version-history": "历史版本",
"not-available": "不可用"
},
"package": {
"published-on": "发布于 {{time}} •",
"version": "v{{version}}",
"visit-home-page": "访问主页",
"homepage": "主页",
"open-an-issue": "提交问题",
"bugs": "Bugs",
"download": "下载 {{what}}",
"the-tar-file": "tar 文件",
"tarball": "Tarball"
},
"dependencies": {
"has-no-dependencies": "{{package}} 没有依赖包.",
"dependency-block": "{{package}}@{{version}}"
},
"form": {
"username": "用户名",
"password": "密码"
},
"form-placeholder": {
"username": "您的用户名",
"password": "您的密码"
},
"form-validation": {
"required-field": "必填项",
"required-min-length": "长度不能小于 {{length}}",
"unable-to-sign-in": "登录失败",
"username-or-password-cant-be-empty": "用户名或密码不能为空!"
},
"help": {
"title": "还没有发布任何 NPM 包.",
"sub-title": "发布第一个 NPM 包:",
"first-step": "1. 登录",
"first-step-command-line": "npm adduser --registry {{registryUrl}}",
"second-step": "2. 发布",
"second-step-command-line": "npm publish --registry {{registryUrl}}",
"third-step": "3. 刷新当前页面."
},
"sidebar": {
"detail": {
"latest-version": "最新版本 v{{version}}",
"version": "v{{version}}"
},
"installation": {
"title": "安装",
"install-using-yarn": "使用 yarn 安装",
"install-using-yarn-command": "yarn add {{packageName}}",
"install-using-npm": "使用 npm 安装",
"install-using-npm-command": "npm install {{packageName}}",
"install-using-pnpm": "使用 pnpm 安装",
"install-using-pnpm-command": "pnpm install {{packageName}}"
},
"repository": {
"title": "库"
},
"author": {
"title": "作者"
},
"distribution": {
"title": "发布信息",
"license": "许可",
"size": "大小",
"file-count": "文件数量"
},
"maintainers": {
"title": "维护人"
},
"contributors": {
"title": "贡献者"
},
"engines": {
"npm-version": "NPM 版本",
"node-js": "NODE JS"
}
},
"footer": {
"powered-by": "Powered by",
"made-with-love-on": "Made with <0>♥</0> on"
},
"button": {
"close": "关闭",
"cancel": "取消",
"login": "登录",
"logout": "注销",
"go-to-the-home-page": "跳转到主页",
"learn-more": "了解更多",
"fund-this-package": "<0>Fund</0> this package"
},
"error": {
"unspecific": "发生错误.",
"404": {
"page-not-found": "404 - 页面不存在",
"sorry-we-could-not-find-it": "对不起, 我们没找到..."
},
"app-context-not-correct-used": "app context 没有被正确使用",
"theme-context-not-correct-used": "theme context 没有被正确使用",
"package-meta-is-required-at-detail-context": "packageMeta is required at DetailContext"
},
"lng": {
"english": "英语",
"japanese": "日语",
"portuguese": "葡萄牙语",
"spanish": "西班牙语",
"german": "德语",
"chinese": "中文",
"french": "法语",
"ukraine": "乌克兰",
"khmer": "Khmer"
},
"help-to-translate": "帮助翻译",
"change-language": "改变语言"
}

View File

@ -1,6 +1,6 @@
{
"name": "@verdaccio/ui-theme",
"version": "1.3.0",
"version": "1.7.1",
"description": "Verdaccio User Interface",
"author": {
"name": "Verdaccio Core Team",
@ -26,7 +26,7 @@
"@testing-library/react": "9.4.0",
"@types/autosuggest-highlight": "3.1.0",
"@types/enzyme": "3.10.4",
"@types/jest": "24.0.24",
"@types/jest": "25.1.4",
"@types/js-base64": "2.3.1",
"@types/lodash": "4.14.149",
"@types/node": "13.1.6",
@ -73,7 +73,7 @@
"husky": "3.1.0",
"i18next": "19.1.0",
"identity-obj-proxy": "3.0.0",
"in-publish": "2.0.0",
"in-publish": "2.0.1",
"jest": "24.9.0",
"jest-emotion": "10.0.27",
"jest-environment-jsdom": "24.9.0",
@ -140,11 +140,11 @@
"bundlesize": [
{
"path": "./static/vendors.*.js",
"maxSize": "200 kB"
"maxSize": "210 kB"
},
{
"path": "./static/main.*.js",
"maxSize": "30 kB"
"maxSize": "35 kB"
},
{
"path": "./static/[0-9].*.{js,css}",

View File

@ -4984,4 +4984,4 @@
"_rev": "61-e6be890a78963127",
"readme": "# jQuery\n\n> jQuery is a fast, small, and feature-rich JavaScript library.\n\nFor information on how to get started and how to use jQuery, please see [jQuery's documentation](http://api.jquery.com/).\nFor source files and issues, please visit the [jQuery repo](https://github.com/jquery/jquery).\n\nIf upgrading, please see the [blog post for 3.3.1](https://blog.jquery.com/2017/03/20/jquery-3.3.1-now-available/). This includes notable differences from the previous version and a more readable changelog.\n\n## Including jQuery\n\nBelow are some of the most common ways to include jQuery.\n\n### Browser\n\n#### Script tag\n\n```html\n<script src=\"https://code.jquery.com/jquery-3.3.1.min.js\"></script>\n```\n\n#### Babel\n\n[Babel](http://babeljs.io/) is a next generation JavaScript compiler. One of the features is the ability to use ES6/ES2015 modules now, even though browsers do not yet support this feature natively.\n\n```js\nimport $ from \"jquery\";\n```\n\n#### Browserify/Webpack\n\nThere are several ways to use [Browserify](http://browserify.org/) and [Webpack](https://webpack.github.io/). For more information on using these tools, please refer to the corresponding project's documention. In the script, including jQuery will usually look like this...\n\n```js\nvar $ = require(\"jquery\");\n```\n\n#### AMD (Asynchronous Module Definition)\n\nAMD is a module format built for the browser. For more information, we recommend [require.js' documentation](http://requirejs.org/docs/whyamd.html).\n\n```js\ndefine([\"jquery\"], function($) {\n\n});\n```\n\n### Node\n\nTo include jQuery in [Node](nodejs.org), first install with npm.\n\n```sh\nnpm install jquery\n```\n\nFor jQuery to work in Node, a window with a document is required. Since no such window exists natively in Node, one can be mocked by tools such as [jsdom](https://github.com/tmpvar/jsdom). This can be useful for testing purposes.\n\n```js\nrequire(\"jsdom\").env(\"\", function(err, window) {\n\tif (err) {\n\t\tconsole.error(err);\n\t\treturn;\n\t}\n\n\tvar $ = require(\"jquery\")(window);\n});\n```",
"_id": "jquery"
}
}

View File

@ -17,7 +17,7 @@ getStdin()
repo: repoName,
tag_name: tag,
body: changelog,
draft: true,
draft: false,
})
)
.catch(err => {

View File

@ -13,10 +13,10 @@ import Loading from '../components/Loading';
import Box from '../muiComponents/Box';
import StyleBaseline from '../design-tokens/StyleBaseline';
import { Theme } from '../design-tokens/theme';
import loadDayJSLocale from '../design-tokens/load-dayjs-locale';
import AppContextProvider from './AppContextProvider';
import AppRoute, { history } from './AppRoute';
import loadDayJSLocale from './load-dayjs-locale';
const StyledBox = styled(Box)<{ theme?: Theme }>(({ theme }) => ({
backgroundColor: theme?.palette.background.default,

View File

@ -1,12 +1,13 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<App /> should display the Header component 1`] = `
.emotion-78 {
.emotion-85 {
background-color: #fff;
}
.emotion-24 {
.emotion-28 {
background-color: #4b5e40;
color: #fff;
min-height: 60px;
display: -webkit-box;
display: -webkit-flex;
@ -19,29 +20,29 @@ exports[`<App /> should display the Header component 1`] = `
}
@media (min-width:768px) {
.emotion-24 .emotion-13 {
.emotion-28 .emotion-13 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.emotion-24 .emotion-17 {
.emotion-28 .emotion-17 {
display: none;
}
.emotion-24 .e1jf5lit4 {
.emotion-28 .e1jf5lit4 {
display: none;
}
}
@media (min-width:1024px) {
.emotion-24 .emotion-23 {
.emotion-28 .emotion-27 {
padding: 0 20px;
}
@media (min-width:1275px) {
.emotion-24 .emotion-23 {
.emotion-28 .emotion-27 {
max-width: 1240px;
width: 100%;
margin: 0 auto;
@ -49,7 +50,7 @@ exports[`<App /> should display the Header component 1`] = `
}
}
.emotion-22 {
.emotion-26 {
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
@ -127,7 +128,7 @@ exports[`<App /> should display the Header component 1`] = `
overflow-y: auto;
}
.emotion-20 {
.emotion-24 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -139,12 +140,32 @@ exports[`<App /> should display the Header component 1`] = `
display: block;
}
.emotion-20 {
display: none;
}
@media screen and (min-width:768px) {
.emotion-20 {
display: inline-block;
}
}
.emotion-18 {
display: none;
}
@media screen and (min-width:768px) {
.emotion-18 {
display: inline-block;
}
}
.emotion-22 {
color: #fff;
}
@media screen and (min-width:1240px) {
.emotion-36 {
.emotion-40 {
max-width: 1240px;
width: 100%;
margin-left: auto;
@ -152,7 +173,7 @@ exports[`<App /> should display the Header component 1`] = `
}
}
.emotion-76 {
.emotion-83 {
background: #f9f9f9;
border-top: 1px solid #e3e3e3;
color: #999999;
@ -160,7 +181,7 @@ exports[`<App /> should display the Header component 1`] = `
padding: 20px;
}
.emotion-74 {
.emotion-81 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -177,7 +198,7 @@ exports[`<App /> should display the Header component 1`] = `
}
@media (min-width:768px) {
.emotion-74 {
.emotion-81 {
min-width: 400px;
max-width: 800px;
margin: auto;
@ -189,12 +210,12 @@ exports[`<App /> should display the Header component 1`] = `
}
@media (min-width:1024px) {
.emotion-74 {
.emotion-81 {
max-width: 1240px;
}
}
.emotion-65 {
.emotion-72 {
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
@ -203,7 +224,7 @@ exports[`<App /> should display the Header component 1`] = `
}
@media (min-width:768px) {
.emotion-65 {
.emotion-72 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -211,21 +232,21 @@ exports[`<App /> should display the Header component 1`] = `
}
}
.emotion-38 {
.emotion-42 {
color: #e25555;
padding: 0 5px;
}
.emotion-63 {
.emotion-70 {
position: relative;
height: 18px;
}
.emotion-63:hover .emotion-62 {
.emotion-70:hover .emotion-69 {
visibility: visible;
}
.emotion-41 {
.emotion-45 {
box-sizing: initial;
display: inline-block;
cursor: default;
@ -234,7 +255,7 @@ exports[`<App /> should display the Header component 1`] = `
padding: 0 10px;
}
.emotion-61 {
.emotion-68 {
position: absolute;
background: #d3dddd;
padding: 1px 4px;
@ -252,7 +273,7 @@ exports[`<App /> should display the Header component 1`] = `
top: -2px;
}
.emotion-61:before {
.emotion-68:before {
content: '';
position: absolute;
top: 29%;
@ -265,7 +286,7 @@ exports[`<App /> should display the Header component 1`] = `
transform: rotate(90deg);
}
.emotion-44 {
.emotion-48 {
box-sizing: initial;
display: inline-block;
cursor: default;
@ -274,7 +295,7 @@ exports[`<App /> should display the Header component 1`] = `
padding: 0 5px;
}
.emotion-72 {
.emotion-79 {
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
@ -287,7 +308,7 @@ exports[`<App /> should display the Header component 1`] = `
}
@media (min-width:768px) {
.emotion-72 {
.emotion-79 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -295,7 +316,7 @@ exports[`<App /> should display the Header component 1`] = `
}
}
.emotion-70 {
.emotion-77 {
box-sizing: initial;
display: inline-block;
cursor: pointer;
@ -304,12 +325,12 @@ exports[`<App /> should display the Header component 1`] = `
padding: 0 5px;
}
.emotion-67 {
.emotion-74 {
width: 100%;
height: auto;
}
.emotion-34 {
.emotion-38 {
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
@ -318,14 +339,14 @@ exports[`<App /> should display the Header component 1`] = `
position: absolute;
}
.emotion-28 {
.emotion-32 {
margin: 0 0 30px 0;
border-radius: 25px;
box-shadow: 0 10px 20px 0 rgba(69,58,100,0.2);
background: #f7f8f6;
}
.emotion-26 {
.emotion-30 {
display: inline-block;
vertical-align: middle;
box-sizing: border-box;
@ -337,7 +358,7 @@ exports[`<App /> should display the Header component 1`] = `
height: 90px;
}
.emotion-32 {
.emotion-36 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -352,19 +373,19 @@ exports[`<App /> should display the Header component 1`] = `
justify-content: center;
}
.emotion-30 {
.emotion-34 {
color: #4b5e40;
}
<div
class="MuiBox-root MuiBox-root-219 emotion-78 emotion-79"
class="MuiBox-root MuiBox-root-220 emotion-85 emotion-86"
>
<header
class="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionStatic emotion-24 emotion-25 MuiAppBar-colorPrimary"
class="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionStatic emotion-28 emotion-29 MuiAppBar-colorPrimary"
data-testid="header"
>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-22 emotion-23 MuiToolbar-gutters"
class="MuiToolbar-root MuiToolbar-regular emotion-26 emotion-27 MuiToolbar-gutters"
>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-14 emotion-15 MuiToolbar-gutters"
@ -433,7 +454,7 @@ exports[`<App /> should display the Header component 1`] = `
</div>
</div>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-20 emotion-21 MuiToolbar-gutters"
class="MuiToolbar-root MuiToolbar-regular emotion-24 emotion-25 MuiToolbar-gutters"
data-testid="header-right"
>
<button
@ -460,8 +481,53 @@ exports[`<App /> should display the Header component 1`] = `
class="MuiTouchRipple-root"
/>
</button>
<div
class="emotion-20 emotion-21"
>
<button
class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-colorInherit"
tabindex="0"
title="Change language"
type="button"
>
<span
class="MuiButton-label ForwardRef(Button)-label-339"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<path
d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zm6.93 6h-2.95c-.32-1.25-.78-2.45-1.38-3.56 1.84.63 3.37 1.91 4.33 3.56zM12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96zM4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2 0 .68.06 1.34.14 2H4.26zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56-1.84-.63-3.37-1.9-4.33-3.56zm2.95-8H5.08c.96-1.66 2.49-2.93 4.33-3.56C8.81 5.55 8.35 6.75 8.03 8zM12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96zM14.34 14H9.66c-.09-.66-.16-1.32-.16-2 0-.68.07-1.35.16-2h4.68c.09.65.16 1.32.16 2 0 .68-.07 1.34-.16 2zm.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95c-.96 1.65-2.49 2.93-4.33 3.56zM16.36 14c.08-.66.14-1.32.14-2 0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2h-3.38z"
/>
</svg>
<span
class="emotion-18 emotion-19"
>
English
</span>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<path
d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"
/>
</svg>
</span>
<span
class="MuiTouchRipple-root"
/>
</button>
</div>
<a
class="emotion-18 emotion-19"
class="emotion-22 emotion-23"
data-testid="header--tooltip-documentation"
href="https://verdaccio.org/docs/en/installation"
rel="noopener noreferrer"
@ -565,28 +631,28 @@ exports[`<App /> should display the Header component 1`] = `
</div>
</header>
<div
class="MuiBox-root MuiBox-root-412 emotion-36 emotion-37"
class="MuiBox-root MuiBox-root-414 emotion-40 emotion-41"
>
<div
class="container content"
data-testid="home-page-container"
>
<div
class="emotion-34 emotion-35"
class="emotion-38 emotion-39"
data-testid="loading"
>
<div
class="emotion-28 emotion-29"
>
<div
class="emotion-26 emotion-1"
/>
</div>
<div
class="emotion-32 emotion-33"
>
<div
class="MuiCircularProgress-root emotion-30 emotion-31 MuiCircularProgress-colorPrimary MuiCircularProgress-indeterminate"
class="emotion-30 emotion-1"
/>
</div>
<div
class="emotion-36 emotion-37"
>
<div
class="MuiCircularProgress-root emotion-34 emotion-35 MuiCircularProgress-colorPrimary MuiCircularProgress-indeterminate"
role="progressbar"
style="width: 50px; height: 50px;"
>
@ -609,26 +675,26 @@ exports[`<App /> should display the Header component 1`] = `
</div>
</div>
<div
class="emotion-76 emotion-77"
class="emotion-83 emotion-84"
>
<div
class="emotion-74 emotion-75"
class="emotion-81 emotion-82"
>
<div
class="emotion-65 emotion-66"
class="emotion-72 emotion-73"
>
Made with
<span
class="emotion-38 emotion-39"
class="emotion-42 emotion-43"
>
</span>
on
<span
class="emotion-63 emotion-64"
class="emotion-70 emotion-71"
>
<svg
class="emotion-40 emotion-41 emotion-42"
class="emotion-44 emotion-45 emotion-46"
>
<title>
Earth
@ -638,10 +704,10 @@ exports[`<App /> should display the Header component 1`] = `
/>
</svg>
<span
class="emotion-61 emotion-62"
class="emotion-68 emotion-69"
>
<svg
class="emotion-43 emotion-44 emotion-42"
class="emotion-47 emotion-48 emotion-46"
>
<title>
Spain
@ -651,7 +717,7 @@ exports[`<App /> should display the Header component 1`] = `
/>
</svg>
<svg
class="emotion-43 emotion-44 emotion-42"
class="emotion-47 emotion-48 emotion-46"
>
<title>
Nicaragua
@ -661,7 +727,7 @@ exports[`<App /> should display the Header component 1`] = `
/>
</svg>
<svg
class="emotion-43 emotion-44 emotion-42"
class="emotion-47 emotion-48 emotion-46"
>
<title>
India
@ -671,7 +737,7 @@ exports[`<App /> should display the Header component 1`] = `
/>
</svg>
<svg
class="emotion-43 emotion-44 emotion-42"
class="emotion-47 emotion-48 emotion-46"
>
<title>
Brazil
@ -681,7 +747,7 @@ exports[`<App /> should display the Header component 1`] = `
/>
</svg>
<svg
class="emotion-43 emotion-44 emotion-42"
class="emotion-47 emotion-48 emotion-46"
>
<title>
China
@ -691,7 +757,7 @@ exports[`<App /> should display the Header component 1`] = `
/>
</svg>
<svg
class="emotion-43 emotion-44 emotion-42"
class="emotion-47 emotion-48 emotion-46"
>
<title>
Austria
@ -700,20 +766,30 @@ exports[`<App /> should display the Header component 1`] = `
xlink:href="[object Object]#austria"
/>
</svg>
<svg
class="emotion-47 emotion-48 emotion-46"
>
<title>
Germany
</title>
<use
xlink:href="[object Object]#germany"
/>
</svg>
</span>
</span>
</div>
<div
class="emotion-72 emotion-73"
class="emotion-79 emotion-80"
>
Powered by
<span
class="emotion-43 emotion-70 emotion-71"
class="emotion-47 emotion-77 emotion-78"
title="Verdaccio"
>
<img
alt="Verdaccio"
class="emotion-67 emotion-68"
class="emotion-74 emotion-75"
src="[object Object]"
/>
</span>
@ -725,12 +801,13 @@ exports[`<App /> should display the Header component 1`] = `
`;
exports[`<App /> should display the Loading component at the beginning 1`] = `
.emotion-68 {
.emotion-75 {
background-color: #fff;
}
.emotion-24 {
.emotion-28 {
background-color: #4b5e40;
color: #fff;
min-height: 60px;
display: -webkit-box;
display: -webkit-flex;
@ -743,29 +820,29 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
}
@media (min-width:768px) {
.emotion-24 .emotion-13 {
.emotion-28 .emotion-13 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.emotion-24 .emotion-17 {
.emotion-28 .emotion-17 {
display: none;
}
.emotion-24 .e1jf5lit4 {
.emotion-28 .e1jf5lit4 {
display: none;
}
}
@media (min-width:1024px) {
.emotion-24 .emotion-23 {
.emotion-28 .emotion-27 {
padding: 0 20px;
}
@media (min-width:1275px) {
.emotion-24 .emotion-23 {
.emotion-28 .emotion-27 {
max-width: 1240px;
width: 100%;
margin: 0 auto;
@ -773,7 +850,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
}
}
.emotion-22 {
.emotion-26 {
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
@ -851,7 +928,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
overflow-y: auto;
}
.emotion-20 {
.emotion-24 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -863,12 +940,32 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
display: block;
}
.emotion-20 {
display: none;
}
@media screen and (min-width:768px) {
.emotion-20 {
display: inline-block;
}
}
.emotion-18 {
display: none;
}
@media screen and (min-width:768px) {
.emotion-18 {
display: inline-block;
}
}
.emotion-22 {
color: #fff;
}
@media screen and (min-width:1240px) {
.emotion-26 {
.emotion-30 {
max-width: 1240px;
width: 100%;
margin-left: auto;
@ -876,7 +973,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
}
}
.emotion-66 {
.emotion-73 {
background: #f9f9f9;
border-top: 1px solid #e3e3e3;
color: #999999;
@ -884,7 +981,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
padding: 20px;
}
.emotion-64 {
.emotion-71 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -901,7 +998,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
}
@media (min-width:768px) {
.emotion-64 {
.emotion-71 {
min-width: 400px;
max-width: 800px;
margin: auto;
@ -913,12 +1010,12 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
}
@media (min-width:1024px) {
.emotion-64 {
.emotion-71 {
max-width: 1240px;
}
}
.emotion-55 {
.emotion-62 {
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
@ -927,7 +1024,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
}
@media (min-width:768px) {
.emotion-55 {
.emotion-62 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -935,21 +1032,21 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
}
}
.emotion-28 {
.emotion-32 {
color: #e25555;
padding: 0 5px;
}
.emotion-53 {
.emotion-60 {
position: relative;
height: 18px;
}
.emotion-53:hover .emotion-52 {
.emotion-60:hover .emotion-59 {
visibility: visible;
}
.emotion-31 {
.emotion-35 {
box-sizing: initial;
display: inline-block;
cursor: default;
@ -958,7 +1055,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
padding: 0 10px;
}
.emotion-51 {
.emotion-58 {
position: absolute;
background: #d3dddd;
padding: 1px 4px;
@ -976,7 +1073,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
top: -2px;
}
.emotion-51:before {
.emotion-58:before {
content: '';
position: absolute;
top: 29%;
@ -989,7 +1086,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
transform: rotate(90deg);
}
.emotion-34 {
.emotion-38 {
box-sizing: initial;
display: inline-block;
cursor: default;
@ -998,7 +1095,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
padding: 0 5px;
}
.emotion-62 {
.emotion-69 {
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
@ -1011,7 +1108,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
}
@media (min-width:768px) {
.emotion-62 {
.emotion-69 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -1019,7 +1116,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
}
}
.emotion-60 {
.emotion-67 {
box-sizing: initial;
display: inline-block;
cursor: pointer;
@ -1028,21 +1125,21 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
padding: 0 5px;
}
.emotion-57 {
.emotion-64 {
width: 100%;
height: auto;
}
<div
class="MuiBox-root MuiBox-root-2 emotion-68 emotion-69"
class="MuiBox-root MuiBox-root-2 emotion-75 emotion-76"
style="display: none;"
>
<header
class="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionStatic emotion-24 emotion-25 MuiAppBar-colorPrimary"
class="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionStatic emotion-28 emotion-29 MuiAppBar-colorPrimary"
data-testid="header"
>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-22 emotion-23 MuiToolbar-gutters"
class="MuiToolbar-root MuiToolbar-regular emotion-26 emotion-27 MuiToolbar-gutters"
>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-14 emotion-15 MuiToolbar-gutters"
@ -1111,7 +1208,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
</div>
</div>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-20 emotion-21 MuiToolbar-gutters"
class="MuiToolbar-root MuiToolbar-regular emotion-24 emotion-25 MuiToolbar-gutters"
data-testid="header-right"
>
<button
@ -1138,8 +1235,53 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
class="MuiTouchRipple-root"
/>
</button>
<div
class="emotion-20 emotion-21"
>
<button
class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-colorInherit"
tabindex="0"
title="Change language"
type="button"
>
<span
class="MuiButton-label ForwardRef(Button)-label-121"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<path
d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zm6.93 6h-2.95c-.32-1.25-.78-2.45-1.38-3.56 1.84.63 3.37 1.91 4.33 3.56zM12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96zM4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2 0 .68.06 1.34.14 2H4.26zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56-1.84-.63-3.37-1.9-4.33-3.56zm2.95-8H5.08c.96-1.66 2.49-2.93 4.33-3.56C8.81 5.55 8.35 6.75 8.03 8zM12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96zM14.34 14H9.66c-.09-.66-.16-1.32-.16-2 0-.68.07-1.35.16-2h4.68c.09.65.16 1.32.16 2 0 .68-.07 1.34-.16 2zm.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95c-.96 1.65-2.49 2.93-4.33 3.56zM16.36 14c.08-.66.14-1.32.14-2 0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2h-3.38z"
/>
</svg>
<span
class="emotion-18 emotion-19"
>
English
</span>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<path
d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"
/>
</svg>
</span>
<span
class="MuiTouchRipple-root"
/>
</button>
</div>
<a
class="emotion-18 emotion-19"
class="emotion-22 emotion-23"
data-testid="header--tooltip-documentation"
href="https://verdaccio.org/docs/en/installation"
rel="noopener noreferrer"
@ -1243,29 +1385,29 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
</div>
</header>
<div
class="MuiBox-root MuiBox-root-195 emotion-26 emotion-27"
class="MuiBox-root MuiBox-root-196 emotion-30 emotion-31"
/>
<div
class="emotion-66 emotion-67"
class="emotion-73 emotion-74"
>
<div
class="emotion-64 emotion-65"
class="emotion-71 emotion-72"
>
<div
class="emotion-55 emotion-56"
class="emotion-62 emotion-63"
>
Made with
<span
class="emotion-28 emotion-29"
class="emotion-32 emotion-33"
>
</span>
on
<span
class="emotion-53 emotion-54"
class="emotion-60 emotion-61"
>
<svg
class="emotion-30 emotion-31 emotion-32"
class="emotion-34 emotion-35 emotion-36"
>
<title>
Earth
@ -1275,10 +1417,10 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
/>
</svg>
<span
class="emotion-51 emotion-52"
class="emotion-58 emotion-59"
>
<svg
class="emotion-33 emotion-34 emotion-32"
class="emotion-37 emotion-38 emotion-36"
>
<title>
Spain
@ -1288,7 +1430,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
/>
</svg>
<svg
class="emotion-33 emotion-34 emotion-32"
class="emotion-37 emotion-38 emotion-36"
>
<title>
Nicaragua
@ -1298,7 +1440,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
/>
</svg>
<svg
class="emotion-33 emotion-34 emotion-32"
class="emotion-37 emotion-38 emotion-36"
>
<title>
India
@ -1308,7 +1450,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
/>
</svg>
<svg
class="emotion-33 emotion-34 emotion-32"
class="emotion-37 emotion-38 emotion-36"
>
<title>
Brazil
@ -1318,7 +1460,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
/>
</svg>
<svg
class="emotion-33 emotion-34 emotion-32"
class="emotion-37 emotion-38 emotion-36"
>
<title>
China
@ -1328,7 +1470,7 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
/>
</svg>
<svg
class="emotion-33 emotion-34 emotion-32"
class="emotion-37 emotion-38 emotion-36"
>
<title>
Austria
@ -1337,20 +1479,30 @@ exports[`<App /> should display the Loading component at the beginning 1`] = `
xlink:href="[object Object]#austria"
/>
</svg>
<svg
class="emotion-37 emotion-38 emotion-36"
>
<title>
Germany
</title>
<use
xlink:href="[object Object]#germany"
/>
</svg>
</span>
</span>
</div>
<div
class="emotion-62 emotion-63"
class="emotion-69 emotion-70"
>
Powered by
<span
class="emotion-33 emotion-60 emotion-61"
class="emotion-37 emotion-67 emotion-68"
title="Verdaccio"
>
<img
alt="Verdaccio"
class="emotion-57 emotion-58"
class="emotion-64 emotion-65"
src="[object Object]"
/>
</span>

View File

@ -12,10 +12,14 @@ import { Theme } from '../../design-tokens/theme';
import downloadTarball from './download-tarball';
export const Fab = styled(FloatingActionButton)<{ theme?: Theme }>(props => ({
backgroundColor: props.theme && props.theme.palette.primary.main,
color: props.theme && props.theme.palette.white,
export const Fab = styled(FloatingActionButton)<{ theme?: Theme }>(({ theme }) => ({
backgroundColor: theme?.palette.type === 'light' ? theme?.palette.primary.main : theme?.palette.cyanBlue,
color: theme?.palette.white,
marginRight: 10,
':hover': {
color: theme?.palette.type === 'light' ? theme?.palette.primary.main : theme?.palette.cyanBlue,
background: theme?.palette.white,
},
}));
type ActionType = 'VISIT_HOMEPAGE' | 'OPEN_AN_ISSUE' | 'DOWNLOAD_TARBALL';

View File

@ -7,6 +7,11 @@ exports[`<ActionBar /> component should render the component in default state 1`
margin-right: 10px;
}
.emotion-0:hover {
color: #4b5e40;
background: #fff;
}
<div
class="MuiBox-root MuiBox-root-2"
>

View File

@ -9,21 +9,6 @@ import { isURL } from '../../utils/url';
import { Theme } from '../../design-tokens/theme';
import { DetailContext } from '../../pages/Version';
const StyledLink = styled(Link)<{ theme?: Theme }>(({ theme }) => ({
marginTop: theme && theme.spacing(1),
marginBottom: theme && theme.spacing(1),
textDecoration: 'none',
display: 'block',
}));
const StyledFavoriteIcon = styled(Favorite)<{ theme?: Theme }>(({ theme }) => ({
color: theme && theme.palette.orange,
}));
const StyledFundStrong = styled('strong')({
marginRight: 3,
});
/* eslint-disable react/jsx-no-bind */
const DetailSidebarFundButton: React.FC = () => {
const detailContext = useContext(DetailContext);
@ -46,3 +31,18 @@ const DetailSidebarFundButton: React.FC = () => {
};
export default DetailSidebarFundButton;
const StyledLink = styled(Link)<{ theme?: Theme }>(({ theme }) => ({
marginTop: theme?.spacing(1),
marginBottom: theme?.spacing(1),
textDecoration: 'none',
display: 'block',
}));
const StyledFavoriteIcon = styled(Favorite)<{ theme?: Theme }>(({ theme }) => ({
color: theme?.palette.orange,
}));
const StyledFundStrong = styled('strong')({
marginRight: 3,
});

View File

@ -22,6 +22,7 @@ const Footer: React.FC = () => {
<Flag name="brazil" size="md" />
<Flag name="china" size="md" />
<Flag name="austria" size="md" />
<Flag name="germany" size="md" />
</Flags>
</ToolTip>
</Left>

View File

@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<Footer /> component should load the initial state of Footer component 1`] = `
.emotion-38 {
.emotion-41 {
background: #f9f9f9;
border-top: 1px solid #e3e3e3;
color: #999999;
@ -9,7 +9,7 @@ exports[`<Footer /> component should load the initial state of Footer component
padding: 20px;
}
.emotion-36 {
.emotion-39 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -26,7 +26,7 @@ exports[`<Footer /> component should load the initial state of Footer component
}
@media (min-width:768px) {
.emotion-36 {
.emotion-39 {
min-width: 400px;
max-width: 800px;
margin: auto;
@ -38,12 +38,12 @@ exports[`<Footer /> component should load the initial state of Footer component
}
@media (min-width:1024px) {
.emotion-36 {
.emotion-39 {
max-width: 1240px;
}
}
.emotion-27 {
.emotion-30 {
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
@ -52,7 +52,7 @@ exports[`<Footer /> component should load the initial state of Footer component
}
@media (min-width:768px) {
.emotion-27 {
.emotion-30 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -65,12 +65,12 @@ exports[`<Footer /> component should load the initial state of Footer component
padding: 0 5px;
}
.emotion-25 {
.emotion-28 {
position: relative;
height: 18px;
}
.emotion-25:hover .emotion-24 {
.emotion-28:hover .emotion-27 {
visibility: visible;
}
@ -83,7 +83,7 @@ exports[`<Footer /> component should load the initial state of Footer component
padding: 0 10px;
}
.emotion-23 {
.emotion-26 {
position: absolute;
background: #d3dddd;
padding: 1px 4px;
@ -101,7 +101,7 @@ exports[`<Footer /> component should load the initial state of Footer component
top: -2px;
}
.emotion-23:before {
.emotion-26:before {
content: '';
position: absolute;
top: 29%;
@ -123,7 +123,7 @@ exports[`<Footer /> component should load the initial state of Footer component
padding: 0 5px;
}
.emotion-34 {
.emotion-37 {
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
@ -136,7 +136,7 @@ exports[`<Footer /> component should load the initial state of Footer component
}
@media (min-width:768px) {
.emotion-34 {
.emotion-37 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -144,7 +144,7 @@ exports[`<Footer /> component should load the initial state of Footer component
}
}
.emotion-32 {
.emotion-35 {
box-sizing: initial;
display: inline-block;
cursor: pointer;
@ -153,19 +153,19 @@ exports[`<Footer /> component should load the initial state of Footer component
padding: 0 5px;
}
.emotion-29 {
.emotion-32 {
width: 100%;
height: auto;
}
<div
class="emotion-38 emotion-39"
class="emotion-41 emotion-42"
>
<div
class="emotion-36 emotion-37"
class="emotion-39 emotion-40"
>
<div
class="emotion-27 emotion-28"
class="emotion-30 emotion-31"
>
Made with
<span
@ -175,7 +175,7 @@ exports[`<Footer /> component should load the initial state of Footer component
</span>
on
<span
class="emotion-25 emotion-26"
class="emotion-28 emotion-29"
>
<svg
class="emotion-2 emotion-3 emotion-4"
@ -188,7 +188,7 @@ exports[`<Footer /> component should load the initial state of Footer component
/>
</svg>
<span
class="emotion-23 emotion-24"
class="emotion-26 emotion-27"
>
<svg
class="emotion-5 emotion-6 emotion-4"
@ -250,20 +250,30 @@ exports[`<Footer /> component should load the initial state of Footer component
xlink:href="[object Object]#austria"
/>
</svg>
<svg
class="emotion-5 emotion-6 emotion-4"
>
<title>
Germany
</title>
<use
xlink:href="[object Object]#germany"
/>
</svg>
</span>
</span>
</div>
<div
class="emotion-34 emotion-35"
class="emotion-37 emotion-38"
>
Powered by
<span
class="emotion-5 emotion-32 emotion-33"
class="emotion-5 emotion-35 emotion-36"
title="Verdaccio"
>
<img
alt="Verdaccio"
class="emotion-29 emotion-30"
class="emotion-32 emotion-33"
src="[object Object]"
/>
</span>

View File

@ -4,7 +4,7 @@ import Icon from '../Icon/Icon';
import { Theme } from '../../design-tokens/theme';
export const Wrapper = styled('div')<{ theme?: Theme }>(({ theme }) => ({
background: theme?.palette.type === 'dark' ? theme?.palette.primary.main : theme?.palette.snow,
background: theme?.palette.type === 'light' ? theme?.palette.snow : theme?.palette.cyanBlue,
borderTop: `1px solid ${theme?.palette.greyGainsboro}`,
color: theme?.palette.type === 'dark' ? theme?.palette.white : theme?.palette.nobel01,
fontSize: '14px',
@ -16,13 +16,13 @@ export const Inner = styled('div')<{ theme?: Theme }>(({ theme }) => ({
alignItems: 'center',
justifyContent: 'flex-end',
width: '100%',
[`@media (min-width: ${theme && theme.breakPoints.medium}px)`]: {
[`@media (min-width: ${theme?.breakPoints.medium}px)`]: {
minWidth: 400,
maxWidth: 800,
margin: 'auto',
justifyContent: 'space-between',
},
[`@media (min-width: ${theme && theme.breakPoints.large}px)`]: {
[`@media (min-width: ${theme?.breakPoints.large}px)`]: {
maxWidth: 1240,
},
}));
@ -30,7 +30,7 @@ export const Inner = styled('div')<{ theme?: Theme }>(({ theme }) => ({
export const Left = styled('div')<{ theme?: Theme }>(({ theme }) => ({
alignItems: 'center',
display: 'none',
[`@media (min-width: ${theme && theme.breakPoints.medium}px)`]: {
[`@media (min-width: ${theme?.breakPoints.medium}px)`]: {
display: 'flex',
},
}));
@ -43,9 +43,9 @@ export const Earth = styled(Icon)({
padding: '0 10px',
});
export const Flags = styled('span')<{ theme?: Theme }>(props => ({
export const Flags = styled('span')<{ theme?: Theme }>(({ theme }) => ({
position: 'absolute',
background: props.theme && props.theme.palette.greyAthens,
background: theme?.palette.greyAthens,
padding: '1px 4px',
borderRadius: 3,
height: 20,
@ -60,7 +60,7 @@ export const Flags = styled('span')<{ theme?: Theme }>(props => ({
left: -4,
marginLeft: -5,
border: '5px solid',
borderColor: `${props.theme && props.theme.palette.greyAthens} transparent transparent transparent`,
borderColor: `${theme?.palette.greyAthens} transparent transparent transparent`,
transform: 'rotate(90deg)',
},
}));
@ -75,8 +75,8 @@ export const ToolTip = styled('span')({
},
});
export const Love = styled('span')<{ theme?: Theme }>(props => ({
color: props.theme && props.theme.palette.love,
export const Love = styled('span')<{ theme?: Theme }>(({ theme }) => ({
color: theme?.palette.love,
padding: '0 5px',
}));

View File

@ -47,7 +47,7 @@ const HeaderMenu: React.FC<Props> = ({
vertical: 'top',
horizontal: 'right',
}}>
<MenuItem disabled={true}>
<MenuItem>
<HeaderGreetings username={username} />
</MenuItem>
<MenuItem button={true} data-testid="header--button-logout" id="header--button-logout" onClick={onLogout}>

View File

@ -3,6 +3,7 @@ import { useTranslation } from 'react-i18next';
import Button from '../../muiComponents/Button';
import ThemeContext from '../../design-tokens/ThemeContext';
import LanguageSwitch from '../LanguageSwitch';
import { RightSide } from './styles';
import HeaderToolTip from './HeaderToolTip';
@ -72,6 +73,7 @@ const HeaderRight: React.FC<Props> = ({
{!withoutSearch && (
<HeaderToolTip onClick={onToggleMobileNav} title={t('search.packages')} tooltipIconType={'search'} />
)}
<LanguageSwitch />
<HeaderToolTip title={t('header.documentation')} tooltipIconType={'help'} />
<HeaderToolTip onClick={onOpenRegistryInfoDialog} title={t('header.registry-info')} tooltipIconType={'info'} />
<HeaderToolTip

View File

@ -1,8 +1,9 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<Header /> component with logged in state should load the component in logged in state 1`] = `
.emotion-24 {
.emotion-28 {
background-color: #4b5e40;
color: #fff;
min-height: 60px;
display: -webkit-box;
display: -webkit-flex;
@ -15,29 +16,29 @@ exports[`<Header /> component with logged in state should load the component in
}
@media (min-width:768px) {
.emotion-24 .emotion-13 {
.emotion-28 .emotion-13 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.emotion-24 .emotion-17 {
.emotion-28 .emotion-17 {
display: none;
}
.emotion-24 .e1jf5lit4 {
.emotion-28 .e1jf5lit4 {
display: none;
}
}
@media (min-width:1024px) {
.emotion-24 .emotion-23 {
.emotion-28 .emotion-27 {
padding: 0 20px;
}
@media (min-width:1275px) {
.emotion-24 .emotion-23 {
.emotion-28 .emotion-27 {
max-width: 1240px;
width: 100%;
margin: 0 auto;
@ -45,7 +46,7 @@ exports[`<Header /> component with logged in state should load the component in
}
}
.emotion-22 {
.emotion-26 {
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
@ -123,7 +124,7 @@ exports[`<Header /> component with logged in state should load the component in
overflow-y: auto;
}
.emotion-20 {
.emotion-24 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -135,16 +136,36 @@ exports[`<Header /> component with logged in state should load the component in
display: block;
}
.emotion-20 {
display: none;
}
@media screen and (min-width:768px) {
.emotion-20 {
display: inline-block;
}
}
.emotion-18 {
display: none;
}
@media screen and (min-width:768px) {
.emotion-18 {
display: inline-block;
}
}
.emotion-22 {
color: #fff;
}
<header
class="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionStatic emotion-24 emotion-25 MuiAppBar-colorPrimary"
class="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionStatic emotion-28 emotion-29 MuiAppBar-colorPrimary"
data-testid="header"
>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-22 emotion-23 MuiToolbar-gutters"
class="MuiToolbar-root MuiToolbar-regular emotion-26 emotion-27 MuiToolbar-gutters"
>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-14 emotion-15 MuiToolbar-gutters"
@ -213,7 +234,7 @@ exports[`<Header /> component with logged in state should load the component in
</div>
</div>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-20 emotion-21 MuiToolbar-gutters"
class="MuiToolbar-root MuiToolbar-regular emotion-24 emotion-25 MuiToolbar-gutters"
data-testid="header-right"
>
<button
@ -240,8 +261,53 @@ exports[`<Header /> component with logged in state should load the component in
class="MuiTouchRipple-root"
/>
</button>
<div
class="emotion-20 emotion-21"
>
<button
class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-colorInherit"
tabindex="0"
title="Change language"
type="button"
>
<span
class="MuiButton-label ForwardRef(Button)-label-322"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<path
d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zm6.93 6h-2.95c-.32-1.25-.78-2.45-1.38-3.56 1.84.63 3.37 1.91 4.33 3.56zM12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96zM4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2 0 .68.06 1.34.14 2H4.26zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56-1.84-.63-3.37-1.9-4.33-3.56zm2.95-8H5.08c.96-1.66 2.49-2.93 4.33-3.56C8.81 5.55 8.35 6.75 8.03 8zM12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96zM14.34 14H9.66c-.09-.66-.16-1.32-.16-2 0-.68.07-1.35.16-2h4.68c.09.65.16 1.32.16 2 0 .68-.07 1.34-.16 2zm.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95c-.96 1.65-2.49 2.93-4.33 3.56zM16.36 14c.08-.66.14-1.32.14-2 0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2h-3.38z"
/>
</svg>
<span
class="emotion-18 emotion-19"
>
English
</span>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<path
d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"
/>
</svg>
</span>
<span
class="MuiTouchRipple-root"
/>
</button>
</div>
<a
class="emotion-18 emotion-19"
class="emotion-22 emotion-23"
data-testid="header--tooltip-documentation"
href="https://verdaccio.org/docs/en/installation"
rel="noopener noreferrer"
@ -358,8 +424,9 @@ exports[`<Header /> component with logged in state should load the component in
`;
exports[`<Header /> component with logged in state should load the component in logged out state 1`] = `
.emotion-24 {
.emotion-28 {
background-color: #4b5e40;
color: #fff;
min-height: 60px;
display: -webkit-box;
display: -webkit-flex;
@ -372,29 +439,29 @@ exports[`<Header /> component with logged in state should load the component in
}
@media (min-width:768px) {
.emotion-24 .emotion-13 {
.emotion-28 .emotion-13 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.emotion-24 .emotion-17 {
.emotion-28 .emotion-17 {
display: none;
}
.emotion-24 .e1jf5lit4 {
.emotion-28 .e1jf5lit4 {
display: none;
}
}
@media (min-width:1024px) {
.emotion-24 .emotion-23 {
.emotion-28 .emotion-27 {
padding: 0 20px;
}
@media (min-width:1275px) {
.emotion-24 .emotion-23 {
.emotion-28 .emotion-27 {
max-width: 1240px;
width: 100%;
margin: 0 auto;
@ -402,7 +469,7 @@ exports[`<Header /> component with logged in state should load the component in
}
}
.emotion-22 {
.emotion-26 {
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
@ -480,7 +547,7 @@ exports[`<Header /> component with logged in state should load the component in
overflow-y: auto;
}
.emotion-20 {
.emotion-24 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
@ -492,16 +559,36 @@ exports[`<Header /> component with logged in state should load the component in
display: block;
}
.emotion-20 {
display: none;
}
@media screen and (min-width:768px) {
.emotion-20 {
display: inline-block;
}
}
.emotion-18 {
display: none;
}
@media screen and (min-width:768px) {
.emotion-18 {
display: inline-block;
}
}
.emotion-22 {
color: #fff;
}
<header
class="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionStatic emotion-24 emotion-25 MuiAppBar-colorPrimary"
class="MuiPaper-root MuiPaper-elevation4 MuiAppBar-root MuiAppBar-positionStatic emotion-28 emotion-29 MuiAppBar-colorPrimary"
data-testid="header"
>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-22 emotion-23 MuiToolbar-gutters"
class="MuiToolbar-root MuiToolbar-regular emotion-26 emotion-27 MuiToolbar-gutters"
>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-14 emotion-15 MuiToolbar-gutters"
@ -570,7 +657,7 @@ exports[`<Header /> component with logged in state should load the component in
</div>
</div>
<div
class="MuiToolbar-root MuiToolbar-regular emotion-20 emotion-21 MuiToolbar-gutters"
class="MuiToolbar-root MuiToolbar-regular emotion-24 emotion-25 MuiToolbar-gutters"
data-testid="header-right"
>
<button
@ -597,8 +684,53 @@ exports[`<Header /> component with logged in state should load the component in
class="MuiTouchRipple-root"
/>
</button>
<div
class="emotion-20 emotion-21"
>
<button
class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-colorInherit"
tabindex="0"
title="Change language"
type="button"
>
<span
class="MuiButton-label ForwardRef(Button)-label-119"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<path
d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zm6.93 6h-2.95c-.32-1.25-.78-2.45-1.38-3.56 1.84.63 3.37 1.91 4.33 3.56zM12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96zM4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2 0 .68.06 1.34.14 2H4.26zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56-1.84-.63-3.37-1.9-4.33-3.56zm2.95-8H5.08c.96-1.66 2.49-2.93 4.33-3.56C8.81 5.55 8.35 6.75 8.03 8zM12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96zM14.34 14H9.66c-.09-.66-.16-1.32-.16-2 0-.68.07-1.35.16-2h4.68c.09.65.16 1.32.16 2 0 .68-.07 1.34-.16 2zm.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95c-.96 1.65-2.49 2.93-4.33 3.56zM16.36 14c.08-.66.14-1.32.14-2 0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2h-3.38z"
/>
</svg>
<span
class="emotion-18 emotion-19"
>
English
</span>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
focusable="false"
role="presentation"
viewBox="0 0 24 24"
>
<path
d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"
/>
</svg>
</span>
<span
class="MuiTouchRipple-root"
/>
</button>
</div>
<a
class="emotion-18 emotion-19"
class="emotion-22 emotion-23"
data-testid="header--tooltip-documentation"
href="https://verdaccio.org/docs/en/installation"
rel="noopener noreferrer"

View File

@ -54,11 +54,12 @@ export const SearchWrapper = styled('div')({
});
export const NavBar = styled(AppBar)<{ theme?: Theme }>(({ theme }) => ({
backgroundColor: theme && theme.palette.primary.main,
backgroundColor: theme?.palette.type === 'light' ? theme?.palette.primary.main : theme?.palette.cyanBlue,
color: theme?.palette.white,
minHeight: 60,
display: 'flex',
justifyContent: 'center',
[`@media (min-width: ${theme && theme.breakPoints.medium}px)`]: css`
[`@media (min-width: ${theme?.breakPoints.medium}px)`]: css`
${SearchWrapper} {
display: flex;
}
@ -69,12 +70,12 @@ export const NavBar = styled(AppBar)<{ theme?: Theme }>(({ theme }) => ({
display: none;
}
`,
[`@media (min-width: ${theme && theme.breakPoints.large}px)`]: css`
[`@media (min-width: ${theme?.breakPoints.large}px)`]: css`
${InnerNavBar} {
padding: 0 20px;
}
`,
[`@media (min-width: ${theme && theme.breakPoints.xlarge}px)`]: css`
[`@media (min-width: ${theme?.breakPoints.xlarge}px)`]: css`
${InnerNavBar} {
max-width: 1240px;
width: 100%;
@ -83,6 +84,6 @@ export const NavBar = styled(AppBar)<{ theme?: Theme }>(({ theme }) => ({
`,
}));
export const StyledLink = styled(Link)<{ theme?: Theme }>(props => ({
color: props.theme && props.theme.palette.white,
export const StyledLink = styled(Link)<{ theme?: Theme }>(({ theme }) => ({
color: theme?.palette.white,
}));

View File

@ -6,10 +6,16 @@ import { Svg, Img, ImgWrapper } from './styles';
import brazil from './img/brazil.svg';
import china from './img/china.svg';
import india from './img/india.svg';
import germany from './img/germany.svg';
import nicaragua from './img/nicaragua.svg';
import pakistan from './img/pakistan.svg';
import austria from './img/austria.svg';
import spain from './img/spain.svg';
import usa from './img/usa.svg';
import france from './img/france.svg';
import japan from './img/japan.svg';
import ukraine from './img/ukraine.svg';
import khmer from './img/khmer.svg';
import earth from './img/earth.svg';
import verdaccio from './img/verdaccio.svg';
import filebinary from './img/filebinary.svg';
@ -22,10 +28,16 @@ export interface IconsMap {
brazil: string;
spain: string;
china: string;
usa: string;
nicaragua: string;
pakistan: string;
austria: string;
france: string;
germany: string;
india: string;
japan: string;
ukraine: string;
khmer: string;
earth: string;
verdaccio: string;
license: string;
@ -51,6 +63,12 @@ export const Icons: IconsMap = {
license,
time,
version,
germany,
usa,
france,
japan,
ukraine,
khmer,
};
export interface Props {

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="france"><path d="M38.345 88.273C17.167 88.273 0 105.44 0 126.618v258.759c0 21.177 17.167 38.345 38.345 38.345h132.322V88.273H38.345z" fill="#41479b"/><path fill="#f5f5f5" d="M170.67 88.277h170.67v335.45H170.67z"/><path d="M473.655 88.273H341.333v335.448h132.322c21.177 0 38.345-17.167 38.345-38.345V126.618c0-21.178-17.167-38.345-38.345-38.345z" fill="#ff4b55"/></svg>

After

Width:  |  Height:  |  Size: 434 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="germany"><path d="M473.655 88.276H38.345C17.167 88.276 0 105.443 0 126.621v73.471h512v-73.471c0-21.178-17.167-38.345-38.345-38.345z" fill="#464655"/><path d="M0 385.379c0 21.177 17.167 38.345 38.345 38.345h435.31c21.177 0 38.345-17.167 38.345-38.345v-73.471H0v73.471z" fill="#ffe15a"/><path fill="#ff4b55" d="M0 200.09h512V311.9H0z"/></svg>

After

Width:  |  Height:  |  Size: 407 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="japan"><path d="M473.655 88.275H38.345C17.167 88.275 0 105.442 0 126.62v258.76c0 21.177 17.167 38.345 38.345 38.345h435.31c21.177 0 38.345-17.167 38.345-38.345V126.62c0-21.178-17.167-38.345-38.345-38.345z" fill="#f5f5f5"/><circle cx="256" cy="255.999" r="97.1" fill="#ff4b55"/></svg>

After

Width:  |  Height:  |  Size: 350 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="khmer"><g fill="#032ea1"><path d="M0 304.8v64.8a48.3 48.3 0 0048 48.8h400c26.4 0 48-21.6 48-48.8v-64.8H0zM448 77.6H48c-26.4 0-48 21.6-48 48.8v64.8h496v-64.8a48.3 48.3 0 00-48-48.8z"/></g><path fill="#e00025" d="M0 189.6h496v116H0z"/><g fill="#042a7f"><path d="M448 418.4c26.4 0 48-21.6 48-48.8v-64.8H315.2L448 418.4zM448 77.6H48l132.8 113.6H496v-64.8a48.3 48.3 0 00-48-48.8z"/></g><path fill="#b50030" d="M316 306.4h180V189.6H180z"/><path fill="#002566" d="M448 77.6H48l370.4 113.6H496v-64.8a48.3 48.3 0 00-48-48.8z"/><path fill="#8c002b" d="M496 214.4v-24.8h-81.6z"/><path fill="#002566" d="M496 369.6a48.3 48.3 0 01-48 48.8H48c-26.4 0-48-21.6-48-48.8"/><g fill="#fff"><path d="M249.6 200s0-2.4-1.6-2.4-1.6 2.4-1.6 2.4h3.2zM321.6 290.4v-7.2h-24 20v-6.4h-4V272h-16H312v-4h-3.2c-.8-.8-2.4-1.6-2.4-3.2v-12c.8-1.6 1.6-3.2 2.4-3.2v-11.2c-1.6 0-2.4 1.6-2.4 1.6v-4.8h-1.6v9.6-6.4h-2.4 2.4v-1.6h-2.4v-5.6c-.8 0-.8 2.4-2.4 2.4-.8 0-.8-.8 0-1.6s.8-1.6 0-4c-.8 1.6-1.6 1.6-1.6.8.8-1.6 1.6-1.6.8-4 0 2.4-1.6 2.4-1.6.8 0-1.6.8-1.6 0-4-.8 2.4-1.6 2.4-1.6.8 0-2.4 0-4-2.4-4.8 0 0 0-1.6-.8-1.6s-.8 1.6-.8 1.6c-2.4.8-2.4 3.2-2.4 4.8s-.8 1.6-1.6-.8c-.8 1.6 0 2.4 0 4s-.8 1.6-1.6-.8c-.8 2.4 0 2.4.8 4 0 .8-.8.8-1.6-.8-.8 1.6 0 3.2 0 4 .8.8.8 1.6 0 1.6-1.6 0-1.6-2.4-2.4-2.4v9.6H280v-.8h-1.6v.8H264V232c-1.6.8-1.6 1.6-1.6 1.6v7.2-5.6h-1.6s-.8 0-.8-1.6.8-2.4 1.6-2.4V228s-3.2 0-3.2 4v-3.2c-.8 0-.8.8-.8 4h-2.4 1.6v-3.2c0-1.6 1.6-1.6 1.6-3.2V224c-.8 2.4-1.6 1.6-1.6.8s.8-1.6 2.4-4c.8-.8 0-2.4-.8-3.2 0 1.6-.8 2.4-1.6 2.4s-.8 0-.8-1.6c0-.8.8-1.6.8-3.2.8-1.6 0-2.4-.8-3.2 0 1.6 0 2.4-.8 2.4-1.6-.8 0-3.2 0-3.2 0-.8-.8-2.4-.8-2.4-.8 1.6-.8 1.6-1.6 1.6s-.8-1.6 0-2.4c.8-.8.8-1.6 0-1.6-.8 1.6-1.6.8-1.6 0l.8-2.4h-10.4l.8 2.4c0 .8-.8.8-1.6 0-.8.8-.8 1.6 0 1.6.8.8.8 1.6 0 2.4-.8 0-.8 0-1.6-1.6 0 0-.8 1.6-.8 2.4 0 .8 1.6 3.2 0 3.2-.8 0-.8-.8-.8-2.4-.8.8-.8 1.6-.8 3.2 0 .8.8 1.6.8 3.2 0 .8-.8 1.6-.8 1.6-.8 0-.8-.8-1.6-2.4-.8.8-.8 3.2-.8 3.2 1.6 2.4 2.4 3.2 2.4 4s-.8 1.6-1.6-.8c-.8.8 0 2.4 0 2.4 0 1.6 1.6 1.6 1.6 3.2v3.2h1.6-2.4c0-3.2 0-4-.8-4v3.2c0-3.2-3.2-3.2-3.2-3.2v3.2c.8 0 1.6.8 1.6 2.4s-.8 1.6-.8 1.6h-1.6v5.6-7.2s0-1.6-1.6-1.6v8.8h-14.4V240h-1.6v.8h-3.2v-9.6c-.8 0-.8 2.4-2.4 2.4-.8 0-.8-.8 0-1.6s.8-1.6 0-4c-.8 1.6-1.6 1.6-1.6.8.8-1.6 1.6-1.6.8-4 0 2.4-1.6 2.4-1.6.8 0-1.6.8-1.6 0-4-.8 2.4-1.6 2.4-1.6.8 0-2.4 0-4-2.4-4.8 0 0 0-1.6-.8-1.6s-.8 1.6-.8 1.6c-2.4.8-2.4 3.2-2.4 4.8s-.8 1.6-1.6-.8c-.8 1.6 0 2.4 0 4s-.8 1.6-1.6-.8c-.8 2.4 0 2.4.8 4 0 .8-.8.8-1.6-.8-.8 1.6 0 3.2 0 4 .8.8.8 1.6 0 1.6-1.6 0-1.6-2.4-2.4-2.4v5.6h-2.4v-.8h-1.6v4s-.8-1.6-2.4-1.6v12c.8 0 2.4 1.6 2.4 3.2v12c0 1.6-1.6 2.4-2.4 3.2h-.8v3.2h13.6-16v4.8h-4v6.4h20-24v7.2h-4v7.2h156v-7.2h-4zm-16.8-25.6zm-2.4-17.6v.8-.8zm-3.2.8h4-4zm-105.6-9.6h-2.4 2.4zm3.2 10.4h-3.2 3.2zm12-.8h4-4zm-.8 24h35.2H208zm35.2 11.2H208h35.2zm.8-50.4zm8 0zm32 15.2h3.2-3.2c-.8.8-.8 0 0 0zm4 35.2h-36 36zm0-11.2h-36 36z"/><path d="M252.8 205.6v-2.4h-9.6v2.4zM252 203.2v-1.6h-8v1.6zM250.4 201.6V200h-4.8v1.6z"/></g><g fill="#cecece"><path d="M231.2 232v2.4l1.6 1.6v-1.6c0-.8 0-2.4-1.6-2.4z"/><path d="M321.6 283.2h-24 20v-6.4h-4V272h-16H312v-4h-3.2c-.8-.8-2.4-1.6-2.4-3.2v-12c.8-1.6 1.6-3.2 2.4-3.2v-11.2c-1.6 0-2.4 1.6-2.4 1.6v-4.8h-1.6v9.6-6.4h-2.4 2.4v-1.6h-2.4v-5.6c-.8 0-.8 2.4-2.4 2.4-.8 0-.8-.8 0-1.6s.8-1.6 0-4c-.8 1.6-1.6 1.6-1.6.8.8-1.6 1.6-1.6.8-4 0 2.4-1.6 2.4-1.6.8 0-1.6.8-1.6 0-4-.8 2.4-1.6 2.4-1.6.8 0-2.4 0-4-2.4-4.8 0 0 0-1.6-.8-1.6s-.8 1.6-.8 1.6c-2.4.8-2.4 3.2-2.4 4.8s-.8 1.6-1.6-.8c-.8 1.6 0 2.4 0 4s-.8 1.6-1.6-.8c-.8 2.4 0 2.4.8 4 0 .8-.8.8-1.6-.8-.8 1.6 0 3.2 0 4 .8.8.8 1.6 0 1.6-1.6 0-1.6-2.4-2.4-2.4v9.6H280v-.8h-1.6v.8H264V232c-1.6.8-1.6 1.6-1.6 1.6v7.2-5.6h-1.6s-.8 0-.8-1.6.8-2.4 1.6-2.4V228s-3.2 0-3.2 4v-3.2c-.8 0-.8.8-.8 4h-.8v-3.2c0-1.6 1.6-1.6 1.6-3.2V224c-.8 2.4-1.6 1.6-1.6.8s.8-1.6 2.4-4c.8-.8 0-2.4-.8-3.2 0 1.6-.8 2.4-1.6 2.4s-.8 0-.8-1.6c0-.8.8-1.6.8-3.2.8-1.6 0-2.4-.8-3.2 0 1.6 0 2.4-.8 2.4-1.6-.8 0-3.2 0-3.2 0-.8-.8-2.4-.8-2.4-.8 1.6-.8 1.6-1.6 1.6s-.8-1.6 0-2.4c.8-.8.8-1.6 0-1.6-.8 1.6-1.6.8-1.6 0l.8-2.4h-10.4l.8 2.4c0 .8-.8.8-1.6 0-.8.8-.8 1.6 0 1.6.8.8.8 1.6 0 2.4-.8 0-.8 0-1.6-1.6 0 0-.8 1.6-.8 2.4 0 .8 1.6 3.2 0 3.2-.8 0-.8-.8-.8-2.4-.8.8-.8 1.6-.8 3.2 0 .8.8 1.6.8 3.2 0 .8-.8 1.6-.8 1.6-.8 0-.8-.8-1.6-2.4-.8.8-.8 3.2-.8 3.2 1.6 2.4 2.4 3.2 2.4 4s-.8 1.6-1.6-.8c-.8.8 0 2.4 0 2.4 0 1.6 1.6 1.6 1.6 3.2v3.2h-.8c0-3.2 0-4-.8-4v3.2c0-3.2-3.2-3.2-3.2-3.2v3.2c.8 0 1.6.8 1.6 2.4s-.8 1.6-.8 1.6h-1.6l42.4 36.8H288h-12l31.2 26.4h19.2V292h-4v-8.8h-.8zm-19.2-36v.8-.8zm-3.2.8h4-4zm-12 .8h-4 4zM248 197.6c-1.6 0-1.6 2.4-1.6 2.4h2.4c.8 0 .8-2.4-.8-2.4z"/><path d="M243.2 203.2v2.4h9.6v-2.4zM252 203.2v-1.6h-8v1.6zM250.4 201.6V200h-4.8v1.6z"/></g></svg>

After

Width:  |  Height:  |  Size: 4.6 KiB

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="ukraine"><path d="M0 248v121.6C0 396.8 21.6 416 48 416h400c26.4 0 48-19.2 48-46.4V248H0z" fill="#fdce0c"/><path d="M248 248l197.6 168c26.4 0 50.4-19.2 50.4-46.4V248H248z" fill="#f4ba00"/><path d="M448 80H48C21.6 80 0 99.2 0 126.4V248h496V126.4c0-27.2-21.6-46.4-48-46.4z" fill="#44c1ef"/><path d="M448 80H48l200 168h248V126.4c0-27.2-21.6-46.4-48-46.4z" fill="#18b4ea"/><path d="M496 368.8c0 29.6-21.6 47.2-48 47.2H48c-26.4 0-48-20.8-48-48" fill="#f2a700"/><path d="M48 80h400c26.4 0 48 19.2 48 46.4V216" fill="#10a2e2"/></svg>

After

Width:  |  Height:  |  Size: 593 B

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 12 KiB

View File

@ -20,6 +20,7 @@ interface CommonStyleProps {
size: Breakpoint;
pointer?: boolean;
}
const commonStyle = ({ size = 'sm', pointer }: CommonStyleProps): object => ({
display: 'inline-block',
cursor: pointer ? 'pointer' : 'default',

View File

@ -0,0 +1,227 @@
import React, { MouseEvent, useCallback, useState, useRef, useContext } from 'react';
import LanguageIcon from '@material-ui/icons/Language';
import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
import i18next, { TFunction } from 'i18next';
import { useTranslation } from 'react-i18next';
import { withStyles } from '@material-ui/core/styles';
import ClickAwayListener from '@material-ui/core/ClickAwayListener';
import Grow from '@material-ui/core/Grow';
import Popper from '@material-ui/core/Popper';
import MenuList from '@material-ui/core/MenuList';
import styled from '@emotion/styled';
import { Language } from '../../../i18n/config';
import ThemeContext from '../../design-tokens/ThemeContext';
import Paper from '../../muiComponents/Paper';
import MenuItem from '../../muiComponents/MenuItem';
import Button from '../../muiComponents/Button';
import Tooltip from '../../muiComponents/Tooltip';
import Divider from '../../muiComponents/Divider';
import Box from '../../muiComponents/Box';
import { Theme } from '../../design-tokens/theme';
import Link from '../Link';
import Icon from '../Icon';
const VERDACCIO_UI_GITHUB_REPOSITORY = 'https://github.com/verdaccio/ui';
const getTranslatedCurrentLanguageDetails = (
t: TFunction,
currentLanguage: string
): { translation: string; icon: React.ComponentProps<typeof Icon>['name'] } => {
switch (currentLanguage) {
case 'fr-FR':
return {
translation: t('lng.french'),
icon: 'france',
};
case 'pt-BR':
return {
translation: t('lng.portuguese'),
icon: 'brazil',
};
case 'de-DE':
return {
translation: t('lng.german'),
icon: 'germany',
};
case 'es-ES':
return {
translation: t('lng.spanish'),
icon: 'spain',
};
case 'zh-CN':
return {
translation: t('lng.chinese'),
icon: 'china',
};
case 'ja-JP':
return {
translation: t('lng.japanese'),
icon: 'japan',
};
case 'uk-UA':
return {
translation: t('lng.ukraine'),
icon: 'ukraine',
};
case 'km-KH':
return {
translation: t('lng.khmer'),
icon: 'khmer',
};
default:
return {
translation: t('lng.english'),
icon: 'usa',
};
}
};
const LanguageSwitch = () => {
const themeContext = useContext(ThemeContext);
const { t } = useTranslation();
const [open, setOpen] = useState(false);
const anchorRef = useRef<HTMLButtonElement>(null);
if (!themeContext) {
throw Error(t('theme-context-not-correct-used'));
}
const languages = (i18next.options.resources ? Object.keys(i18next.options.resources) : []) as Array<Language>;
const currentLanguage = themeContext.language;
const { translation: userLanguage } = getTranslatedCurrentLanguageDetails(t, currentLanguage);
const handleToggle = useCallback(() => {
setOpen(prevOpen => !prevOpen);
}, []);
const handleClose = useCallback(
(event: MouseEvent<HTMLLIElement | Document | HTMLAnchorElement>) => {
if (anchorRef.current) {
if (anchorRef.current.contains(event.currentTarget)) {
return;
}
}
setOpen(false);
},
[setOpen]
);
const handleSwitchLanguage = useCallback(
(language: Language) => (event: MouseEvent<HTMLLIElement>) => {
themeContext.setLanguage(language);
handleClose(event);
},
[handleClose, themeContext]
);
// return focus to the button when we transitioned from !open -> open
const prevOpen = React.useRef(open);
React.useEffect(() => {
if (prevOpen.current === true && open === false) {
if (anchorRef.current) {
anchorRef.current.focus();
}
}
prevOpen.current = open;
}, [open]);
return (
<Wrapper>
<Tooltip enterDelay={300} title={t('change-language')}>
<SwitchButton color="inherit" onClick={handleToggle} ref={anchorRef}>
<LanguageIcon />
<UserLanguage>{userLanguage}</UserLanguage>
<ExpandMoreIcon fontSize="small" />
</SwitchButton>
</Tooltip>
<Popper anchorEl={anchorRef.current} disablePortal={true} open={open} role={undefined} transition={true}>
{({ TransitionProps }) => (
<Grow {...TransitionProps}>
<StyledPaper>
<ClickAwayListener onClickAway={handleClose}>
<MenuList>
{languages
.filter(language => language !== currentLanguage)
.map(language => {
const { icon, translation } = getTranslatedCurrentLanguageDetails(t, language);
return (
<StyledMenuItem
key={language}
onClick={handleSwitchLanguage(language)}
selected={userLanguage === translation}>
<Icon name={icon} size="md" />
{translation}
</StyledMenuItem>
);
})}
<Box my={1}>
<Divider />
</Box>
<MenuItem button={true}>
<StyledLink external={true} onClick={handleClose} to={VERDACCIO_UI_GITHUB_REPOSITORY}>
{`${t('help-to-translate')}`}
</StyledLink>
</MenuItem>
</MenuList>
</ClickAwayListener>
</StyledPaper>
</Grow>
)}
</Popper>
</Wrapper>
);
};
export default LanguageSwitch;
const Wrapper = styled('div')<{ theme?: Theme }>(({ theme }) => ({
display: 'none',
[`@media screen and (min-width: ${theme && theme.breakPoints.medium}px)`]: {
display: 'inline-block',
},
}));
const UserLanguage = styled('span')<{ theme?: Theme }>(({ theme }) => ({
display: 'none',
[`@media screen and (min-width: ${theme && theme.breakPoints.medium}px)`]: {
display: 'inline-block',
},
}));
const SwitchButton = withStyles((theme: Theme) => ({
label: {
display: 'grid',
gridGap: theme?.spacing(1),
gridTemplateColumns: '24px 20px',
[`@media screen and (min-width: ${theme && theme.breakPoints.medium}px)`]: {
gridTemplateColumns: '24px 1fr 20px',
},
},
}))(Button);
const StyledMenuItem = withStyles((theme: Theme) => ({
root: {
display: 'grid',
cursor: 'pointer',
gridGap: theme?.spacing(0.5),
gridTemplateColumns: '20px 1fr',
alignItems: 'center',
'&:first-child': {
borderTopLeftRadius: 4,
borderTopRightRadius: 4,
},
},
}))(MenuItem);
const StyledLink = styled(Link)<{ theme?: Theme }>(({ theme }) => ({
color: theme?.palette.type === 'dark' ? theme?.palette.white : theme?.palette.text.primary,
textDecoration: 'none',
}));
const StyledPaper = styled(Paper)<{ theme?: Theme }>(({ theme }) => ({
backgroundColor: theme?.palette.type === 'dark' ? theme?.palette.cyanBlue : theme?.palette.white,
}));

View File

@ -0,0 +1 @@
export { default } from './LanguageSwitch';

View File

@ -9,20 +9,6 @@ import Avatar from '../../muiComponents/Avatar';
import Box from '../../muiComponents/Box';
import IconButton from '../../muiComponents/IconButton';
import { Theme } from '../../design-tokens/theme';
const StyledAvatar = styled(Avatar)<{ theme?: Theme }>(({ theme }) => ({
margin: theme.spacing(1),
backgroundColor: theme.palette.primary.main,
color: theme.palette.white,
}));
const StyledIconButton = styled(IconButton)<{ theme?: Theme }>(({ theme }) => ({
position: 'absolute',
right: theme.spacing() / 2,
top: theme.spacing() / 2,
color: theme.palette.grey[500],
}));
interface Props {
onClose?: () => void;
}
@ -46,3 +32,16 @@ const LoginDialogHeader: React.FC<Props> = ({ onClose }) => {
};
export default LoginDialogHeader;
const StyledAvatar = styled(Avatar)<{ theme?: Theme }>(({ theme }) => ({
margin: theme?.spacing(1),
backgroundColor: theme?.palette.type === 'light' ? theme?.palette.primary.main : theme?.palette.cyanBlue,
color: theme?.palette.white,
}));
const StyledIconButton = styled(IconButton)<{ theme?: Theme }>(({ theme }) => ({
position: 'absolute',
right: theme?.spacing() / 2,
top: theme?.spacing() / 2,
color: theme?.palette.grey[500],
}));

View File

@ -10,16 +10,6 @@ import { Theme } from '../../design-tokens/theme';
import PackageImg from './img/package.svg';
const EmptyPackage = styled('img')({
width: '150px',
margin: '0 auto',
});
const StyledHeading = styled(Heading)<{ theme?: Theme }>(props => ({
color: props.theme && props.theme.palette.primary.main,
marginBottom: 16,
}));
const NotFound: React.FC = () => {
const history = useHistory();
const { t } = useTranslation();
@ -49,3 +39,13 @@ const NotFound: React.FC = () => {
};
export default NotFound;
const EmptyPackage = styled('img')({
width: '150px',
margin: '0 auto',
});
const StyledHeading = styled(Heading)<{ theme?: Theme }>(({ theme }) => ({
color: theme?.palette.type === 'light' ? theme?.palette.primary.main : theme?.palette.white,
marginBottom: 16,
}));

View File

@ -15,7 +15,7 @@ export const OverviewItem = styled('span')<{ theme?: Theme }>(({ theme }) => ({
display: 'flex',
alignItems: 'center',
margin: '0 0 0 16px',
color: theme?.palette.type === 'light' ? theme?.palette.greyLight2 : theme?.palette.dodgerBlue,
color: theme?.palette.type === 'light' ? theme?.palette.greyLight2 : theme?.palette.white,
fontSize: 12,
[`@media (max-width: ${theme && theme.breakPoints.medium}px)`]: {
':nth-of-type(3)': {
@ -31,18 +31,18 @@ export const OverviewItem = styled('span')<{ theme?: Theme }>(({ theme }) => ({
export const Icon = styled(Ico)<{ theme?: Theme }>(({ theme }) => ({
margin: '2px 10px 0 0',
fill: theme?.palette.type === 'light' ? theme?.palette.greyLight2 : theme?.palette.dodgerBlue,
fill: theme?.palette.type === 'light' ? theme?.palette.greyLight2 : theme?.palette.white,
}));
export const Published = styled('span')<{ theme?: Theme }>(({ theme }) => ({
color: theme?.palette.type === 'light' ? theme?.palette.greyLight2 : theme?.palette.dodgerBlue,
color: theme?.palette.type === 'light' ? theme?.palette.greyLight2 : theme?.palette.white,
margin: '0 5px 0 0',
}));
export const Text = styled(Label)<{ theme?: Theme }>(({ theme }) => ({
fontSize: '12px',
fontWeight: theme?.fontWeight.semiBold,
color: theme?.palette.type === 'light' ? theme?.palette.greyLight2 : theme?.palette.dodgerBlue,
color: theme?.palette.type === 'light' ? theme?.palette.greyLight2 : theme?.palette.white,
}));
export const Details = styled('span')({
@ -71,7 +71,7 @@ export const PackageTitle = styled('span')<{ theme?: Theme }>(({ theme }) => ({
fontSize: 20,
display: 'block',
marginBottom: 12,
color: theme?.palette.type == 'dark' ? theme?.palette.white : theme?.palette.eclipse,
color: theme?.palette.type == 'dark' ? theme?.palette.dodgerBlue : theme?.palette.eclipse,
cursor: 'pointer',
[`@media (max-width: ${theme && theme.breakPoints.small}px)`]: {
fontSize: 14,
@ -86,7 +86,7 @@ export const GridRightAligned = styled(Grid)({
export const PackageList = styled(List)<{ theme?: Theme }>(({ theme }) => ({
padding: '12px 0 12px 0',
':hover': {
backgroundColor: theme?.palette?.type == 'dark' ? theme?.palette?.primary.main : theme?.palette?.greyLight3,
backgroundColor: theme?.palette?.type == 'dark' ? theme?.palette?.secondary.main : theme?.palette?.greyLight3,
},
'> :last-child': {
paddingTop: 0,
@ -104,7 +104,8 @@ export const IconButton = styled(MuiIconButton)({
export const TagContainer = styled('span')<{ theme?: Theme }>(({ theme }) => ({
marginTop: 8,
marginBottom: 12,
display: 'block',
display: 'flex',
flexWrap: 'wrap',
[`@media (max-width: ${theme && theme.breakPoints.medium}px)`]: {
display: 'none',
},
@ -114,8 +115,8 @@ export const PackageListItemText = styled(ListItemText)({
paddingRight: 0,
});
export const Description = styled(Typography)<{ theme?: Theme }>(props => ({
color: props.theme && props.theme.palette.greyDark2,
export const Description = styled(Typography)<{ theme?: Theme }>(({ theme }) => ({
color: theme?.palette.type === 'light' ? theme?.palette.greyDark2 : theme?.palette.white,
fontSize: '14px',
paddingRight: 0,
}));

View File

@ -1,8 +1,11 @@
import { createContext } from 'react';
import { Language } from '../../i18n/config';
interface Props {
isDarkMode: boolean;
setIsDarkMode: (isDarkMode: boolean) => void;
language: Language;
setLanguage: (language: Language) => void;
}
const ThemeContext = createContext<undefined | Props>(undefined);

View File

@ -1,19 +1,33 @@
import React from 'react';
import React, { useEffect } from 'react';
import { ThemeProvider as MuiThemeProvider } from '@material-ui/core/styles';
import { ThemeProvider as EmotionThemeProvider } from 'emotion-theming';
import i18next from 'i18next';
import loadDayJSLocale from './load-dayjs-locale';
import ThemeContext from './ThemeContext';
import { getTheme, ThemeMode } from './theme';
import useLocalStorage from './useLocalStorage';
const ThemeProvider: React.FC = ({ children }) => {
const isDarkModeDefault = window?.__VERDACCIO_BASENAME_UI_OPTIONS?.darkMode;
const currentLanguage = i18next.languages?.[0];
const [isDarkMode, setIsDarkMode] = useLocalStorage('darkMode', !!isDarkModeDefault);
const [language, setLanguage] = useLocalStorage('language', currentLanguage);
const themeMode: ThemeMode = isDarkMode ? 'dark' : 'light';
const changeLanguage = async () => {
await i18next.changeLanguage(language);
};
useEffect(() => {
changeLanguage();
loadDayJSLocale();
}, [language, changeLanguage, loadDayJSLocale]);
return (
<ThemeContext.Provider value={{ isDarkMode, setIsDarkMode }}>
<ThemeContext.Provider value={{ isDarkMode, setIsDarkMode, language, setLanguage }}>
<EmotionThemeProvider theme={getTheme(themeMode)}>
<MuiThemeProvider theme={getTheme(themeMode)}>{children}</MuiThemeProvider>
</EmotionThemeProvider>

View File

@ -19,20 +19,14 @@ function loadDayJSLocale() {
const fallbackLanguage = getFallFackLanguage();
const locale = i18n.language || fallbackLanguage;
// dayjs loades en-US by default
if (!locale || locale === 'en-US') {
return;
}
switch (locale.toLowerCase()) {
// At the moment we only support pt-BR, please see: i18n/translations/*
switch (locale?.toLowerCase()) {
case 'pt-br':
{
require('dayjs/locale/pt-br');
dayjs.locale('pt-br');
}
break;
case 'de':
case 'de-de':
{
require('dayjs/locale/de');
dayjs.locale('de');
@ -44,7 +38,35 @@ function loadDayJSLocale() {
dayjs.locale('es');
}
break;
case 'fr-fr':
{
require('dayjs/locale/fr');
dayjs.locale('fr');
}
break;
case 'zh-cn':
{
require('dayjs/locale/zh-cn');
dayjs.locale('zh-cn');
}
break;
case 'ja-jp':
{
require('dayjs/locale/ja');
dayjs.locale('ja');
}
break;
case 'uk-ua':
{
require('dayjs/locale/uk');
dayjs.locale('uk');
}
break;
default:
{
require('dayjs/locale/en');
dayjs.locale('en');
}
break;
}
}

View File

@ -25,6 +25,7 @@ const colors = {
secondary: '#20232a',
background: '#fff',
dodgerBlue: '#1ba1f2',
cyanBlue: '#253341',
};
const themeModes = {
@ -33,8 +34,8 @@ const themeModes = {
},
dark: {
...colors,
primary: '#253341',
secondary: '#20232a',
primary: '#fff',
secondary: '#424242',
background: '#1A202C',
},
};
@ -132,6 +133,7 @@ declare module '@material-ui/core/styles/createPalette' {
nobel02: string;
background: string;
dodgerBlue: string;
cyanBlue: string;
}
/* eslint-disable-next-line @typescript-eslint/no-empty-interface */

View File

@ -1,4 +1,5 @@
import React, { forwardRef } from 'react';
import styled from '@emotion/styled';
import { default as MaterialUIMenuItem, MenuItemProps } from '@material-ui/core/MenuItem';
type HTMLElementTagName = keyof HTMLElementTagNameMap;
@ -8,10 +9,10 @@ interface Props extends Omit<MenuItemProps, 'component'> {
component?: HTMLElementTagName;
}
const MenuItem = forwardRef<MenuItemRef, Props>(function MenuItem({ button, ...props }, ref) {
const MenuItem = forwardRef<MenuItemRef, Props>(function MenuItem(props, ref) {
// it seems typescript has some discrimination type limitions. Please see: https://github.com/mui-org/material-ui/issues/14971
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return <MaterialUIMenuItem {...props} button={button as any} innerRef={ref} />;
// @ts-ignore Type Types of property 'button' are incompatible.
return <StyledMaterialUIMenuItem {...props} ref={ref as any} />;
});
MenuItem.defaultProps = {
@ -19,3 +20,6 @@ MenuItem.defaultProps = {
};
export default MenuItem;
const StyledMaterialUIMenuItem = styled(MaterialUIMenuItem)({
outline: 'none',
});

View File

@ -1,6 +1,6 @@
import { SyntheticEvent } from 'react';
import { copyToClipBoardUtility } from './cli-utils';
import { copyToClipBoardUtility, getCLISetConfigRegistry } from './cli-utils';
describe('copyToClipBoardUtility', () => {
let originalGetSelection;
@ -47,3 +47,18 @@ describe('copyToClipBoardUtility', () => {
expect(spys.removeChild).toHaveBeenCalledWith(expectedDiv);
});
});
describe('getCLISetRegistry', () => {
const command = 'npm set';
const scope = '@testscope';
const blankScope = '';
const url = 'https://test.local';
test('should return ":" separated string when scope is set', () => {
expect(getCLISetConfigRegistry(command, scope, url)).toEqual(`${command} ${scope}:registry ${url}`);
});
test('should not output scope when scope is not set', () => {
expect(getCLISetConfigRegistry(command, blankScope, url)).toEqual(`${command} registry ${url}`);
});
});

View File

@ -21,7 +21,8 @@ export const copyToClipBoardUtility = (str: string): ((e: SyntheticEvent<HTMLEle
};
export function getCLISetConfigRegistry(command: string, scope: string, registryUrl: string): string {
return `${command} ${scope}registry ${registryUrl}`;
// if there is a scope defined there needs to be a ":" separator between the scope and the registry
return `${command} ${scope}${scope !== '' ? ':' : ''}registry ${registryUrl}`;
}
export function getCLISetRegistry(command: string, registryUrl: string): string {

View File

@ -50,7 +50,7 @@ describe('formatRepository', (): void => {
describe('formatDate', (): void => {
test('should format the date', (): void => {
const date = 1532211072138;
expect(formatDate(date)).toEqual('21.07.2018, 22:11:12');
expect(formatDate(date)).toEqual('07/21/2018 10:11:12 PM');
});
});
@ -78,7 +78,7 @@ describe('formatDateDistance', (): void => {
describe('getLastUpdatedPackageTime', (): void => {
test('should get the last update time', (): void => {
const lastUpdated = packageMeta._uplinks;
expect(getLastUpdatedPackageTime(lastUpdated)).toEqual('22.07.2018, 22:11:12');
expect(getLastUpdatedPackageTime(lastUpdated)).toEqual('07/22/2018 10:11:12 PM');
});
test('should get the last update time for blank uplink', (): void => {
@ -91,9 +91,9 @@ describe('getRecentReleases', (): void => {
test('should get the recent releases', (): void => {
const { time } = packageMeta;
const result = [
{ time: '14.12.2017, 15:43:27', version: '2.7.1' },
{ time: '05.12.2017, 23:25:06', version: '2.7.0' },
{ time: '08.11.2017, 22:47:16', version: '2.6.6' },
{ time: '12/14/2017 3:43:27 PM', version: '2.7.1' },
{ time: '12/05/2017 11:25:06 PM', version: '2.7.0' },
{ time: '11/08/2017 10:47:16 PM', version: '2.6.6' },
];
expect(getRecentReleases(time)).toEqual(result);
expect(getRecentReleases()).toEqual([]);

View File

@ -1,16 +1,18 @@
import { isObject } from 'util';
import i18n from 'i18next';
import i18next from 'i18next';
import { UpLinks } from '@verdaccio/types';
import isString from 'lodash/isString';
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
import localizedFormat from 'dayjs/plugin/localizedFormat';
import { Time } from '../../types/packageMeta';
export const TIMEFORMAT = 'DD.MM.YYYY, HH:mm:ss';
export const TIMEFORMAT = 'L LTS';
dayjs.extend(relativeTime);
dayjs.extend(localizedFormat);
/**
* Formats license field for webui.
@ -93,5 +95,5 @@ export function getRecentReleases(time: Time = {}): Time[] {
}
export function getAuthorName(authorName: string): string {
return authorName.toLowerCase() === 'anonymous' ? i18n.t('author-anonymous') : authorName;
return authorName.toLowerCase() === 'anonymous' ? i18next.t('author-anonymous') : authorName;
}

View File

@ -1976,6 +1976,16 @@
"@types/yargs" "^15.0.0"
chalk "^3.0.0"
"@jest/types@^25.2.3":
version "25.2.3"
resolved "https://registry.verdaccio.org/@jest%2ftypes/-/types-25.2.3.tgz#035c4fb94e2da472f359ff9a211915d59987f6b6"
integrity sha512-6oLQwO9mKif3Uph3RX5J1i3S7X7xtDHWBaaaoeKw8hOzV6YUd0qDcYcHZ6QXMHDIzSr7zzrEa51o2Ovlj6AtKQ==
dependencies:
"@types/istanbul-lib-coverage" "^2.0.0"
"@types/istanbul-reports" "^1.1.1"
"@types/yargs" "^15.0.0"
chalk "^3.0.0"
"@marionebl/sander@^0.6.0":
version "0.6.1"
resolved "https://registry.verdaccio.org/@marionebl%2fsander/-/sander-0.6.1.tgz#1958965874f24bc51be48875feb50d642fc41f7b"
@ -2321,12 +2331,13 @@
"@types/istanbul-lib-coverage" "*"
"@types/istanbul-lib-report" "*"
"@types/jest@24.0.24":
version "24.0.24"
resolved "https://registry.verdaccio.org/@types%2fjest/-/jest-24.0.24.tgz#0f2f523dc77cc1bc6bef34eaf287ede887a73f05"
integrity sha512-vgaG968EDPSJPMunEDdZvZgvxYSmeH8wKqBlHSkBt1pV2XlLEVDzsj1ZhLuI4iG4Pv841tES61txSBF0obh4CQ==
"@types/jest@25.1.4":
version "25.1.4"
resolved "https://registry.verdaccio.org/@types%2fjest/-/jest-25.1.4.tgz#9e9f1e59dda86d3fd56afce71d1ea1b331f6f760"
integrity sha512-QDDY2uNAhCV7TMCITrxz+MRk1EizcsevzfeS6LykIlq2V1E5oO4wXG8V2ZEd9w7Snxeeagk46YbMgZ8ESHx3sw==
dependencies:
jest-diff "^24.3.0"
jest-diff "^25.1.0"
pretty-format "^25.1.0"
"@types/jest@^23.0.2":
version "23.3.14"
@ -5699,6 +5710,11 @@ diff-sequences@^24.9.0:
resolved "https://registry.verdaccio.org/diff-sequences/-/diff-sequences-24.9.0.tgz#5715d6244e2aa65f48bba0bc972db0b0b11e95b5"
integrity sha512-Dj6Wk3tWyTE+Fo1rW8v0Xhwk80um6yFYKbuAxc9c3EZxIHFDYwbi34Uk42u1CdnIiVorvt4RmlSDjIPyzGC2ew==
diff-sequences@^25.2.1:
version "25.2.1"
resolved "https://registry.verdaccio.org/diff-sequences/-/diff-sequences-25.2.1.tgz#fcfe8aa07dd9b0c648396a478dabca8e76c6ab27"
integrity sha512-foe7dXnGlSh3jR1ovJmdv+77VQj98eKCHHwJPbZ2eEf0fHwKbkZicpPxEch9smZ+n2dnF6QFwkOQdLq9hpeJUg==
diff@3.5.0:
version "3.5.0"
resolved "https://registry.verdaccio.org/diff/-/diff-3.5.0.tgz#800c0dd1e0a8bfbc95835c202ad220fe317e5a12"
@ -8078,10 +8094,10 @@ imurmurhash@^0.1.4:
resolved "https://registry.verdaccio.org/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea"
integrity sha1-khi5srkoojixPcT7a21XbyMUU+o=
in-publish@2.0.0:
version "2.0.0"
resolved "https://registry.verdaccio.org/in-publish/-/in-publish-2.0.0.tgz#e20ff5e3a2afc2690320b6dc552682a9c7fadf51"
integrity sha1-4g/146KvwmkDILbcVSaCqcf631E=
in-publish@2.0.1:
version "2.0.1"
resolved "https://registry.verdaccio.org/in-publish/-/in-publish-2.0.1.tgz#948b1a535c8030561cea522f73f78f4be357e00c"
integrity sha512-oDM0kUSNFC31ShNxHKUyfZKy8ZeXZBWMjMdZHKLOk13uvT27VTL/QzRGfRUcevJhpkZAvlhPYuXkF7eNWrtyxQ==
indent-string@^2.1.0:
version "2.1.0"
@ -8779,7 +8795,7 @@ jest-config@^24.9.0:
pretty-format "^24.9.0"
realpath-native "^1.1.0"
jest-diff@^24.0.0, jest-diff@^24.3.0, jest-diff@^24.9.0:
jest-diff@^24.0.0, jest-diff@^24.9.0:
version "24.9.0"
resolved "https://registry.verdaccio.org/jest-diff/-/jest-diff-24.9.0.tgz#931b7d0d5778a1baf7452cb816e325e3724055da"
integrity sha512-qMfrTs8AdJE2iqrTp0hzh7kTd2PQWrsFyj9tORoKmu32xjPjeE4NyjVRDz8ybYwqS2ik8N4hsIpiVTyFeo2lBQ==
@ -8789,6 +8805,16 @@ jest-diff@^24.0.0, jest-diff@^24.3.0, jest-diff@^24.9.0:
jest-get-type "^24.9.0"
pretty-format "^24.9.0"
jest-diff@^25.1.0:
version "25.2.3"
resolved "https://registry.verdaccio.org/jest-diff/-/jest-diff-25.2.3.tgz#54d601a0a754ef26e808a8c8dbadd278c215aa3f"
integrity sha512-VtZ6LAQtaQpFsmEzps15dQc5ELbJxy4L2DOSo2Ev411TUEtnJPkAMD7JneVypeMJQ1y3hgxN9Ao13n15FAnavg==
dependencies:
chalk "^3.0.0"
diff-sequences "^25.2.1"
jest-get-type "^25.2.1"
pretty-format "^25.2.3"
jest-docblock@^24.3.0:
version "24.9.0"
resolved "https://registry.verdaccio.org/jest-docblock/-/jest-docblock-24.9.0.tgz#7970201802ba560e1c4092cc25cbedf5af5a8ce2"
@ -8869,6 +8895,11 @@ jest-get-type@^24.9.0:
resolved "https://registry.verdaccio.org/jest-get-type/-/jest-get-type-24.9.0.tgz#1684a0c8a50f2e4901b6644ae861f579eed2ef0e"
integrity sha512-lUseMzAley4LhIcpSP9Jf+fTrQ4a1yHQwLNeeVa2cEmbCGeoZAtYPOIv8JaxLD/sUpKxetKGP+gsHl8f8TSj8Q==
jest-get-type@^25.2.1:
version "25.2.1"
resolved "https://registry.verdaccio.org/jest-get-type/-/jest-get-type-25.2.1.tgz#6c83de603c41b1627e6964da2f5454e6aa3c13a6"
integrity sha512-EYjTiqcDTCRJDcSNKbLTwn/LcDPEE7ITk8yRMNAOjEsN6yp+Uu+V1gx4djwnuj/DvWg0YGmqaBqPVGsPxlvE7w==
jest-haste-map@^24.9.0:
version "24.9.0"
resolved "https://registry.verdaccio.org/jest-haste-map/-/jest-haste-map-24.9.0.tgz#b38a5d64274934e21fa417ae9a9fbeb77ceaac7d"
@ -12219,6 +12250,16 @@ pretty-format@^24.0.0, pretty-format@^24.3.0, pretty-format@^24.9.0:
ansi-styles "^3.2.0"
react-is "^16.8.4"
pretty-format@^25.1.0, pretty-format@^25.2.3:
version "25.2.3"
resolved "https://registry.verdaccio.org/pretty-format/-/pretty-format-25.2.3.tgz#ba6e9603a0d80fa2e470b1fed55de1f9bfd81421"
integrity sha512-IP4+5UOAVGoyqC/DiomOeHBUKN6q00gfyT2qpAsRH64tgOKB2yF7FHJXC18OCiU0/YFierACup/zdCOWw0F/0w==
dependencies:
"@jest/types" "^25.2.3"
ansi-regex "^5.0.0"
ansi-styles "^4.0.0"
react-is "^16.12.0"
prettycli@^1.4.3:
version "1.4.3"
resolved "https://registry.verdaccio.org/prettycli/-/prettycli-1.4.3.tgz#b28ec2aad9de07ae1fd75ef294fb54cbdee07ed5"