Should the colon of field labels be inside or outside ts()?
I'm working on an Angular UI where labels for checkboxes do not end with a :
(because with checkboxes, labels are on the right) but labels for text inputs end with a :
(because with text fields, labels are on the left). In one section of the UI, the colon conditionally appears if you check the box (because other options appear to the right).
As you can see in the screenshot, checking the box adds a colon to the labels "Link:" "Tooltip:" and "Rewrite:" because visually they now represent more than just the checkbox, but everything to their right as well.
Here's my question. Currently the code for these labels looks like this:
{{ isChecked ? ts('Label:') : ts('Label') }}
This will work fine in other languages if the translation is done thoroughly, however if the two strings get translated differently (or one gets translated and the other does not) then it will cause a bizarre jump as the entire string changes!
That sounds bad, so I'm wondering if the lesser of two evils would be to only put the word inside ts()
and conditionally add the literal :
character. Would that be terrible in some languages?