X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/4f68d70125c881d2f2fd9ab771576b929510b483..7154ebbb540fc8c93da45e58b6885b642737d605:/app/assets/stylesheets/common.scss diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index 6ec251a17..ca9a820f9 100644 --- a/app/assets/stylesheets/common.scss +++ b/app/assets/stylesheets/common.scss @@ -15,10 +15,6 @@ p > img { max-width: 100%; } -small, aside { - font-size: 12px; -} - time[title] { text-decoration: underline dotted; } @@ -66,6 +62,24 @@ time[title] { color: $blue; } +/* Bootstrap contextual table classes overrides in dark mode */ + +@include color-mode(dark) { + .table-primary { + --bs-table-bg: rgb(var(--bs-primary-rgb), .25); + } + .table-secondary { + --bs-table-bg: rgb(var(--bs-secondary-rgb), .25); + } + .table-success { + --bs-table-bg: rgb(var(--bs-success-rgb), .25); + } + .table-primary, .table-secondary, .table-success { + --bs-table-color: initial; + border-color: inherit; + } +} + /* Rules for the header */ #menu-icon { @@ -90,7 +104,6 @@ time[title] { header { height: $headerHeight; position: relative; - z-index: 1001; font-size: 14px; h1, nav, nav > ul, nav > ul > li { @@ -246,7 +259,7 @@ body.small-nav { /* Utility for styling notification numbers */ .count-number { - background: lighten($green, 30%); + background: transparentize(lighten($green, 25%), .25); color: $gray-800; font-weight: $font-weight-normal; } @@ -329,7 +342,6 @@ body.small-nav { .overlay-sidebar #sidebar { position: absolute; - z-index: 1000; height: auto; overflow: hidden; @@ -383,11 +395,6 @@ body.small-nav { width: 250px; height: 100%; overflow: auto; - - .section { - border-bottom: 1px solid $grey; - padding: $spacer; - } } } @@ -401,7 +408,6 @@ body.small-nav { } #map-ui { - z-index: 9999; width: 100%; height: 50%; overflow-y: scroll; @@ -463,8 +469,17 @@ body.small-nav { border-top: 0px !important; } +.leaflet-popup-content-wrapper, +.leaflet-popup-tip { + @extend .bg-body, .text-body; +} + .leaflet-popup-content-wrapper { - border-radius: 4px !important; + @extend .rounded-1; + + a { + color: var(--bs-link-color) !important; + } } /* Rules for attribution text under the main map shown on printouts */ @@ -521,13 +536,15 @@ header .search_forms, display: none; } +.search_form { + .describe_location { + font-size: 10px; + } +} + /* Rules for search sidebar */ #sidebar .search_results_entry { - ul li.selected { - background: $list-highlight; - } - .search_more .loader { display: none; } @@ -557,9 +574,6 @@ td.distance { tr.turn { cursor: pointer; } -tr.turn:hover { - background: $list-highlight; -} .routing_marker { width: 15px; cursor: move; } @@ -571,8 +585,9 @@ tr.turn:hover { #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; @@ -606,6 +621,8 @@ tr.turn:hover { .browse-tag-list { table-layout: fixed; white-space: pre-wrap; + word-wrap: break-word; + word-break: break-word; tr:last-child th, tr:last-child td { border-bottom: 0; @@ -625,10 +642,6 @@ tr.turn:hover { &.query-result { cursor: pointer; } - - &.selected { - background: $list-highlight; - } } } } @@ -653,16 +666,9 @@ tr.turn:hover { /* Rules for export sidebar */ .export_form { - .export_area_inputs, - .export_button { - text-align: center; - } - .export_area_inputs { - margin-bottom: $spacer; input[type="text"] { width: 100px; - text-align: center; } } @@ -765,7 +771,6 @@ tr.turn:hover { /* Rules for user popups on maps */ .user_popup { - min-width: 200px; p { padding: 0 0 5px 0; margin: 0 0 0 60px; @@ -807,28 +812,6 @@ tr.turn:hover { } } -/* Rules for messages pages */ - -.messages { - .inbox-row { - background: $offwhite; - } - - .inbox-row-unread td { - background: #CBEEA7; - } -} - -.search_form { - #query { - z-index: 0; - } - - .describe_location { - font-size: 10px; - } -} - /* Rules for user images */ img.user_image { @@ -877,8 +860,7 @@ div.secondary-actions { /* Rules for rich text */ -.richtext, -.prose { +.richtext { code { background: var(--bs-secondary-bg); padding: 2px 3px;