Display errors in the project gallery and on mouseover for the protection status text (German)

Bug Reports
1

Platform PC
Browser Firefox

Description of problem There are two different display errors in the German language version. Screenshot 1 shows a gallery from the City Nature Challenge. The word ‘Schmuckschildkrötenverwandte’ is not hyphenated, causing the text to spill over onto the Pica Pica section. This means that long words must not break the layout but must be hyphenated.

inat-bug
inat-bug1154×879 359 KB

Screenshot 2 shows a mouseover over the conservation status ‘IN’. It reads ‘EingefüHrt’. The capital H must, of course, be written in lower case.

inat-bug2
inat-bug2279×220 27 KB

2

Ich bin mir nicht sicher ob eine Worttrennung an beliebiger Stelle wirklich besser aussieht. Da sind ja zum Einen einige Worttrennungen möglich, zum anderen entscheidet ja leider die Zeilenlänge wo getrennt wird. Die folgende Trennung wäre aus meiner Sicht hässlicher als der kleine Overspill:

Schmuckschildkrö- tenverwandte

Die wäre hübscher:

Schmuckschildkröten- verwandte

Aber bei “Eingeführt” hast Du auf jeden Fall recht.

3

Don’t know the reason for the mouseover capital H. In crowdin, everything is as it should be in lower case

4

Might be a stupid question, but where are those two views from?

5

1st: https://www.inaturalist.org/projects/city-nature-challenge-2026-koblenzregion?tab=species
2nd: everywhere you can find the IN-badge: https://www.inaturalist.org/observations?subview=table&view=species for example (you get the 1st one in here too).

@mreith In such cases, you could also adjust the font size accordingly.

6

iNaturalist uses information provided by volunteers via Crowdin to handle translations of the website and mobile app. Here’s a tutorial on how to use Crowdin and how to fix translations. Introduction to translation with Crowdin

7

It’s not a translation issue, as already mentioned. I’m not much of a programmer, but the problem seems to lie in the taxonMeansTitle function in this file https://github.com/inaturalist/inaturalist/blob/main/app/assets/javascripts/ang/inaturalist_angular.js For some reason, “ü” is treated as some kind of separator, and “hrt” as a new word, and so the “h” is capitalized.

8

I have iNat Rails app running on my computer. I was able to recreate the capitalization bug in German and French. When certain characters are capitalized and title cased, it causes the next character be treated as the start of a new word, therefore the next character is capitalized.

The code $filter( "capitalize" )( text, "title") in inaturalist_angular.js is causing the bug. In the following example, sometimes b is wrongly capitalized.

const texts = ["aüb", "aöb", "aäb", "aùb", "aèb"]
const result = texts.map(text => $filter( "capitalize" )( text, "title"));
console.log(result)

// ["AüB", "Aöb", "AäB", "AùB", "Aèb"]