X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/f32773a9f9340edd08bf63a6b1f859f23da9c85e..a9f751ec45788a6fb0cdd2e9fcfe1b7c04346866:/app/assets/stylesheets/common.scss diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index 98b58c998..7c4053c4f 100644 --- a/app/assets/stylesheets/common.scss +++ b/app/assets/stylesheets/common.scss @@ -1,5 +1,5 @@ @import "parameters"; -@import "bootstrap-custom"; +@import "bootstrap"; /* Styles common to large and small screens */ @@ -30,20 +30,11 @@ small, aside { #container { position: relative; } -.column-1 { - width: 50%; - margin: 0 0 $lineheight/2 0; -} - .small_icon { vertical-align: middle; margin-right: $lineheight/4; } -.red { color: $red; } - -.piwik { border: 0; } - [dir=rtl] { /* no-r2 */ text-align: right; } [dir=ltr] { /* no-r2 */ text-align: left; } @@ -85,32 +76,12 @@ small, aside { a { color: #24d; text-decoration: none; - -webkit-appearance: none; outline: 0; &:hover { text-decoration: underline; } } -/* General styles for tables */ - -table { - width: 100%; - margin-bottom: $lineheight; - th, td { - text-align: left; - padding: $lineheight/4; - line-height: $lineheight; - } - th { - font-weight: 600; - vertical-align: top; - } - td { - vertical-align: middle; - } -} - /* Utility for de-emphasizing content */ .deemphasize { @@ -120,6 +91,10 @@ table { } } +.text-muted a { + color: $blue; +} + /* Rules for the header */ #menu-icon { @@ -291,7 +266,7 @@ nav.primary, nav.secondary { display: none; } -body.compact { +body.compact-nav { #compact-secondary-nav { display: inline-block; } @@ -873,9 +848,6 @@ header .search_forms, margin-left: auto; margin-right: auto; } - td { - padding: 0 $lineheight/4 $lineheight/4 $lineheight/4; - } } /* Rules for search sidebar */ @@ -1029,6 +1001,7 @@ tr.turn:hover { table-layout: fixed; border-collapse: separate; border-spacing: 0; + width: 100%; th, td { border-bottom: 1px solid $grey; @@ -1217,16 +1190,6 @@ tr.turn:hover { background: $lightgrey; } -.content-body { - h1, h2, h3, p, ul, ol { - margin-bottom: $lineheight; - } - - h1, h2, h3 { - margin-top: $lineheight/2; - } -} - .content-inner { position: relative; max-width: 900px; @@ -1292,23 +1255,14 @@ tr.turn:hover { /* Rules for small maps in content areas */ .content_map { - position: relative; - width: 45%; - height: 400px; + height: 200px; border: 1px solid $grey; margin-bottom: $lineheight; - float: right; } -/* Rules for the trace list shown by the traces tab etc */ - -#trace_list { - border-width: 0px; - text-align: right; - - .trace_summary { - font-size: 12px; - color: gray; +@include media-breakpoint-up(md) { + .content_map { + height: 400px; } } @@ -1339,21 +1293,14 @@ tr.turn:hover { /* Rules for the user profile page */ #userinformation { - min-height: 100px; .userinformation-inner { float: left; } - h2 { - margin-top: 0; - } .user-description { width: 100%; clear: both; } - .deemphasize { - margin: 0; - } } .admin-user-info small { @@ -1362,16 +1309,6 @@ tr.turn:hover { margin-right: $lineheight; } -.activity-block { - clear: left; - border-bottom: 1px solid $grey; - padding-bottom: $lineheight; - float: left; - h3 { - margin-bottom: $lineheight/2; - } -} - .contact-activity { margin-top: $lineheight; width: 100%; @@ -1450,7 +1387,7 @@ tr.turn:hover { margin-top: $lineheight/2; } - &.deemphasize { + &.deleted { background-color: #fee; } @@ -1505,7 +1442,7 @@ tr.turn:hover { padding-top: $lineheight; border-top: 1px solid $grey; } - &.deemphasize { + &.deleted { background-color: #fee; } p { @@ -1569,13 +1506,6 @@ tr.turn:hover { /* Rules for the account settings page */ -#accountForm .user_map { - position: relative; - width: 500px; - height: 400px; - border: 1px solid $grey; -} - #accountForm .user_image { margin-bottom: 0; } @@ -1600,11 +1530,6 @@ tr.turn:hover { display: inline !important; } -.content_map.settings_map { - width: 50%; - float: none; -} - /* Rules for the oauth settings page */ .oauth_clients .buttons .oauth-edit { @@ -1624,43 +1549,21 @@ tr.turn:hover { /* Rules for messages pages */ .messages { - width: 100%; - border: 1px solid $grey; - input[type="submit"] { margin: auto; } - tbody tr { - border-top: 1px solid $grey; - } .inbox-row { background: $offwhite; } .inbox-row-unread { - background:#CBEEA7; + background: #CBEEA7; } .right { float: right; } - - tr td, - tr th { - padding: $lineheight/4; - } - p:last-child, - h2:last-child, - h3:last-child, - ol:last-child, - ul:last-child { - margin-bottom:0; - } - tr td { - height: 30px; - border-right: 1px solid $lightgrey; - } } .inbox-row .inbox-mark-read { @@ -1695,17 +1598,6 @@ tr.turn:hover { display: none; } -.messages-show .message-buttons { - margin-top: $lineheight; - margin-bottom: $lineheight * 1.5; - padding-top: $lineheight; - border-top: 1px solid $lightgrey; -} - -.messages-show .buttons .mark-unread-button { - border-radius: 0; -} - /* Rules for "flash" notice boxes shown at the top of the content area */ .flash { @@ -2048,16 +1940,11 @@ a.button { } } -/* Rules for doing distinct colour of alternate table rows */ - -.table0, -.item0 { - background: $offwhite; -} +/* Customise the background colour of striped tables */ -.table1, -.item1 { - background: #fff; +.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 */ @@ -2197,15 +2084,7 @@ input.richtext_title[type="text"] { .note_list { tr.creator { - background-color: $lightgrey; - } - - td { - padding: 3px; - } - - p { - margin-bottom: 0px; + background-color: $offwhite; } } @@ -2327,12 +2206,18 @@ input.richtext_title[type="text"] { display: block; color: white; font-weight: 300; - font-size: 34px; + font-size: 28px; span { color: $vibrant-green; } } + @include media-breakpoint-up(sm) { + h1 { + font-size: 34px; + } + } + .user-image { position: absolute; top: 0px; @@ -2408,14 +2293,3 @@ input.richtext_title[type="text"] { display: none; } } - -.read-reports { - background: $lightgrey; - opacity: 0.7; -} - -.issues-list { - td:nth-child(2) { - white-space: nowrap; - } -}