X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/577b5d5bb8d628c3c5444b7d7e47dceb7acecb4e..ee530d8111c92999e1a495b5a23aea9319c1309c:/app/assets/stylesheets/common.css.scss diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss index 8abda3810..96856228c 100644 --- a/app/assets/stylesheets/common.css.scss +++ b/app/assets/stylesheets/common.css.scss @@ -10,6 +10,7 @@ body { background-color: #fff; margin: 0px; padding: 0px; + text-align: left; } body.slim { @@ -48,10 +49,12 @@ h2 { #left { position: absolute; - top: 0px; + top: 30px; + bottom: 0; width: 185px; font-size: 11px; line-height: 12px; + border-right: 1px solid #ccc; } /* Rules for the OpenStreetMap logo in the top left corner */ @@ -62,7 +65,7 @@ h2 { min-width: 170px; padding: 5px; text-align: center; - margin: 25px auto 5px auto; + margin: auto; } #logo img { @@ -151,6 +154,7 @@ h2 { /* Rules for the menu displayed in the left sidebar */ .left_menu { + left: 0px; margin: 0; padding: 5px 10px; line-height: 15px; @@ -202,8 +206,10 @@ h2 { */ .optionalbox { + left: 0px; padding: 5px 10px; margin: 5px 0; + text-align: left; } .optionalbox h1 { @@ -226,7 +232,7 @@ h2 { } #search_field { - position:relative; + position: relative; } #search_field input[type="text"] { @@ -234,6 +240,7 @@ h2 { font-size: 14px; line-height: 15px; height: 25px; + padding: 2px 0px 2px 5px; box-shadow: inset #DDD 0px 1px 3px; box-sizing: border-box; -webkit-box-sizing: border-box; @@ -255,9 +262,10 @@ h2 { text-transform: capitalize; padding-left: 0px; padding-right: 0px; - background: url(sprite.png); + background: image-url("sprite.png"); position: absolute; top: 5px; + right: 4px; cursor: pointer; } @@ -307,9 +315,10 @@ h2 { border: 0px; padding-left: 0px; padding-right: 0px; - background: url(sprite.png) 0 -30px no-repeat; + background: image-url("sprite.png") 0 -30px no-repeat; position: absolute; top: 8px; + left: 17px; } /* Rules for Creative Commons logo button */ @@ -322,8 +331,14 @@ h2 { /* Rules for tabbed navigation bar */ #top-bar { - border-bottom: 1px solid #ccc; + position: absolute; + z-index: 10000; + top: 0; + left: 185px; + right: 0; height: 29px; + border-bottom: 1px solid #ccc; + background: white; } #tabnav { @@ -340,11 +355,13 @@ h2 { } #tabnav a, #tabnav a:link, #tabnav a:visited { + float: left; background: #fff; font-size: 14px; line-height: 19px; font-weight: bold; padding: 5px 10px; + margin-right: 1px; text-decoration: none; color: #333; -webkit-transition: color 200ms ease-in; @@ -393,8 +410,10 @@ body.site-export #tabnav a#exportanchor { /* Rules for greeting bar in the top right corner */ #greeting { + float: right; height: 28px; margin: 0px; + padding-right: 10px; font-size: 13px; line-height: 28px; } @@ -409,9 +428,10 @@ body.site-export #tabnav a#exportanchor { z-index: 20000000; position: absolute; top: 15px; + left: 15px; } -/* Rules for OpenLayers maps */ +/* Rules for Leaflet maps */ #map { margin: 0px; @@ -419,13 +439,6 @@ body.site-export #tabnav a#exportanchor { padding: 0px; } -.olControlAttribution { - bottom: 15px !important; - left: 0px !important; - right: 0px !important; - text-align: center; -} - #permalink { z-index: 10000; position: absolute; @@ -441,12 +454,30 @@ body.site-export #tabnav a#exportanchor { padding: 5px; } -div.olControlZoom a { - margin: 0 !important; +.leaflet-control-attribution a.disabled { + color: #99c9dc; + cursor: default; + text-decoration: none; +} + +.site-index .leaflet-top, +.site-export .leaflet-top { + top: 40px !important; + + .leaflet-control { + margin-top: 0px !important; + } +} + +.site-index #map .olControlScaleLine, +.site-export #map .olControlScaleLine { + left: 10px !important; } -div.olControlZoom a.olControlZoomIn { - border-bottom: 0; +.leaflet-popup-scrolled { + padding-right: 20px; + border-bottom: 0px !important; + border-top: 0px !important; } /* Rules for edit menu */ @@ -488,20 +519,30 @@ div.olControlZoom a.olControlZoomIn { display: none; } +.attribution_license { + text-align: left; +} + .attribution_notice { text-align: center; } +.attribution_project { + text-align: right; +} + /* Rules for the popout map sidebar */ #sidebar { display: none; position: absolute; - margin: 0px; + margin: 30px 0px 0px 0px; padding: 0px; + border-right: 1px solid #ccc; width: 30%; top: 0px; bottom: 0px; + left: 0px; } #sidebar #sidebar_content { @@ -521,7 +562,15 @@ div.olControlZoom a.olControlZoomIn { height: 29px; font-size: 14px; line-height: 15px; - background: #bbb; + background: #ccc; +} + +#sidebar #sidebar_title { + text-align: left; +} + +#sidebar #sidebar_close { + text-align: right; } /* Rules for the map key which appears in the popout sidebar */ @@ -633,19 +682,28 @@ div.olControlZoom a.olControlZoomIn { /* Rules for the main content area */ #content { - padding: 10px; - margin: 0px; - position: absolute; - bottom: 0px; + padding: 20px; + margin: 30px 0px 0px 185px; + border-left: 1px solid #ccc; + text-align: left; } -.site-index #content, .site-edit #content, +.site-index #content, .site-export #content { - border: 0px; + position: fixed; + margin-top: 0px; + left: 0px; + right: 0px; + top: 0px; + bottom: 0px; padding: 0px; } +.site-edit #content { + top: 30px; +} + #slim_container { width: 100%; } @@ -675,6 +733,7 @@ div.olControlZoom a.olControlZoomIn { #slim_header img { vertical-align: middle; margin-bottom: 5px; + margin-right: 5px; } /* Rules for text content pages */ @@ -725,6 +784,7 @@ div.olControlZoom a.olControlZoomIn { border-width: 0px; margin-top: 1px; margin-bottom: 1px; + text-align: left; } #changeset_list td { @@ -751,8 +811,10 @@ div.olControlZoom a.olControlZoomIn { #changeset_list_map { position: absolute; + float: right; top: 0px; bottom: 0px; + right: 0px; width: 49%; min-height: 400px; border: solid 1px black; @@ -761,7 +823,9 @@ div.olControlZoom a.olControlZoomIn { /* Rules for the data browser */ #browse_navigation { + float: right; width: 250px; + margin-left: 10px; text-align: center; } @@ -769,8 +833,33 @@ table.browse_details th { white-space: nowrap; } +td.browse_comments { + padding: 0px; + + table { + border-collapse: collapse; + + td { + padding-bottom: 10px; + + p { + margin-top: 0px; + margin-bottom: 0px; + } + + span.by { + font-size: small; + color: #999999; + } + } + } +} + #browse_map { + float: right; width: 250px; + text-align: right; + margin-left: 10px; } #browse_map #small_map { @@ -789,6 +878,7 @@ table.browse_details th { font-size: small; border-collapse: collapse; border-width: 0px; + text-align: right; } #trace_list .trace_summary { @@ -833,9 +923,30 @@ table.browse_details th { } #user_list_actions { + float: right; margin-top: 10px; } +/* Rules for the diary list */ + +.diary_entry-list img.user_image { + float: right; +} + +.diary_entry-list img.user_thumbnail { + float: right; +} + +/* Rules for the diary entry view */ + +.diary_entry-view img.user_image { + float: right; +} + +.diary_entry-view img.user_thumbnail { + float: right; +} + /* Rules for the new diary entry page */ .diary_entry div#map { @@ -924,6 +1035,14 @@ form#termsForm { margin-bottom: 3em; } +form#termsForm div#buttons { + float: right; +} + +form#termsForm input#agree { + margin-left: 50px; +} + div#slim_content form#termsForm { width: auto; } @@ -986,7 +1105,12 @@ p#contributorGuidance { /* Rules for the user view */ +.user-view img.user_image { + float: right; +} + .user-view .user_map { + float: right; position: relative; width: 400px; height: 400px; @@ -1004,16 +1128,21 @@ p#contributorGuidance { /* Rules for the user map */ -.user_map .olControlSimplePanZoom { +.user_map .leaflet-control-pan, +.user_map .leaflet-control-zoomslider { display: none; } -.user_map .olControlZoom { +.user_map .leaflet-control-zoom { display: block; } /* Rules for user popups on maps */ +.user_popup { + min-width: 200px; +} + .user_popup p { padding-top: 3px; padding-bottom: 3px; @@ -1126,9 +1255,11 @@ p#contributorGuidance { #errorExplanation h2 { font-weight: bold; font-size: 12px; + padding: 5px 5px 5px 15px; margin: -7px; background-color: #c00; color: #fff; + text-align: left; } #errorExplanation p { @@ -1149,6 +1280,11 @@ p#contributorGuidance { font-weight: bold; font-size: 12px; line-height: 20px; + text-align: right; +} + +.submitButton { + text-align: right; } .minorNote { @@ -1163,6 +1299,11 @@ textarea { border: 1px solid #ccc; } +input.openid_url { + background: image-url('openid_input.png') repeat-y left white; + padding-left: 16px; +} + /* Rules for user images */ img.user_image { @@ -1252,6 +1393,7 @@ abbr.geo { display: inline-block; vertical-align: top; background-color: #ddd; + margin-left: 15px; padding: 5px 10px 10px 10px; font-size: 12px; @@ -1261,9 +1403,12 @@ abbr.geo { th { vertical-align: top; + text-align: left; + padding: 0px 15px 0px 0px !important; } td { + text-align: left; font-family: fixed; line-height: 16px; padding: 0px !important; @@ -1271,10 +1416,31 @@ abbr.geo { input.richtext_doedit { margin-top: 5px !important; + margin-right: 10px !important; } input.richtext_dopreview { margin-top: 5px !important; + margin-left: 10px !important; } } } + +/* Rules for the notes interface */ + +.note { + .comment_body { + margin-top: 4px; + margin-bottom: 4px; + + p { + margin-top: 0px; + margin-bottom: 0px; + } + } + + .buttons { + margin-top: 5px; + text-align: right; + } +}