X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/6c2bca73c1eebe8d58b2be812d6c6939b1fdb134..d68368e0d571ae6b953e0f3900e3f4c304076769:/app/assets/stylesheets/common.css.scss diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss index 8b334a3e4..2837270fd 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,20 +49,23 @@ 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 */ #logo { + display: block; width: 170px; min-width: 170px; padding: 5px; text-align: center; - margin: 25px 0 5px 0; + margin: auto; } #logo img { @@ -94,7 +98,7 @@ h2 { /* Rules for the introductory text displayed in the left sidebar to new users */ .sidebar-copy { - padding: 0px 10px; + padding: 5px 10px; } .sidebar-copy p { @@ -150,38 +154,35 @@ h2 { /* Rules for the menu displayed in the left sidebar */ .left_menu { + left: 0px; + margin: 0; padding: 5px 10px; - margin: 4px 0; + line-height: 15px; + font-size: 12px; + list-style-type: none; + border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; - line-height: 20px; - font-size: 14px; - font-weight: bold; -} - -.left_menu h1 { - font-style: normal; - font-size: 15px; } .left_menu ul { - margin: 0px; - list-style-type: none; + padding: 0; + margin: 0; } .left_menu li { - margin: 0px; - padding: 0px; + list-style-type: none; + padding: 0; + margin: 0; } -/* submenus */ -.left_menu ul li ul { - font-weight: normal; - line-height: 15px; +.left_menu h4 { + padding: 5px 0 5px 0; font-size: 12px; + margin: 0; } -.left_menu a { - color: #000; +.left_menu li:last-child h4 { + padding-top: 0; } /* Rules for SOTM advert */ @@ -205,8 +206,10 @@ h2 { */ .optionalbox { + left: 0px; padding: 5px 10px; - margin: 4px 0; + margin: 5px 0; + text-align: left; } .optionalbox h1 { @@ -223,21 +226,21 @@ h2 { } #search_field form { - width: 100%; + width: 165px; margin: 0px; padding: 0px; } #search_field { - position:relative; + position: relative; } #search_field input[type="text"] { width: 165px; - padding: 5px; 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; @@ -253,19 +256,21 @@ h2 { #search_field input[type="submit"] { width: 15px; height: 15px; - border:0; - text-indent:-1000px; + border: 0px; + text-indent: -1000px; + overflow: hidden; + text-transform: capitalize; padding-left: 0px; padding-right: 0px; - background: url(sprite.png); - position:absolute; - right:2px; - top:5px; - cursor:pointer; + background: image-url("sprite.png"); + position: absolute; + top: 5px; + right: 4px; + cursor: pointer; } .search_help { - margin:0; + margin: 5px 0 0 0; } .deemphasize { @@ -279,8 +284,10 @@ h2 { /* Rules for donation request box */ .donate { + display: block; + position: relative; width: 153px; - margin: 10px 10px; + margin: 10px 10px 0px 10px; padding: 5px; border: 1px solid #AED1A0; background: #cbeea7; @@ -289,10 +296,29 @@ h2 { font-size: 14px; border-radius: 2px; -moz-border-radius: 2px; + color: #222; +} + +.donate:hover { + background: #9ed485; + text-decoration: none; +} + +.donate p { + text-indent: 20px; + margin: 0; } -.donate a { - color:#222; +.donate .donate-icon { + width: 15px; + height: 15px; + border: 0px; + padding-left: 0px; + padding-right: 0px; + background: image-url("sprite.png") 0 -30px no-repeat; + position: absolute; + top: 8px; + left: 17px; } /* Rules for Creative Commons logo button */ @@ -305,8 +331,13 @@ h2 { /* Rules for tabbed navigation bar */ #top-bar { - border-bottom: 1px solid #ccc; + position: absolute; + top: 0; + left: 185px; + right: 0; height: 29px; + border-bottom: 1px solid #ccc; + background: white; } #tabnav { @@ -323,11 +354,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; @@ -376,8 +409,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; } @@ -392,6 +427,7 @@ body.site-export #tabnav a#exportanchor { z-index: 20000000; position: absolute; top: 15px; + left: 15px; } /* Rules for OpenLayers maps */ @@ -424,12 +460,16 @@ body.site-export #tabnav a#exportanchor { padding: 5px; } -div.olControlZoom a { - margin: 0 !important; +.site-index #map .SimpleLayerSwitcher, +.site-index #map .olControlSimplePanZoom, +.site-export #map .SimpleLayerSwitcher, +.site-export #map .olControlSimplePanZoom { + top: 40px !important; } -div.olControlZoom a.olControlZoomIn { - border-bottom: 0; +.site-index #map .olControlScaleLine, +.site-export #map .olControlScaleLine { + left: 10px !important; } /* Rules for edit menu */ @@ -471,20 +511,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 { @@ -504,7 +554,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 */ @@ -616,19 +674,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%; } @@ -658,6 +725,7 @@ div.olControlZoom a.olControlZoomIn { #slim_header img { vertical-align: middle; margin-bottom: 5px; + margin-right: 5px; } /* Rules for text content pages */ @@ -708,6 +776,7 @@ div.olControlZoom a.olControlZoomIn { border-width: 0px; margin-top: 1px; margin-bottom: 1px; + text-align: left; } #changeset_list td { @@ -734,8 +803,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; @@ -744,7 +815,9 @@ div.olControlZoom a.olControlZoomIn { /* Rules for the data browser */ #browse_navigation { + float: right; width: 250px; + margin-left: 10px; text-align: center; } @@ -753,7 +826,10 @@ table.browse_details th { } #browse_map { + float: right; width: 250px; + text-align: right; + margin-left: 10px; } #browse_map #small_map { @@ -772,6 +848,7 @@ table.browse_details th { font-size: small; border-collapse: collapse; border-width: 0px; + text-align: right; } #trace_list .trace_summary { @@ -816,9 +893,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 { @@ -907,6 +1005,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; } @@ -969,7 +1075,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; @@ -1109,9 +1220,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 { @@ -1132,6 +1245,11 @@ p#contributorGuidance { font-weight: bold; font-size: 12px; line-height: 20px; + text-align: right; +} + +.submitButton { + text-align: right; } .minorNote { @@ -1146,6 +1264,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 { @@ -1235,6 +1358,7 @@ abbr.geo { display: inline-block; vertical-align: top; background-color: #ddd; + margin-left: 15px; padding: 5px 10px 10px 10px; font-size: 12px; @@ -1244,9 +1368,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; @@ -1254,10 +1381,12 @@ abbr.geo { input.richtext_doedit { margin-top: 5px !important; + margin-right: 10px !important; } input.richtext_dopreview { margin-top: 5px !important; + margin-left: 10px !important; } } }