X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/a76a2db37ce91ced0a2ea403a9e90c646c664fb6..d934d6f543b30d9e5247dcf9f0c0b94efa8516a8:/app/assets/stylesheets/common.scss diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index 7c31b3cb1..0fd3317e0 100644 --- a/app/assets/stylesheets/common.scss +++ b/app/assets/stylesheets/common.scss @@ -1,4 +1,6 @@ +@use "sass:map"; @import "parameters"; +@import "browse"; @import "bootstrap"; @import "rails_bootstrap_forms"; @@ -455,13 +457,17 @@ body.small-nav { border-top: 0px !important; } -.leaflet-popup-content-wrapper, -.leaflet-popup-tip, -.leaflet-contextmenu, -.leaflet-contextmenu-item { +.leaflet-popup-content-wrapper, .leaflet-popup-tip, +.leaflet-contextmenu, .leaflet-contextmenu-item, +.leaflet-control-attribution, .leaflet-control-scale-line { @extend .bg-body, .text-body; } +.leaflet-control-attribution, .leaflet-control-scale-line { + @extend .bg-opacity-75; + text-shadow: none !important; +} + .leaflet-contextmenu-item.over { @extend .bg-body-secondary, .border-secondary, .border-opacity-10; } @@ -474,6 +480,21 @@ body.small-nav { } } +@include color-mode(dark) { + .leaflet-tile-container, + .mapkey-table-entry td:first-child > * { + filter: brightness(.8); + } + + .leaflet-control-attribution a { + color: var(--bs-link-color); + } + + .leaflet-control-scale-line { + @extend .border-light, .border-opacity-75; + } +} + /* Rules for attribution text under the main map shown on printouts */ .donate-attr { color: darken($green, 10%) !important; } @@ -702,6 +723,7 @@ tr.turn { &.new-user-main { background-image: image-url("sign-up-illustration.png"); + background-position-x: 50px; } &.confirm-main { @@ -711,17 +733,6 @@ tr.turn { &.new-user-terms { background-image: image-url("terms-illustration.png"); } - - &.new-user-arm { - height: 110px; - width: 130px; - left: 280px; - top: 180px; - background-image: image-url("sign-up-illustration-arm.png"); - position: absolute; - z-index: 100; - pointer-events: none; - } } [dir=rtl] .header-illustration { @@ -989,6 +1000,10 @@ div.secondary-actions { } } +.auth-container { + max-width: 600px; +} + /* Rules for tabs inside secondary background sections */ .bg-body-secondary .nav-tabs { @@ -1010,4 +1025,32 @@ img.trace_image { } } -@import 'browse'; +/* Rules for map sidebar icons */ + +.browse-section { + .node::before, + .way::before, + .relation::before { + display: inline-block; + width: 25px; + margin-left: -25px; + } + + .node, .way, .relation { + margin-left: 25px; + } +} + +@each $class, $item in $map-sidebar-icons { + .browse-section #{$class}::before { + content: image-url('browse/#{map.get($item, "filename")}'); + } + + @if map.get($item, "invert") { + @include color-mode(dark) { + .browse-section #{$class}::before { + filter: invert(.8) hue-rotate(180deg); + } + } + } +}