X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/ad6bbd511df682a572c140a3212a13d6badf9668..3d0f9536c403711554621a8eba3d86321fcbd7cc:/app/assets/stylesheets/common.css.scss diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss index 35a5ced5f..a62470651 100644 --- a/app/assets/stylesheets/common.css.scss +++ b/app/assets/stylesheets/common.css.scss @@ -97,9 +97,9 @@ abbr, acronym { /* Default rules for the body of every page */ * { - -moz-box-sizing: border-box; -webkit-box-sizing: border-box; - box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; } body { @@ -130,10 +130,6 @@ h2, h3 { font-size: 16px; } -p { - margin-bottom: $lineheight; -} - p > img { width: auto; max-width: 100%; @@ -143,15 +139,6 @@ small, aside { font-size: 12px; } -h1:first-child, -h2:first-child, -h3:first-child, -h4:first-child, -h5:first-child, -h6:first-child { - margin-top: 0; -} - .column-1 { width: 50%; margin: 0 0 $lineheight/2 0; @@ -172,10 +159,6 @@ h6:first-child { background:transparent image-url("sprite.png") no-repeat 0 0; text-indent:-9999px; overflow:hidden; - } - -.icon-pre-text { - margin-right: 5px; } .icon.search { background-position: 0 0; } @@ -385,28 +368,21 @@ nav.primary { color: #ccc; cursor: default; - &:hover { - text-decoration: none; - } - .caret { border-top-color: #ccc; } } -} -.site-index #view_tab, -.changeset-list #history_tab, -.site-export #export_tab, -.site-edit #edit_tab { - background-color: $green; + > ul li.current { + background-color: $green; - .tab { - color: #fff; - } + .tab { + color: #fff; + } - .caret { - border-top-color: #fff; + .caret { + border-top-color: #fff; + } } } @@ -423,6 +399,10 @@ nav.secondary { padding: 5px 5px; } + > ul li.current a { + color: darken($darkgrey, 25%); + } + .user-menu { $border: 1px solid $grey; @@ -585,7 +565,6 @@ nav.secondary { width: 40px; background-color: #333; background-color: rgba(0,0,0,.6); - -bottom: 1px solid #333; border-radius: 4px 0 0 4px; margin-bottom: 10px; outline: none; @@ -659,7 +638,7 @@ nav.secondary { .layers-ui, .share-ui { - ul, li:last-child, p:last-child { + li:last-child { margin-bottom: 0; } } @@ -765,25 +744,6 @@ nav.secondary { -webkit-border-radius: 4px !important; } -/* Rules for edit menu */ - -.menu { - display: none; - z-index: 10000; - position: absolute; - background-color: #ffffff; - border: 1px solid $lightgrey; - border-top: 0px; - ul { - margin: 0px; - } - li { - padding: 2px $lineheight/4; - border-top: 1px solid #eee; - white-space: nowrap; - } -} - /* Rules for attribution text under the main map shown on printouts */ #attribution { @@ -822,10 +782,6 @@ nav.secondary { right: $lineheight; } - p { - margin: 0; - } - .footer { position: absolute; bottom: 0; @@ -846,9 +802,6 @@ nav.secondary { padding: $lineheight/2 $lineheight; background: $offwhite; border-bottom: 1px solid #ccc; - h4 { - margin: 0; - } } .sidebar_close { @@ -962,11 +915,7 @@ nav.secondary { /* Rules for the sidebar and main content area */ -.site-index, -.site-export, -.site-edit, -.changeset-list, -.browse { +.map-layout { #content { position: absolute; top: $headerHeight; @@ -988,13 +937,24 @@ nav.secondary { } .content-heading { - position: relative; - padding: $lineheight; background: $lightgrey; border-bottom: $keyline; } .content-body { + h1, h2, h3, p { + margin-bottom: $lineheight; + } + + h1, h2, h3 { + margin-top: $lineheight/2; + } +} + +.content-inner { + position: relative; + max-width: 900px; + margin: auto; padding: $lineheight; } @@ -1002,18 +962,18 @@ nav.secondary { .user-new, .user-create, -.user-terms, -.user-confirm { - .content-heading { - height: 200px; +.user-terms { + .content-body .content-inner { + padding: 0; } } .user-new, .user-create, -.user-terms { - .content-body { - padding: 0; +.user-terms, +.user-confirm { + .content-heading .content-inner { + height: 200px; } } @@ -1044,16 +1004,14 @@ nav.secondary { left: 260px; top: 160px; background-image: image-url("sign-up-illustration-arm.png"); + z-index: 100; } } @media only screen and (max-width:900px) { - .header-illustration.new-user-arm { display: none;} -.wrapper { - margin-left: $sidebarWidth; - text-align: left; -} - + .header-illustration.new-user-arm { + display: none; + } } #content.maximised { @@ -1119,10 +1077,6 @@ nav.secondary { padding: $lineheight; border-bottom: $keyline; } - - p { - padding: 0; - } } /* Rules for the data browser */ @@ -1131,17 +1085,12 @@ body.browse #sidebar_content { .browse-section { padding: 20px; border-bottom: 1px solid #CCC; - - ul { - margin: 0; - } } .browse-field { margin-bottom: 10px; h4 { - margin: 0; padding: 5px 0 5px 10px; font-size: 12px; border: 1px solid #CCC; @@ -1150,7 +1099,6 @@ body.browse #sidebar_content { } p { - margin: 0; padding: 7px 10px; font-size: 12px; background-color: #FFF; @@ -1332,46 +1280,40 @@ body.browse #sidebar_content { /* Rules for the diary list page */ -.diary_entry-list img.user_thumbnail { - float: left; -} - .diary_post { - max-width: 740px; position: relative; margin-top: $lineheight/2; padding-top: $lineheight; border-top: 1px solid #ccc; - &:first-child { - margin-top: 0; - border-top: 0; - padding-top: 0; + .post_heading { + margin-bottom: $lineheight; + + h2 { + margin-top: 0; + margin-bottom: $lineheight/2; + font-size: 24px; + } } - h1, h2 { - font-size: 21px; - line-height: 1em; + + img.user_thumbnail { + float: left; } + small.deemphasize { float: left; display: block; } - ul.secondary-actions { display: inline-block;} + + ul.secondary-actions { + display: inline-block; + } } .content-heading .hide_unless_logged_in { // hacky selector, better to just add a new class to this div display: inline; } -#content .post_heading { - margin-bottom: $lineheight; - h2 { - margin-top: 0; - margin-bottom: $lineheight/2; - font-size: 24px; - } -} - /* Rules for the diary entry page */ .diary_entry { @@ -1878,7 +1820,7 @@ a.button { *[value="Hide"] + input:nth-child(2):not(:last-child), *[value="Hide"] + .button:nth-child(2):not(:last-child) { border-radius:2px 0 0 2px; - border-right-width: 1px solid white; + border-right-width: 1px; } } @@ -2406,12 +2348,9 @@ a.button { background-color: rgba(0, 0, 0, 0.5); } - #content-body { - display: block; + .content-inner { position: relative; - margin: auto; color: #333; - width: 50%; min-width: 320px; max-width: 640px; @@ -2497,3 +2436,5 @@ a.button { &.infringement { background-position: 0px -160px; } } } + +@import 'browse';