X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/e3e5b9fbf1f1882c73b564affb1fbf999cf65bee..d2f26a54367fcdd568b83a2cc4c188117fcfe731:/app/assets/stylesheets/common.scss diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index aa2c95a99..dcbf00be8 100644 --- a/app/assets/stylesheets/common.scss +++ b/app/assets/stylesheets/common.scss @@ -23,7 +23,7 @@ small, aside { .small_icon { vertical-align: middle; - margin-right: $lineheight/4; + margin-right: $lineheight * 0.25; } [dir=rtl] { /* no-r2 */ text-align: right; } @@ -102,38 +102,21 @@ header { > * { height: 100%; - padding: $lineheight/2; + padding: $lineheight * 0.5; } h1, nav.primary { float: left; } - a, a:hover { - text-decoration: none; - } - img.logo { - width: 30px; - height: 30px; margin-top: -2px; - vertical-align: middle; } h1 { font-size: 18px; - font-weight: 600; line-height: 1.2; - margin: 0; padding-top: 15px; - - a { - color: #000; - } - - a:hover { - color: #000; - } } .btn { @@ -143,7 +126,7 @@ header { nav.primary { - .btn-outline-primary { + & > .btn-group .btn-outline-primary { @include button-outline-variant($green, $color-hover: $white, $active-color: $white); } @@ -187,35 +170,8 @@ nav.secondary { color: darken($darkgrey, 25%); } - .login-menu { - .btn-outline-secondary { - @include button-outline-variant($darkgrey, $color-hover: $white, $active-color: $white); - } - } - - .user-menu { - .btn-outline-secondary { - @include button-outline-variant($darkgrey, $color-hover: $darkgrey, $active-background: white, $active-border: $darkgrey); - border-color: $grey; - &:hover { - border-color: $grey; - } - } - } - #inboxanchor { - display: inline-block; - height: 25px; - margin: 3px 0 3px 3px; background-color: lighten($grey, 10%); - line-height: 20px; - border-radius: 3; - } - - .dropdown-menu { - .count-number { - font-size: 14px; - } } } @@ -329,12 +285,9 @@ body.small-nav { /* Utility for styling notification numbers */ .count-number { - padding: 2px $lineheight/4; - border-radius: 2px; background: lighten($green, 30%); - margin: 0 2px; - font-size: 11px; - color: #333; + color: $gray-800; + font-weight: $font-weight-normal; } /* Rules for the message shown in place of the map when javascript is disabled */ @@ -500,7 +453,7 @@ body.small-nav { .section { border-bottom: 1px solid $grey; - padding: 10px 20px; + padding: $spacer; } } } @@ -587,29 +540,13 @@ body.small-nav { } .share-ui { - .share-link { - input[type=text], - textarea { - width: 100%; - font-family: monospace; - font-size: small; - line-height: 1.3; - } - } - - .share-image { - label { - margin-right: 10px; - } - } - #mapnik_scale { width: 100px; } } .leaflet-top { - top: $lineheight/2 !important; + top: 10px !important; .leaflet-control { margin-right: 0px !important; margin-top: 0px !important; @@ -628,21 +565,10 @@ body.small-nav { /* Rules for attribution text under the main map shown on printouts */ -#attribution { - display: none; -} - .donate-attr { color: darken($green, 10%) !important; } /* Rules for the sidebar */ -.sidebar_heading { - position: relative; - padding: $lineheight/2 $lineheight; - // background: $offwhite; - // border-bottom: 1px solid $grey; -} - #browse_status { input { display: block; @@ -661,6 +587,9 @@ form { label { font-size: 16px; } + .col-form-label { + font-size: 16px; + } } /* Stop bootstrap 5 from floating legends when they don't need to be */ @@ -705,9 +634,8 @@ header .search_forms, /* Rules for search sidebar */ #sidebar .search_results_entry { - ul li { - cursor: pointer; - &.selected { background: $list-highlight; } + ul li.selected { + background: $list-highlight; } .search_more .loader { @@ -715,11 +643,6 @@ header .search_forms, } } -.search_results_error { - color: #f00; - padding: 10px 20px; -} - /* Rules for routing */ div.direction { @@ -732,14 +655,7 @@ div.direction { div.direction.i#{$i} { background-position: #{($i)*-20}px 0px; } } -td.instruction, td.distance { - padding-top: $lineheight/5; - padding-bottom: $lineheight/5; - border-bottom: 1px solid $grey; -} td.distance { - color: $darkgrey; - text-align: right; font-size: x-small; } tr.turn { @@ -768,14 +684,6 @@ tr.turn:hover { } } - .comments { - color: $darkgrey; - } - - .comments-0 { - opacity: 0.5; - } - .changeset_more .loader { display: none; width: 100%; @@ -843,21 +751,6 @@ tr.turn:hover { } } - .note-comments li, .changeset-comments li { - margin: $lineheight/2 0; - - p { - margin: 10px 6px 0 6px; - line-height: 1.5; - } - } - - .subscribe-buttons input { - font-size: 90%; - line-height: 15px; - min-height: 20px; - } - span.action-button:hover { cursor: pointer; text-decoration: underline; @@ -925,18 +818,6 @@ tr.turn:hover { } #minlat { margin-bottom: -1px; } } - - .export_bound { - margin: $lineheight/4; - } - - dl { - padding-left: $lineheight/2; - dd { - margin-left: 0; - margin-bottom: 10px; - } - } } /* Rules for edit pages */ @@ -1036,7 +917,7 @@ tr.turn:hover { /* Rules for the user map */ .content_map .leaflet-popup-content { - margin: $lineheight/2; + margin: $spacer; min-height: 50px; } @@ -1051,12 +932,6 @@ tr.turn:hover { } } -/* Rules for the user list */ - -#user_list { - width: 100%; -} - /* Rules for the diary entry page */ .diary_entries { @@ -1072,20 +947,6 @@ tr.turn:hover { &:first-child { border-top: 1px solid $grey; } - p { - margin-bottom: $lineheight/2; - } - } -} - -/* Rules for the log in page */ - -#login_auth_buttons { - margin-bottom: 0; - - li { - float: left; - padding: $lineheight/4 $lineheight/2; } } @@ -1108,12 +969,6 @@ tr.turn:hover { } } -/* Rules for the oauth authorization page */ - -.oauth-authorize ul { - list-style: none; -} - /* Rules for messages pages */ .messages { @@ -1121,7 +976,7 @@ tr.turn:hover { background: $offwhite; } - .inbox-row-unread { + .inbox-row-unread td { background: #CBEEA7; } } @@ -1129,11 +984,12 @@ tr.turn:hover { .search_form { background-color: $lightgrey; + #query { + z-index: 0; + } + .describe_location { - top: 6px; - right: 6px; font-size: 10px; - color: $blue; } } @@ -1176,9 +1032,9 @@ nav.secondary-actions { flex-basis: auto; list-style: none; border-left: 1px solid $grey; - padding-left: $lineheight/2; - margin-right: $lineheight/2; - margin-bottom: $lineheight/8; + padding-left: $lineheight * 0.5; + margin-right: $lineheight * 0.5; + margin-bottom: $lineheight * 0.125; } } } @@ -1195,8 +1051,6 @@ div.secondary-actions { code { background: $lightgrey; padding: 2px 3px; - direction: inherit; /* fix for Bootstrap < 5.2 */ - unicode-bidi: unset; /* fix for Bootstrap < 5.2 */ } pre {