[openstreetmap/openstreetmap-website] Use flex container instead of floats in header (PR #4296)

[Anton Khorev]

This is a step towards [Bootstrap navbar](https://getbootstrap.com/docs/5.2/components/navbar/), which also uses flex.

You don't want floats there because https://github.com/openstreetmap/openstreetmap-website/issues/3433#issuecomment-1632814133 too and they don't make sense anyway when flex is widely available in browsers.

Fixes #2536 if it was caused by line breaks when measuring widths.

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

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

-- Commit Summary --

  * Switch to flex header container
  * Disable text wrapping while measuring header width

-- File Changes --

    M app/assets/javascripts/application.js (2)
    M app/assets/stylesheets/common.scss (26)
    M app/views/layouts/_header.html.erb (4)

-- Patch Links --

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

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

Message ID: <openstreetmap/openstreetmap-website/pull/4296 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20231018/4eb72dbb/attachment.htm>