X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/fa7ba58d5e22040f5e0d6c171bcceb59b58145ad..a3795cddbb1e4ec7a697a78645d7df880bd690b3:/app/assets/stylesheets/common.scss diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index 3f2a151ab..5635e3f9d 100644 --- a/app/assets/stylesheets/common.scss +++ b/app/assets/stylesheets/common.scss @@ -3,99 +3,10 @@ /* Styles common to large and small screens */ -/* Minimal CSS reset */ - -html, body, ul, ol, li, form, fieldset, legend, input { - margin: 0; - padding: 0; - border: 0; -} - -fieldset,img { border: 0; } - -legend { color: #000; } - -sup { - vertical-align: super; - font-size: smaller; -} - -sub { - vertical-align: sub; - font-size: smaller; -} - -table { - border-collapse: collapse; - border-spacing: 0; -} - -li { list-style: none; } - -input, -select, -textarea, -body { font: #{$typeheight}/#{$lineheight} "Helvetica Neue",Arial,sans-serif; } - -abbr, acronym { - text-decoration: underline dotted; - cursor: help; -} - -strong { - font-weight: bold; -} - -/* Micro Clearfix | Details: http://nicolasgallagher.com/micro-clearfix-hack/ */ - -.clearfix:before, -.clearfix:after { - content: " "; - display: table; -} - -.clearfix:after { - clear: both; -} - -/* Basic grid */ - -.col0 { float:left; width:04.1666%; } -.col1 { float:left; width:08.3333%; } -.col2 { float:left; width:16.6666%; } -.col3 { float:left; width:25.0000%; } -.col4 { float:left; width:33.3333%; } -.col5 { float:left; width:41.6666%; } -.col6 { float:left; width:50.0000%; } -.col7 { float:left; width:58.3333%; } -.col8 { float:left; width:66.6666%; } -.col9 { float:left; width:75.0000%; } -.col10 { float:left; width:83.3333%; } -.col11 { float:left; width:91.6666%; } -.col12 { width:100%; } - -.margin0 { margin-left:04.1666%; } -.margin1 { margin-left:08.3333%; } -.margin2 { margin-left:16.6666%; } -.margin3 { margin-left:25.0000%; } -.margin4 { margin-left:33.3333%; } -.margin5 { margin-left:41.6666%; } -.margin6 { margin-left:50.0000%; } -.margin7 { margin-left:58.3333%; } -.margin8 { margin-left:66.6666%; } -.margin9 { margin-left:75.0000%; } -.margin10 { margin-left:83.3333%; } -.margin11 { margin-left:91.6666%; } -.margin12 { margin-left:100.0000%; } - .fillL { background-color: white; } /* Default rules for the body of every page */ -* { - box-sizing: border-box; -} - body { font-family: 'Helvetica Neue',Arial,sans-serif; font-size: $typeheight; @@ -181,15 +92,6 @@ a { } } -/* Rules for horizontal lines */ - -hr { - border: none; - background-color: $grey; - color: $grey; - height: 1px; -} - /* General styles for tables */ table { @@ -281,6 +183,7 @@ header { nav.primary { > ul { + padding: 0; $border: 1px solid $green; border: $border; @@ -347,6 +250,9 @@ nav.secondary { > ul { vertical-align: middle; + margin: 0; + padding: 0; + a, .dropdown-toggle { display: inline-block; text-decoration: none; @@ -366,6 +272,7 @@ nav.secondary { border: $border; border-radius: $border-radius; margin-left: 10px; + padding: 0; > li { border-right: $border; @@ -541,6 +448,7 @@ body.compact { #sidebar { float: left; width: $sidebarWidth; + background: #fff; #sidebar_loader { display: none; @@ -1032,9 +940,7 @@ header .search_forms, #sidebar .search_results_entry { ul li { - border-bottom: $keyline; cursor: pointer; - &:first-child { border-top: $keyline; } &.selected { background: $list-highlight; } } @@ -1107,21 +1013,12 @@ tr.turn:hover { #sidebar .changesets { li { - padding: 15px 20px; - border-bottom: 1px solid $grey; cursor: pointer; &.selected { background: $list-highlight; } /* color is derived from changeset bbox fillColor in history.js */ } - h4 { - margin: 0; - a { - color: #000; - } - } - .comments { float: right; color: $darkgrey; @@ -1161,10 +1058,6 @@ tr.turn:hover { border-radius: 3px; } - .paginate ul { - padding-left: 20px; - } - .browse-field { margin-bottom: 10px; @@ -1173,7 +1066,7 @@ tr.turn:hover { font-size: 12px; border: 1px solid $grey; border-radius: 4px 4px 0 0; - background-color: #F6F6F6; + background-color: $offwhite; } p { @@ -1187,10 +1080,9 @@ tr.turn:hover { } .browse-tag-list { - background-color: #F6F6F6; + background-color: $offwhite; border: 1px solid $grey; border-radius: 3px; - font-size: 12px; table-layout: fixed; border-collapse: separate; @@ -1212,7 +1104,7 @@ tr.turn:hover { .browse-tag-k { font-weight: 500; - background-color: #F6F6F6; + background-color: $offwhite; } .browse-tag-v { @@ -1222,8 +1114,8 @@ tr.turn:hover { .colour-preview-box { float: right; - width: 12px; - height: 12px; + width: 14px; + height: 14px; margin: 4px 0px; border: 1px solid rgba(0, 0, 0, .1); // add color via inline css on element: background-color: ; @@ -1276,17 +1168,14 @@ tr.turn:hover { .query-results { display: none; + padding-bottom: $lineheight/2; h3 { - padding: $lineheight $lineheight $lineheight/2; - margin: 0; + padding: 0 $lineheight; } ul { li { - padding: 15px 20px; - border-bottom: 1px solid $grey; - &.query-result { cursor: pointer; } @@ -1403,19 +1292,6 @@ tr.turn:hover { /* Overrides for pages that use new layout conventions */ -.users-new, -.users-create, -.users-terms { - .content-body .content-inner { - padding: 0; - - .message { - margin-top: 80px; - padding: 20px; - } - } -} - .users-new, .users-create, .users-terms, @@ -1505,7 +1381,7 @@ tr.turn:hover { /* Rules for the edit trace form */ .edit_trace { - .form-row p { + .standard-form-row p { margin-bottom: 0px; } @@ -1562,10 +1438,6 @@ tr.turn:hover { margin-bottom: 0; } -#friends-container .contact-activity ul { - margin-left: 70px; -} - .users-show { // Silly exception; remove when user page is redesigned. .content-inner { @@ -1963,15 +1835,6 @@ tr.turn:hover { margin-bottom: 0px; padding: $lineheight/4; } - - ul { - padding-left: $lineheight; - - li { - font-size: 12px; - list-style: disc; - } - } } /* Rules for forms */ @@ -2003,11 +1866,11 @@ tr.turn:hover { padding-top: $lineheight; border-top: 1px solid $lightgrey; } - .horizontal-list .form-row { + .horizontal-list .standard-form-row { float: left; padding-right: 10px; } - .form-row { + .standard-form-row { margin-bottom: $lineheight/2; } .form-list { @@ -2015,7 +1878,8 @@ tr.turn:hover { } .form-list li { margin-bottom: 5px; - } + list-style-type: none; + } input[type="checkbox"], input[type="radio"] { float: left; @@ -2093,19 +1957,13 @@ abbr.geo { border-bottom: none; } -/* Rules for RSS buttons */ - -.rsssmall { - position: relative; - top: 3px; -} - /* General styles for action lists / subnavs / pager navs */ ul.secondary-actions { font-style: normal; margin-bottom: 0; margin-left: 0; + padding: 0; &.pager { display: inline-block; margin-right: 60px; @@ -2300,20 +2158,6 @@ a.button { margin: 0; color: $darkgrey; } - - ul, ol { - padding-left: $lineheight; - margin-bottom: $lineheight; - margin-left: $lineheight; - } - - ul > li { - list-style: disc; - } - - ol > li { - list-style: decimal; - } } .diary_post .richtext { @@ -2626,11 +2470,6 @@ input.richtext_title[type="text"] { text-decoration: none; } - .note-box { - margin-top: 20px; - background-color: $offwhite; - } - .icon.note { background-color: #333; border-radius: 4px; @@ -2644,53 +2483,12 @@ input.richtext_title[type="text"] { background-size: cover; background-attachment: fixed; - .caption { - max-width: 200px; - font: 13px/20px Helvetica, Arial, sans-serif; - position: fixed; - text-align: right; - right: 20px; - bottom: 60px; - text-shadow: #000 0px 1px 5px; - color: $lightgrey; - opacity: 0.8; - display: none; - } - - .caption a { - color: white; - white-space: nowrap; - text-decoration: none; - } - - a.next { - display: block; - position: fixed; - right: 10px; - bottom: 10px; - width: 40px; - height: 40px; - border-radius: 5px; - text-indent: -9999px; - overflow: hidden; - background: image-url('about/sprite.png') -120px 0px no-repeat; - background-color: #000; - background-color: rgba(0, 0, 0, 0.5); - } .content-inner { position: relative; color: #333; min-width: 320px; max-width: 640px; - - .section { - margin-bottom: 30px; - } - - .section:last-child { - margin-bottom: 0; - } } .text { @@ -2750,10 +2548,6 @@ input.richtext_title[type="text"] { } } - h2 { - margin-bottom: 10px; - } - .icon { width: 30px; height: 30px; @@ -2801,47 +2595,8 @@ input.richtext_title[type="text"] { opacity: 0.7; } -.report-related-block { - display:inline-block; -} - -.report-block { - width:475px; - float:left; - margin-right:100px; -} - -.related-reports { - width: 280px; - float: right; - - ul { - padding-left: $lineheight; - margin-bottom: 0; - - li { - list-style: disc; - } - } -} - -.issue-comments { - width:475px; -} - .issues-list { td:nth-child(2) { white-space: nowrap; } } - -.report-disclaimer { - ul { - padding-left: $lineheight; - margin-bottom: 0; - - li { - list-style: disc; - } - } -}