successive whitespaces removed by browser, messes up CLI formatting by confusing translators

[Mingye Wang]

In launchpad translations, when the original text starts with
whitespaces, launchpad will show something like:

En: ·--help-xxx foo bar…
    ···········The xxx help printed is formatted in…
[i] · represents a space character. Enter a space in the equivalent
    position in the translation.

Unfortunately, non-leading/trailing spaces are still discarded by the
browser, since they are not transformed to the circles. Additionally,
this is not enabled for suggestions.

Translators are often seen confused by this, which makes projects like
aria2/zh_CN print ugly help messages on the command line. This is NOT
what projects owners who decided to use lp want to see.

(Imagine that there are supposed to be 2 spaces before 'foo'.)

Suggestion
----------

<hot-fix stylesheet for translators: https://userstyles.org/styles/124565>
(also with an example of a failed help string as screenshot)

1. Use monospace fonts for all translation strings
2. Use `white-space: pre;` rule to deal with whitespaces effortlessly.
3. Remove the spaces-as-images (mis?)feature. The newlines look fine to me
   (so far). You might want to change the rest too:
  a. Perhaps add an explicit end-of-string marker like a red paragraph-
     sign or a red dollar-sign.
  b. If you still want to emphasize spaces (you definitely want to),
     consider using some grey/ blue/green/whatever '·' characters, but
     please make sure it does not break alignment (i.e. one-col-wide).
  c. There is a unicode 'Enter' character for newlines, but it doesn't
     have wide support in fonts. Consider going Vim-ish and using a
     yellow dollar-sign, or just keep using the enter image (the absense
     of spaces-replacements makes it look lonely though.)

Rationale
---------

Column-level alignment has always been an important thing for translation,
especially for CLI apps, which are quite common in the FOSS word that lp
currently handles.

As a translator who does care about this, I believe the changes done in my
stylesheet should be applied globally, using a wiser implementation. The
circles almost never work well -- to me it's a mis-feature.

[Mingye Wang (artoria2e5)]

Some parts like the filter listing page (e.g. https://translations.launchpad.net/aria2/trunk/+pots/aria2/zh_CN/+filter?person=arthur2e5) looks difficult to mark out even with CSS3. Therefore, offical support -- even just adding an id -- looks necessary.