[openstreetmap/openstreetmap-website] Break long URLs in blog post show (#3018)

Tobias notifications at github.com
Sun Dec 27 13:21:51 UTC 2020


This uses https://getbootstrap.com/docs/4.4/utilities/text/#word-break to break long URLs on the blog post show view.

Example case: https://www.openstreetmap.org/user/tordans/diary/395215

Screenshot before:

![Bildschirmfoto 2020-12-27 um 14 16 15 Kopie](https://user-images.githubusercontent.com/111561/103171702-a0f51f80-484e-11eb-9e27-0612ebb2fe66.jpg)

Screenshot after:

![Bildschirmfoto 2020-12-27 um 14 20 40 Kopie](https://user-images.githubusercontent.com/111561/103171716-be29ee00-484e-11eb-91c7-180c3260fb5c.jpg)

An alternativ solution would be this custom CSS:

```
.diary_post .richtext {
    margin-top: $lineheight;
    // Prevent long URLs from breaking out of the container
    // https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;  
  }
```
You can view, comment on, or merge this pull request online at:

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

-- Commit Summary --

  * Break long URLs in blog post show

-- File Changes --

    M app/views/redactions/show.html.erb (2)

-- Patch Links --

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

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/pull/3018
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20201227/edbd7c1c/attachment.htm>


More information about the rails-dev mailing list