[openstreetmap/openstreetmap-website] Arrange base layers menu in a grid (PR #3620)

[Anton Khorev]

> So for example, `.layers-ui.base-layers li` contains `margin-bottom: 8px` - this is an example of a style rule that should be removed, and replaced with either a) nothing, since bootstrap applies appropriate margin-bottoms to most components anyway

But that's not going to happen in our case because:

- layer selection buttons are not Bootstrap components
- we want horizontal gap when two columns are visible - actually there is a default horizontal gap but it's too wide

> or b) a bootstrap utility, e.g. mb-3.

In #3629  I added `g-2` class to rows for 8px gap:
https://github.com/openstreetmap/openstreetmap-website/pull/3629/files#diff-87e33ea7d5e625dd851a78a3192719681de20caea8edd278a10f5342585c98e7R37

> This way, margins are kept consistent all around the site, 

Not in this case because I added a class just in this particular place.

> and are easy to change by customising bootstrap centrally. 

Not in this case unless you are going to redefine `g-2` globally.

> So the same applies to grids, grid spacing, grid margins etc - no singular grid should have its own widths set,

But this grid has its own spacing etc.

> since that means they are inconsistent with any other grid used in the site.

What this grid is supposed to be consistent with if there's no similar grid in the site?

Was adding `g-2` wrong in this case? If it was should I have used the default values instead (larger horizontal gaps and no vertical gaps)? But they look ugly. If it wasn't, why? There's no consistency / centrality in this case and it's still specifying the gap but in a different place in different units.


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

Message ID: <openstreetmap/openstreetmap-website/pull/3620/c1196859932 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20220727/94fcc7ed/attachment.htm>