[openstreetmap/openstreetmap-website] Use font size instead of italic for changeset/trace descriptions (PR #4813)

Anton Khorev notifications at github.com
Sat May 18 17:08:29 UTC 2024


The problem and links to previous solutions are in #2869. Changeset descriptions were made to use italics "to make them look more like quotes" but that doesn't work well with Chinese and maybe other writing systems and large blocks of italics don't look good. How else can the descriptions be rendered? I tried a few options:

- Bold font: looks too bold. Intermediate font weights: not clear if they are going to be available with every font and writing system that might be in use.
- Decorations like underline: can't use them because descriptions sometimes are links, sometimes are not links, sometimes they contain links inside.
- Colors: also don't look right. Primary color is blue, that looks like a link. Secondary is gray we use for deemphasising. Other colors we mostly don't use, they stick out too much.

How about font size then? Let's make the font slightly bigger.

However that may make another problem worse. The text is now more likely not to fit horizontally. You can't always force words to wrap, but then horizontal scrolling should work fine just for the overflowing descriptions. Except it won't work fine when stretched links are used, and they are used in changeset lists. In this case let's truncate the text while still letting it to wrap if possible.

Screenshots in Chromium, because it shows scrollbars:
![image](https://github.com/openstreetmap/openstreetmap-website/assets/4158490/3a771cc2-2e4d-4dd3-9171-32f429e1d557)
![image](https://github.com/openstreetmap/openstreetmap-website/assets/4158490/5659446b-9a5e-4855-aceb-b373eae464b6)
![image](https://github.com/openstreetmap/openstreetmap-website/assets/4158490/a52611ca-9be5-4570-989e-9c7b12e1b4ae)

You can view, comment on, or merge this pull request online at:

  https://github.com/openstreetmap/openstreetmap-website/pull/4813

-- Commit Summary --

  * Use font size instead of italic for changeset/trace descriptions
  * Let descriptions be horizontally scrollable on changeset/element pages
  * Truncate descriptions horizontally in changeset lists

-- File Changes --

    M app/views/browse/_common_details.html.erb (2)
    M app/views/changesets/_changeset.html.erb (2)
    M app/views/changesets/show.html.erb (2)
    M app/views/traces/_trace.html.erb (2)

-- Patch Links --

https://github.com/openstreetmap/openstreetmap-website/pull/4813.patch
https://github.com/openstreetmap/openstreetmap-website/pull/4813.diff

-- 
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/pull/4813
You are receiving this because you are subscribed to this thread.

Message ID: <openstreetmap/openstreetmap-website/pull/4813 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20240518/0e1392ad/attachment-0001.htm>


More information about the rails-dev mailing list