[openstreetmap/openstreetmap-website] Add Bootstrap .d-none class to print styles to hide svg defs (PR #5999)

[Anton Khorev]

I merged #5752 which started to use svg `<defs>` more widely. They are in `<svg>` elements that still take space on the page unless hidden. We hide these images with `d-none` class. The problem is this is a Bootstrap class and we don't load Bootstrap for print styles. This is how the map looks in print view:

![image](https://github.com/user-attachments/assets/cb7f4534-7af3-405f-9487-bd782d250c8f)

Notice the empty space above the map. I also did that hiding before with routing icons but it wasn't as noticeable because I set width/height on the svg defs image to small enought values.

This PR adds `d-none` class to the print stylesheet:

![image](https://github.com/user-attachments/assets/7cd33c6e-aba1-4c70-92c9-ec7ed8d9206f)

Another option could have been using `hidden` attribute, but it works slightly differently (looks like it prevents margin folding, so the svg still takes some space, even if used together with width=0 + height=0). And I'm not sure if it's standardized yet (https://github.com/w3c/svgwg/issues/508).
You can view, comment on, or merge this pull request online at:

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

-- Commit Summary --

  * Add Bootstrap .d-none class to print styles to hide svg defs

-- File Changes --

    M app/assets/stylesheets/print.scss (7)

-- Patch Links --

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

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

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