X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/fe7996586927f46f048625fe38ccebc43415d5dd..5da7215873152fd52a93c3d91bc38c5dbb32ddce:/app/assets/stylesheets/common.scss diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index d63317812..75ed514ee 100644 --- a/app/assets/stylesheets/common.scss +++ b/app/assets/stylesheets/common.scss @@ -55,24 +55,12 @@ small, aside { .icon.clipboard { /* no-r2 */ background-position: -160px 0; } .icon.link { /* no-r2 */ background-position: -180px 0; } .icon.close { /* no-r2 */ background-position: -200px 0; } -.close-wrap:hover .icon.close, .icon.close:hover { /* no-r2 */ background-position: -200px -20px; } .icon.check { /* no-r2 */ background-position: -220px 0; } .icon.note { /* no-r2 */ background-position: -240px 0; } .icon.note.grey { /* no-r2 */ background-position: -240px -20px; } .icon.query { /* no-r2 */ background-position: -260px 0; } -/* Rules for links */ - -a { - color: #24d; - text-decoration: none; - outline: 0; - &:hover { - text-decoration: underline; - } -} - /* Utility for de-emphasizing content */ .text-muted a { @@ -157,7 +145,7 @@ header { nav.primary { .btn-outline-primary { - @include button-outline-variant($green, $white); + @include button-outline-variant($green, $color-hover: $white, $active-color: $white); } .disabled { @@ -202,27 +190,17 @@ nav.secondary { .login-menu { .btn-outline-secondary { - @include button-outline-variant($darkgrey); + @include button-outline-variant($darkgrey, $color-hover: $white, $active-color: $white); } } .user-menu { .btn-outline-secondary { - @include button-outline-variant($darkgrey, $darkgrey, white, $darkgrey); + @include button-outline-variant($darkgrey, $color-hover: $darkgrey, $active-background: white, $active-border: $darkgrey); border-color: $grey; &:hover { border-color: $grey; } - &:focus { - background-color: white; - box-shadow: none; - } - } - &.show .btn-outline-secondary { - background-color: white; - &:focus { - box-shadow: none; - } } } @@ -295,7 +273,8 @@ body.compact-nav { margin-bottom: 10px; outline: none; - &:hover { + &:hover, + &:focus { background-color: black; } @@ -369,30 +348,6 @@ body.compact-nav { clear: both; width: 100%; } - - h2 { - font-size: 1.5rem; - } - - h3, h4 { - font-size: 1.25rem; - } - - .close-wrap { - cursor: pointer; - position: absolute; - top: 0; - right: 0; - width: 60px; - height: 60px; - - .icon.close { - pointer-events: none; - position: absolute; - right: 20px; - top: 20px; - } - } } .overlay-sidebar #sidebar { @@ -644,11 +599,6 @@ body.compact-nav { padding: $lineheight/2 $lineheight; // background: $offwhite; // border-bottom: 1px solid $grey; - > .close { - float: right; - margin-top: 2px; - cursor: pointer; - } } #browse_status { @@ -686,6 +636,28 @@ form { } } +/* Stop bootstrap 5 from floating legends when they don't need to be */ +legend { + float: none; +} + +/* Override the text colour for primary and secondary buttons, to match our + bootstrap 4 colours. Note this has accessibility issues, which is why + bootstrap 5 calculates black as the appropriate colour, and we should + reconsider our colours at some point with that in mind. */ + +.btn-primary { + @include button-variant($primary, $primary, $color: $white, $hover-color: $white, $active-color: $white, $disabled-color: $white); +} + +.btn-secondary { + @include button-variant($secondary, $secondary, $color: $white, $hover-color: $white, $active-color: $white, $disabled-color: $white); +} + +.btn-outline-secondary { + @include button-outline-variant($secondary, $color-hover: $white, $active-color: $white); +} + /* Rules for the search and direction forms */ header .search_forms, @@ -770,10 +742,13 @@ tr.turn:hover { #sidebar .changesets { li { - cursor: pointer; - &.selected { background: $list-highlight; } /* color is derived from changeset bbox fillColor in history.js */ + + a:not(.stretched-link), [title] { + position: relative; + z-index: 1; + } } .comments { @@ -1307,10 +1282,6 @@ tr.turn:hover { vertical-align: middle; } } - - a.reverse_directions { - cursor: pointer; - } } /* Rules for user images */ @@ -1436,13 +1407,6 @@ dl.dl-inline { } } -/* Customise the background colour of striped tables */ - -.table-striped > tbody > tr:nth-child(2n+1) > td, -.table-striped > tbody > tr:nth-child(2n+1) > th { - background-color: $offwhite; -} - /* Rules for OpenID logo */ .openid_logo { @@ -1455,13 +1419,11 @@ dl.dl-inline { .richtext, .prose { code { - font-size: 13px; background: $lightgrey; padding: 2px 3px; } pre { - font-size: 13px; background: $lightgrey; padding: 2px 3px; white-space: pre-wrap; @@ -1504,19 +1466,10 @@ dl.dl-inline { /* Rules for the "Welcome" page */ .site-welcome, .site-fixthemap { - .center { - text-align: center; - .sprite { - float: none; - margin: auto; - } - } - .sprite { background-image: image-url("welcome-sprite.png"); background-size: 500px 250px; display: block; - float: left; } .icon-list { @@ -1566,15 +1519,6 @@ dl.dl-inline { /* no-r2 */ background-position: -350px 0; } - .start-mapping { - margin: auto; - cursor: pointer; - border: none; - padding: 20px 40px; - font-size: 30px; - text-decoration: none; - } - .icon.note { background-color: #333; border-radius: 4px;