fixed result words history and replay not working correctly with rtl languages as well as languages with ligatures

closes #1357
This commit is contained in:
Miodec 2021-05-09 14:37:47 +01:00
parent 87a79f8cff
commit 54705bbc00
3 changed files with 21 additions and 0 deletions

View file

@ -588,8 +588,12 @@ export async function init() {
}
if (language.ligatures) {
$("#words").addClass("withLigatures");
$("#resultWordsHistory .words").addClass("withLigatures");
$("#resultReplay .words").addClass("withLigatures");
} else {
$("#words").removeClass("withLigatures");
$("#resultWordsHistory .words").removeClass("withLigatures");
$("#resultReplay .words").removeClass("withLigatures");
}
// if (Config.mode == "zen") {
// // Creating an empty active word element for zen mode

View file

@ -607,10 +607,14 @@ export function updateModesNotice() {
export function arrangeCharactersRightToLeft() {
$("#words").addClass("rightToLeftTest");
$("#resultWordsHistory .words").addClass("rightToLeftTest");
$("#resultReplay .words").addClass("rightToLeftTest");
}
export function arrangeCharactersLeftToRight() {
$("#words").removeClass("rightToLeftTest");
$("#resultWordsHistory .words").removeClass("rightToLeftTest");
$("#resultReplay .words").removeClass("rightToLeftTest");
}
async function loadWordsHistory() {

View file

@ -1854,6 +1854,19 @@ key {
position: relative;
margin: 0.18rem 0.6rem 0.15rem 0;
}
&.rightToLeftTest {
//flex-direction: row-reverse; // no need for hacking 😉, CSS fully support right-to-left languages
direction: rtl;
.word {
//flex-direction: row-reverse;
direction: rtl;
}
}
&.withLigatures {
letter {
display: inline;
}
}
}
.correct {
color: var(--text-color);