X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/ea458b1821ab29fb37fd14def1eb2a20e7787e6e..5ff9f2d21c82a9ebe06be748a37de764d0861514:/public/stylesheets/common.css diff --git a/public/stylesheets/common.css b/public/stylesheets/common.css index 4efbd928f..8b387e1d3 100644 --- a/public/stylesheets/common.css +++ b/public/stylesheets/common.css @@ -10,6 +10,10 @@ body { padding: 0px; } +body.slim { + background-color: #f0f0f0; +} + /* Rules for links */ a { @@ -34,20 +38,22 @@ hr { #left { position: absolute; - top: -8px; - min-width: 150px; + top: 0px; + min-width: 170px; } /* Rules for the OpenStreetMap logo in the top left corner */ #logo { - width: 150px; - min-width: 150px; - padding: 10px; - margin: 10px; + width: 170px; + min-width: 170px; + padding: 5px; + margin: 5px; height: 150px; background: #fff; border: 1px solid #ccd; + border-radius: 5px; + -moz-border-radius: 5px; } #logo h1 { @@ -61,16 +67,25 @@ hr { margin: 0px; } +/* Rules for the site name */ + +#small-title { + display: none; +} + /* Rules for the introductory text displayed in the left sidebar to new users */ #intro { width: 170px; - margin: 10px; + padding: 5px; + margin: 5px; border: 1px solid #ccc; font-size: 11px; + border-radius: 5px; + -moz-border-radius: 5px; } -#intro p { margin: 10px; } +#intro p { margin: 5px; } /* * Rules for alert boxes shown in the left sidebar when important @@ -79,14 +94,16 @@ hr { */ #alert { - width: 150px; - margin: 10px; - padding: 10px; + width: 170px; + margin: 5px; + padding: 5px; border: 1px solid #ccc; background: #d00; line-height: 1.2em; text-align: left; font-size: 14px; + border-radius: 5px; + -moz-border-radius: 5px; } /* @@ -96,23 +113,25 @@ hr { */ .notice { - width: 150px; - margin: 10px; - padding: 10px; + width: 170px; + margin: 5px; + padding: 5px; border: 1px solid #ccc; background: #ea0; line-height: 1.2em; text-align: left; font-size: 14px; + border-radius: 5px; + -moz-border-radius: 5px; } /* Rules for the menu displayed in the left sidebar */ .left_menu { - width: 150px; - min-width: 150px; - margin: 10px; - padding: 10px; + width: 170px; + min-width: 170px; + margin: 5px; + padding: 5px; border: 1px solid #ccc; left: 0px; background: #ddd; @@ -120,6 +139,8 @@ hr { text-align: Left; font-size: 14px; font-weight: bold; + border-radius: 5px; + -moz-border-radius: 5px; } .left_menu td { @@ -135,8 +156,9 @@ hr { } .left_menu ul { - padding-left: 10px; + padding-left: 0px; margin: 0px; + list-style-type: none; } .left_menu li { @@ -155,8 +177,12 @@ hr { /* Rules for SOTM advert */ #sotm { - width: 170px; + width: 180px; + min-width: 180px; + margin: 5px; padding: 0px; + border: 0px; + background: #fff; } /* @@ -166,16 +192,18 @@ hr { */ .optionalbox { - width: 150px; - min-width: 150px; - margin: 10px; - padding: 10px; + width: 170px; + min-width: 170px; + margin: 5px; + padding: 5px; border: 1px solid #ccc; left: 0px; line-height: 1.2em; text-align: left; font-size: 12px; background: #eee; + border-radius: 5px; + -moz-border-radius: 5px; } .optionalbox h1 { @@ -194,7 +222,7 @@ hr { float: right; } -.search_form { +.search_container { height: 16px; padding-bottom: 6px; } @@ -206,11 +234,13 @@ hr { } #search_field input[type="text"] { - width: 116px; + width: 136px; } #search_field input[type="submit"] { width: 26px; + padding-left: 0px; + padding-right: 0px; } .search_help { @@ -223,14 +253,16 @@ hr { /* Rules for donation request box */ .donate { - width: 150px; - margin: 10px; - padding: 10px; + width: 170px; + margin: 5px; + padding: 5px; border: 1px solid #ccc; background: #cbeea7; line-height: 1.2em; text-align: center; font-size: 14px; + border-radius: 5px; + -moz-border-radius: 5px; } /* Rules for Creative Commons logo button */ @@ -271,6 +303,10 @@ hr { border: 1px solid #ccc; text-decoration: none; color: #333; + border-top-right-radius: 5px; + -moz-border-radius-topright: 5px; + border-top-left-radius: 5px; + -moz-border-radius-topleft: 5px; } #tabnav a:link.active, #tabnav a:visited.active @@ -335,15 +371,36 @@ hr { display: none !important; } -#map #permalink { - z-index:10000; - position:absolute; - bottom:15px; - right:15px; - font-size:smaller; +#permalink { + z-index: 10000; + position: absolute; + bottom: 15px; + right: 15px; + font-size: smaller; text-align: right; } +/* Rules for edit menu */ + +#editmenu { + display: none; + z-index: 10000; + position: absolute; + background-color: #ffffff; + border: 1px solid black; +} + +#editmenu ul { + margin-top: 10px; + margin-bottom: 10px; + padding-left: 10px; + padding-right: 10px; +} + +#editmenu li { + list-style-type: none; +} + /* Rules for attribution text under the main map shown on printouts */ #attribution { @@ -500,14 +557,57 @@ hr { text-align: left; } +#slim_container { + width: 100%; +} + +#slim_container_content { + max-width: 50em; + background-color: #FFFFFF; + margin: 10px auto; + padding: 3px; + border-radius: 25px; + -moz-border-radius: 25px; + border: 1px solid #e6e6e6; +} + +#slim_content { + margin: 10px; + margin-top: 90px; + max-width: 50em; +} + +#slim_header { + margin: 10px; + position: absolute; + top: 0px; +} + +#slim_header img { + vertical-align: middle; + margin-right: 5px; + margin-bottom: 5px; +} + /* Rules for the changeset list shown by the history tab etc */ -#changeset_list, #keyvalue { - width: 100%; +#changeset_list_container { + position: relative; +} + +#changeset_list { + width: 50%; font-size: small; text-align: left; border-collapse: collapse; border-width: 0px; + margin-top: 1px; + margin-bottom: 1px; +} + +#changeset_list td { + vertical-align: top; + padding: 3px; } #changeset_list .date { @@ -522,8 +622,46 @@ hr { white-space: nowrap; } -#changeset_list.th { - font-weight: bold; +#changeset_list .selected { + background-color: rgb(255, 255, 160); + background-color: rgba(255, 255, 85, 0.5); +} + +#changeset_list_map { + float: right; + position: absolute; + top: 0px; + bottom: 0px; + right: 0px; + width: 49%; + min-height: 400px; + border: solid 1px black; +} + +/* Rules for the data browser */ + +#browse_navigation { + float: right; + width: 250px; + text-align: center; + margin-left: 10px; +} + +table.browse_details th { + white-space: nowrap; +} + +#browse_map { + float: right; + width: 250px; + text-align: right; + margin-left: 10px; +} + +#browse_map #small_map { + width: 250px; + height: 300px; + border: solid 1px black; } /* Rules for the trace list shown by the traces tab etc */ @@ -540,6 +678,114 @@ hr { color: gray; } +/* Rules for the user list */ + +#user_list { + width: 100%; + font-size: small; +} + +#user_list tr { + vertical-align: middle; +} + +#user_list p { + margin-top: 0px; + margin-bottom: 0px; +} + +#user_list_actions { + float: right; + margin-top: 10px; +} + +/* Rules for the login page */ + +#login_wrapper div { + margin: 5px; + padding: 15px; + border-radius: 15px; + -moz-border-radius: 15px; +} + +#login_wrapper input[type=submit] { + float: right; +} + +#login_login { + background-color: #f5f5ff; + border: 1px solid #f3f3ff; + border-radius: 15px; + -moz-border-radius: 15px; +} + +#login_login h1 { + margin-top: 5px; +} + +#login_signup form.button-to div { + margin: 0px; + padding: 0px; +} + +/* Rules for the account confirmation page */ + +div#contributorTerms { + border: 1px solid black; + padding: 4px; + overflow: auto; + width: 95%; + height: 400px; +} + +div#slim_content div#contributorTerms { + width: auto; +} + +div#contributorTerms p#first { + margin-top: 0px; +} + +div#contributorTerms p#last { + margin-bottom: 0px; +} + +div#contributorTerms ol { + margin-bottom: 0px; +} + +div#contributorTerms img { + display: block; + margin-left: auto; + margin-right: auto; + margin-top: 10%; +} + +form#termsForm { + width: 95%; + margin-bottom: 3em; +} + +div#slim_content form#termsForm { + width: auto; +} + +form#termsForm div#buttons { + float: right; +} + +form#termsForm input#agree { + margin-left: 50px; +} + +p#contributorGuidance { + background-color: #f5f5ff; + border: 1px solid #f3f3ff; + border-radius: 15px; + -moz-border-radius: 15px; + padding: 10px; +} + /* Rules for the account settings page */ #accountForm td { @@ -600,6 +846,8 @@ hr { padding: 7px; background-color: #fff0f0; margin-bottom: 20px; + border-radius: 5px; + -moz-border-radius: 5px; } #warning { @@ -607,6 +855,8 @@ hr { padding: 7px; background-color: #fff6f0; margin-bottom: 20px; + border-radius: 5px; + -moz-border-radius: 5px; } #notice { @@ -614,6 +864,8 @@ hr { padding: 7px; background-color: #f0fff0; margin-bottom: 20px; + border-radius: 5px; + -moz-border-radius: 5px; } /* Rules for highlighting fields with rails validation errors */