Id: CSS "nowrap" for help dialogue

Created on 12 Apr 2019  路  3Comments  路  Source: openstreetmap/iD

When you view the help dialogue in German, the keyboard shortcuts have linebreaks. This makes the view less nice a harder to read and understand.

Testcase: https://www.openstreetmap.org/edit?locale=de

_Possible fix:_ Add white-space: nowrap; to the .modal-shortcuts .shortcut-keys.

See screenshot before / after.

with line breaks

without line breaks and css fix

usability
Source
picture tordans

All 3 comments

@tordans I shortend the explanations: "Festhalten verhindert Vereinigen beim Platzieren", "Trenne den Knoten von seinen Linien/Fl盲chen", "Ecken eines Weges/einer Fl盲che rechtwinklig machen". Looks good:
image

manfredbrandl picture manfredbrandl on 12 Apr 2019
👍1

Thanks @manfredbrandl that looks much better 馃憤
I do agree with @tordans that we should nowrap the shortcut keys.

bhousel picture bhousel on 12 Apr 2019
👍1

Done in 0c29054c36beda245bf77d672337eb7128bbec42. I also made this UI responsive so the two columns wrap to one on smaller displays.

quincylvania picture quincylvania on 12 Apr 2019
❤1
Was this page helpful?
0 / 5 - 0 ratings

Related issues

rivermont picture rivermont  路  3Comments
mvl22 picture mvl22  路  3Comments
manfredbrandl picture manfredbrandl  路  3Comments
bhousel picture bhousel  路  3Comments
jidanni picture jidanni  路  3Comments