[openstreetmap/openstreetmap-website] Make use of the linked Bootstrap icons font (PR #6487)

[Pablo Brasero]

@pablobm commented on this pull request.

I'm generally in favour of this change, although I want to highlight that there will be subtle changes to some icons. In particular some appear to be a bit smaller. Just so that we all know what this exactly entails.

This is three of them. Note that I have also seen some that appear completely unchanged:

| Where | Current | Proposed |
| ---------- |  ------------- | ------------- |
| New Diary Entry | <img width="538" height="207" alt="Image" src="https://github.com/user-attachments/assets/b510e6d4-9129-4a2f-995a-01cbfc471b4f" /> |  <img width="538" height="207" alt="Image" src="https://github.com/user-attachments/assets/baff961f-4955-43ea-aa76-d1f5f75000e1" /> |
| Latest Diaries | <img width="603" height="247" alt="Image" src="https://github.com/user-attachments/assets/a359b158-7e6f-4efa-aec3-6977388c30e7" /> | <img width="603" height="247" alt="Image" src="https://github.com/user-attachments/assets/6ff3a735-1191-4cf8-93d4-1a91c773b3db" /> |
| Company icon | <img width="506" height="140" alt="Image" src="https://github.com/user-attachments/assets/412fa741-9b38-4b1e-8c08-903de8bc8a48" /> | <img width="506" height="140" alt="Image" src="https://github.com/user-attachments/assets/7ba387c5-0a5d-478b-afc7-2358471f6e8b" /> |

That's as rendered by Firefox 140.4.0esr with Debian 13 on old hardware.

> @@ -43,7 +43,7 @@ class ProfileCompanyChangeTest < ApplicationSystemTestCase
     assert_text "Profile company updated."
 
     within_content_body do
-      assert_text :all, "Company Test Co."

I was scratching my head about these changes for a minute. Now I see that the `title` argument was being injected into the SVG to serve as `<title>` tag within it.

Is there an accessibility impact? Do user agents read the `<title>` in the SVG? If so, are we losing an accessibility aid? Should these be replaced with an alt text? Not sure how to do that with Bootstrap icons, a quick search seems to suggest to use `.visually-hidden` within the `<i>`: https://getbootstrap.com/docs/5.3/getting-started/accessibility/#visually-hidden-content

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

Message ID: <openstreetmap/openstreetmap-website/pull/6487/review/3398908367 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20251030/c9c38f5a/attachment.htm>