Diacritics (used in some languages) in a few text labels of the taxon page are not visible

Platform: Website

Browser: latest Chrome, Firefox

URLs: https://www.inaturalist.org/taxa/494525-Gnaptor-spinimanus

Screenshot:

Description of problem:
If you open any taxon page in a language that uses diacritics, four text labels truncate (do not show) any diacritics that might appear in them. The text labels in English are:

  • TOP OBSERVER
  • TOP IDENTIFIER
  • LAST OBSERVATION
  • TOTAL OBSERVATIONS

In Bulgarian for example, the first label should show “НАЙ-ДОБЪР НАБЛЮДАТЕЛ” but as you can see in the screenshot - the letter “Й” is displayed as “И” which is another letter. It’s similar in Czech which also has diacritics and probably in other languages as well. If i remove the line-height: 1 property of the containing HTML element, the text shows normally.

3 Likes

This happens in French aswell, the e accent grave (è) on « Dernière Observation » is almost completely cut off but if the line-height property is disabled or set to a value greater than 1 (1 is the default), the accent will display normally

2 Likes


Same in Spanish. The word above “13 marzo 2025” should be “OBSERVACIÓN”. I’m using Brave on Linux.

The Latin letter Ó can be decomposed in Unicode to O and an accent, but AFAIK the Cyrillic letter Й, although it is И with a breve, cannot, so that’s not what’s happening. Same with ё, used in Russian and Belarusian, but not Bulgiarian.

2 Likes

I didn’t mean that the diacritics are being removed but that the top of the text is cut off which results in diacritics not being visible (the diacritics are still there and can be copy-pasted).

3 Likes

I made a github issue for this: https://github.com/inaturalist/inaturalist/issues/4477

2 Likes

We increased the line height. I can see the diacritics now in French and Russian. How are they looking to native speakers?

They are still stripped a bit. It looks like this:
inat-diacritics1
When it should look like this:
inat-diacritics2