Proper RTL support (#1154)

* Add RTL styles. Most of the work is done by the browser 💖

* Refactor getLanguage

* Additional fixes

* Mirror the mouse pointer icon

* Move the vertical scrollbar to the left on RTL

* Revert "Mirror the mouse pointer icon"

This reverts commit f69b132538.
This commit is contained in:
Jed Fox 2020-04-02 12:21:19 -04:00 committed by GitHub
parent 45e4949da0
commit 663526129a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 157 additions and 94 deletions

View file

@ -21,7 +21,12 @@ export const languages = [
{ lng: "ko-KR", label: "한국어", data: require("./locales/ko-KR.json") },
{ lng: "zh-TW", label: "繁體中文", data: require("./locales/zh-TW.json") },
{ lng: "zh-CN", label: "简体中文", data: require("./locales/zh-CN.json") },
{ lng: "ar-SA", label: "عربي", data: require("./locales/ar-SA.json") },
{
lng: "ar-SA",
label: "عربي",
data: require("./locales/ar-SA.json"),
rtl: true,
},
];
let currentLanguage = languages[0];
@ -31,11 +36,13 @@ export function setLanguage(newLng: string | undefined) {
currentLanguage =
languages.find((language) => language.lng === newLng) || fallbackLanguage;
document.documentElement.dir = currentLanguage.rtl ? "rtl" : "ltr";
languageDetector.cacheUserLanguage(currentLanguage.lng);
}
export function getLanguage() {
return currentLanguage.lng;
return currentLanguage;
}
function findPartsForData(data: any, parts: string[]) {