Re: [openstreetmap/openstreetmap-website] Dark Mode (#2332)

2024-11-14 Thread Alexis Markwick via rails-dev
> As an alternative to reverting, I have created PR #5325 as a quick fix that > basically uses one of the filters from this issue. Please be aware of the performance issues with adding multiple css filters, old hardware will struggle. -- Reply to this email directly or view it on GitHub: https

Re: [openstreetmap/openstreetmap-website] Use CSS filter instead of dimming tiles (PR #5325)

2024-11-14 Thread Alexis Markwick via rails-dev
I quite like the new dark mode. I've used that inversion filter OP mentioned on my own website, but wasn't a fan due to the terrible performance on old devices. I think adding `contrast(1.1)` to the filter would help readability. -- Reply to this email directly or view it on GitHub: https://git

Re: [openstreetmap/openstreetmap-website] Use CSS filter instead of dimming tiles (PR #5325)

2024-11-15 Thread Alexis Markwick via rails-dev
@Dr-Mx commented on this pull request. > @@ -504,7 +504,13 @@ body.small-nav { @include color-mode(dark) { .leaflet-tile-container, .mapkey-table-entry td:first-child > * { -filter: brightness(.8); +filter: invert(100%) hue-rotate(180deg) brightness(95%) contrast(90%); I have tri

Re: [openstreetmap/openstreetmap-website] Use CSS filter instead of dimming tiles (PR #5325)

2024-11-15 Thread Alexis Markwick via rails-dev
@Dr-Mx commented on this pull request. > @@ -504,7 +504,13 @@ body.small-nav { @include color-mode(dark) { .leaflet-tile-container, .mapkey-table-entry td:first-child > * { -filter: brightness(.8); +filter: invert(100%) hue-rotate(180deg) brightness(95%) contrast(90%); @pkrasicki

Re: [openstreetmap/openstreetmap-website] Use CSS filter instead of dimming tiles (PR #5325)

2024-11-15 Thread Alexis Markwick via rails-dev
@Dr-Mx commented on this pull request. > @@ -504,7 +504,13 @@ body.small-nav { @include color-mode(dark) { .leaflet-tile-container, .mapkey-table-entry td:first-child > * { -filter: brightness(.8); +filter: invert(100%) hue-rotate(180deg) brightness(95%) contrast(90%); No PR shou