Although we're using SVG icons because they are being added using pseudo elements it's currently impossible to directly set a size for them to scale to as https://stackoverflow.com/a/8993934 explains.
So instead we use a solution based on the alternate approach there of setting the image as a background image, which can be scaled to our preferred size and then aligned. The only tricky part is working out the vertical size to scale to - just using `1em` doesn't really look right as it doesn't allow for the descenders so I've scaled it up a bit which seems to look about right in firefox and chrome. Here's a before and after example:  You can view, comment on, or merge this pull request online at: https://github.com/openstreetmap/openstreetmap-website/pull/5354 -- Commit Summary -- * Improve scaling and vertical alignment of browse icons -- File Changes -- M app/assets/stylesheets/common.scss (14) -- Patch Links -- https://github.com/openstreetmap/openstreetmap-website/pull/5354.patch https://github.com/openstreetmap/openstreetmap-website/pull/5354.diff -- Reply to this email directly or view it on GitHub: https://github.com/openstreetmap/openstreetmap-website/pull/5354 You are receiving this because you are subscribed to this thread. Message ID: <openstreetmap/openstreetmap-website/pull/5...@github.com>
_______________________________________________ rails-dev mailing list rails-dev@openstreetmap.org https://lists.openstreetmap.org/listinfo/rails-dev