monkeytype
monkeytype copied to clipboard
fix: Indicate typos below disjoining letters in languages with ligatures (NadAlaba)
Description
- Moved
<hint>
elements from<letter .incorrect>
to<.word>
, because hints were messing the joining of letters in languages with cursive attachments "withLigatures". Hint characters, that correspond to adjacent incorrect letters, now join together as a word when there is an overlap between them, which can happen in non monospaced fonts regardless if the current language has "ligatures" or not (Intest-ui.ts
: New functionscreateHintsHtml()
andasync function joinOverlappingHints()
, and changes toupdateWordElement()
). - Recalculate hints position whenever font size or font family is changed (In
test-ui.ts
: Newasync function updateHintsPosition()
) - Made
updateWordElement()
async in order to callawait joinOverlappingHints();
, and made all calls to this functionvoid updateWordWlement();
(Ininput-controller.ts
andtest-ui.ts
) - Styled
<.word>
asposition: relative
instead of.word letter.incorrect {position: relative}
, in order to be able to position<hint>
s absolutely relative to the corresponding<.word>
(Instyles/test.scss
). - Corrected the position of the caret, because after making
<.word>
relative,<letter>
s were givingoffsetLeft
andoffsetTop
relative to the<.word>
instead of relative to<#wordsWrapper>
, so had to add the offset position of<.word .active>
to the position of the caret. (Incaret.ts
: Changes toupdatePosition()
). - Same changes as 4 above to the pace caret (In
pace-caret.ts
: Changes toupdate()
). - Corrected the position of the starting point of the pace caret in RTL languages, because it was starting after the first letter in each word, and had to make
resetCaretPosition()
andupdate()
async
in order to check if current language is RTL (to be able to callawait Misc.getCurrentLanguage();
), and made the call toupdate()
void update()
infunction start() {}
(Inpace-caret.ts
: Changes toresetCaretPosition()
,update()
, andstart()
).
Checks
- [ ] Adding quotes?
- [ ] Make sure to include translations for the quotes in the description (or another comment) so we can verify their content.
- [ ] Adding a language or a theme?
- [ ] If is a language, did you edit
_list.json
,_groups.json
and addlanguages.json
? - [ ] If is a theme, did you add the theme.css?
- Also please add a screenshot of the theme, it would be extra awesome if you do so!
- [ ] If is a language, did you edit
- [x] Check if any open issues are related to this PR; if so, be sure to tag them below.
- [x] Make sure the PR title follows the Conventional Commits standard. (https://www.conventionalcommits.org for more info)
- [x] Make sure to include your GitHub username inside parentheses at the end of the PR title