X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/da454f0593c6c0ab96d6a244d1f84e885c46ef37..b3759c0d5811579a2a409b9c8c218d605cb62aa4:/app/assets/stylesheets/common.scss?ds=sidebyside diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index 61c825fca..17d20c812 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"; @@ -10,26 +12,12 @@ body { font-size: $typeheight; } -p > img { - width: auto; - max-width: 100%; -} - -small, aside { - font-size: 12px; -} - time[title] { text-decoration: underline dotted; } #container { position: relative; } -.small_icon { - vertical-align: middle; - margin-right: $lineheight * 0.25; -} - /* Rules for icons */ .icon { @@ -75,7 +63,10 @@ time[title] { .table-secondary { --bs-table-bg: rgb(var(--bs-secondary-rgb), .25); } - .table-primary, .table-secondary { + .table-success { + --bs-table-bg: rgb(var(--bs-success-rgb), .25); + } + .table-primary, .table-secondary, .table-success { --bs-table-color: initial; border-color: inherit; } @@ -171,10 +162,6 @@ nav.secondary { .nav-link { padding: 0.2rem; } - - #inboxanchor { - background-color: lighten($grey, 10%); - } } nav.primary, nav.secondary { @@ -470,8 +457,30 @@ body.small-nav { border-top: 0px !important; } +.leaflet-popup-content-wrapper, +.leaflet-popup-tip, +.leaflet-contextmenu, +.leaflet-contextmenu-item { + @extend .bg-body, .text-body; +} + +.leaflet-contextmenu-item.over { + @extend .bg-body-secondary, .border-secondary, .border-opacity-10; +} + .leaflet-popup-content-wrapper { - border-radius: 4px !important; + @extend .rounded-1; + + a { + color: var(--bs-link-color) !important; + } +} + +@include color-mode(dark) { + .leaflet-tile-container, + .mapkey-table-entry td:first-child > * { + filter: brightness(.8); + } } /* Rules for attribution text under the main map shown on printouts */ @@ -537,10 +546,6 @@ header .search_forms, /* Rules for search sidebar */ #sidebar .search_results_entry { - ul li.selected { - background: $list-highlight; - } - .search_more .loader { display: none; } @@ -581,8 +586,9 @@ tr.turn { #sidebar .changesets { li { - &.selected { background: $list-highlight; } - /* color is derived from changeset bbox fillColor in history.js */ + &.selected { + @extend :hover; + } a.stretched-link > span, a:not(.stretched-link), [title] { position: relative; @@ -631,18 +637,6 @@ tr.turn { .query-results { display: none; - - ul { - li { - &.query-result { - cursor: pointer; - } - - &.selected { - background: $list-highlight; - } - } - } } } @@ -770,7 +764,6 @@ tr.turn { /* Rules for user popups on maps */ .user_popup { - min-width: 200px; p { padding: 0 0 5px 0; margin: 0 0 0 60px; @@ -812,14 +805,6 @@ tr.turn { } } -/* Rules for messages pages */ - -.messages { - .inbox-row-unread td { - background: #CBEEA7; - } -} - /* Rules for user images */ img.user_image { @@ -945,11 +930,6 @@ div.secondary-actions { .sprite.rules { /*rtl:ignore*/ background-position: -350px 0; } - - .icon.note { - background-color: #333; - border-radius: 4px; - } } .site-about #content { @@ -1039,4 +1019,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); + } + } + } +}