X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/bd14832cb5f0ec77905cd0b82c2c65d3c8e047af..e3d5e3da52ffdf10445f2d9cdcc8c67633f2dd82:/app/assets/stylesheets/common.css.scss diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss index b6aaf7371..6ead2220a 100644 --- a/app/assets/stylesheets/common.css.scss +++ b/app/assets/stylesheets/common.css.scss @@ -64,6 +64,10 @@ h2 { margin: 25px 0 5px 0; } +#logo img { + border: 0px; +} + #logo h1 { font-size: 18px; line-height: 20px; @@ -83,15 +87,23 @@ h2 { display: none; } +#small-title img { + border: 0px; +} + /* Rules for the introductory text displayed in the left sidebar to new users */ .sidebar-copy { - border-top: 1px solid #ccc; - padding: 0px 5px; + padding: 0px 10px; } .sidebar-copy p { - margin: 5px; + margin: 5px 0; +} + +.sidebar-copy.intro { + margin-top: -1px; + border-top: 1px solid #ccc; } /* @@ -101,7 +113,7 @@ h2 { */ .sidebar-alert { - padding: 0px 5px 0.1px 5px; + padding: 4px 5px 4px 5px; border-top: 1px solid #ccc; margin-top: 4px; margin-bottom: -4px; @@ -122,7 +134,7 @@ h2 { */ .sidebar-notice { - padding: 0px 5px 0.1px 5px; + padding: 4px 5px 4px 5px; border-top: 1px solid #ccc; margin-top: 4px; margin-bottom: -4px; @@ -141,7 +153,6 @@ h2 { padding: 5px 10px; margin: 4px 0; border-top: 1px solid #ccc; - border-bottom: 1px solid #ccc; line-height: 20px; font-size: 14px; font-weight: bold; @@ -176,14 +187,17 @@ h2 { /* Rules for SOTM advert */ #sotm { - width: 180px; - min-width: 180px; - margin: 5px; + width: 165px; + margin: 10px; padding: 0px; border: 0px; background: #fff; } +#sotm img { + width: 165px; +} + /* * Rules for "optional boxes" which appear in the left sidebar on * certain pages. Current users are the seach box on the main page @@ -193,7 +207,6 @@ h2 { .optionalbox { padding: 5px 10px; margin: 4px 0; - border-top: 1px solid #ccc; } .optionalbox h1 { @@ -207,13 +220,6 @@ h2 { /* Rules for the search box */ .whereami { - line-height: 20px; - vertical-align: bottom; -} - -.search_container { - height: 15px; - padding-bottom: 5px; } #search_field form { @@ -222,19 +228,52 @@ h2 { padding: 0px; } +#search_field { + position:relative; +} + #search_field input[type="text"] { - width: 130px; + width: 165px; + padding: 5px; + font-size: 14px; + line-height: 15px; + height: 25px; + box-shadow: inset #DDD 0px 1px 3px; + box-sizing: border-box; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + -ms-box-sizing: border-box; +} + +#search_field input[type="text"]:focus { + outline: none; + border: 1px solid #000; } #search_field input[type="submit"] { - width: 26px; + width: 15px; + height: 15px; + border:0; + text-indent:-1000px; padding-left: 0px; padding-right: 0px; + background: url(sprite.png); + position:absolute; + right:2px; + top:5px; + cursor:pointer; } .search_help { - margin-top: 2px; - margin-bottom: 0px; + margin:0; +} + +.deemphasize { + color: #999; +} + +.deemphasize a { + color: #7092FF; } /* Rules for donation request box */ @@ -243,13 +282,17 @@ h2 { width: 153px; margin: 10px 10px; padding: 5px; - border: 1px solid #ccc; + border: 1px solid #AED1A0; background: #cbeea7; line-height: 20px; text-align: center; font-size: 14px; - border-radius: 5px; - -moz-border-radius: 5px; + border-radius: 2px; + -moz-border-radius: 2px; +} + +.donate a { + color:#222; } /* Rules for Creative Commons logo button */ @@ -287,9 +330,16 @@ h2 { padding: 5px 10px; text-decoration: none; color: #333; + -webkit-transition: color 200ms ease-in; + -moz-transition: color 200ms ease-in; + -o-transition: color 200ms ease-in; + transition: color 200ms ease-in; } -#tabnav a:link.active, #tabnav a:visited.active { +body.site-index #tabnav a#viewanchor, +body.site-edit #tabnav a#editanchor, +body.changeset-list #tabnav a#historyanchor, +body.site-export #tabnav a#exportanchor { border-bottom: 1px solid #aaa; background: #9ed485; color: #000; @@ -314,6 +364,15 @@ h2 { text-decoration: none; } +.count-number { + padding: 2px 5px; + border-radius: 3px; + background: #eee; + margin: 0 2px; + font-size: 11px; + color: #333; +} + /* Rules for greeting bar in the top right corner */ #greeting { @@ -339,6 +398,7 @@ h2 { #map { margin: 0px; + border: 0px; padding: 0px; } @@ -364,25 +424,42 @@ h2 { padding: 5px; } +#permalink a.disabled { + color: #ccc; + cursor: default; + text-decoration: none; +} + /* Rules for edit menu */ +.menuicon { + padding: 5px; + + &:hover { + background: #eee; + text-decoration: none !important; + } +} + .menu { display: none; z-index: 10000; position: absolute; background-color: #ffffff; - border: 1px solid black; + border: 1px solid #cccccc; + border-top: 0px; } .menu ul { - margin-top: 10px; - margin-bottom: 10px; - padding-left: 10px; - padding-right: 10px; + margin: 0px; + padding: 0px; } .menu li { + padding: 2px 5px; + margin: 0px; list-style-type: none; + border-top: 1px solid #eee; white-space: nowrap; } @@ -441,7 +518,10 @@ h2 { padding-right: 5px; } -#mapkey .mapkey-table-key { +#mapkey .mapkey-table-key img { + display: block; + margin-left: auto; + margin-right: auto; } #mapkey .mapkey-table-value { @@ -540,9 +620,9 @@ h2 { bottom: 0px; } -#content.site_index, -#content.site_edit, -#content.site_export { +.site-index #content, +.site-edit #content, +.site-export #content { border: 0px; padding: 0px; } @@ -578,9 +658,15 @@ h2 { margin-bottom: 5px; } +/* Rules for text content pages */ + +.wide-table { + width: 100%; +} + /* Rules for the home page */ -.site_index #map { +.site-index #map { position: absolute; top: 0px; bottom: 0px; @@ -588,7 +674,7 @@ h2 { right: 0px; } -.site_export #map { +.site-export #map { position: absolute; top: 0px; bottom: 0px; @@ -598,12 +684,13 @@ h2 { /* Rules for the edit page */ -.site_edit #map { +.site-edit #map { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; + overflow: hidden; } /* Rules for the changeset list shown by the history tab etc */ @@ -663,6 +750,23 @@ table.browse_details th { white-space: nowrap; } +td.browse_comments { + padding: 0px; +} + +td.browse_comments table { + border-collapse: collapse; +} + +td.browse_comments table td { + padding-bottom: 10px; +} + +td.browse_comments table td span.by { + font-size: small; + color: #999999; +} + #browse_map { width: 250px; } @@ -832,6 +936,10 @@ p#contributorGuidance { /* Rules for the account settings page */ +#accountForm { + margin-top: 20px; +} + #accountForm td { padding-bottom: 10px; } @@ -865,14 +973,14 @@ p#contributorGuidance { /* Rules for the user view */ -.user_view .user_map { +.user-view .user_map { position: relative; width: 400px; height: 400px; border: 1px solid #ccc; } -.user_view .user_map p#no_home_location { +.user-view .user_map p#no_home_location { position: absolute; top: 0px; bottom: 0px; @@ -883,11 +991,11 @@ p#contributorGuidance { /* Rules for the user map */ -.user_map .olControlPanZoomBar { +.user_map .olControlSimplePanZoom { display: none; } -.user_map .olControlPanZoom { +.user_map .olControlZoom { display: block; } @@ -908,12 +1016,50 @@ p#contributorGuidance { /* Rules for message in/out box page */ -#messages { - border: 1px solid #ccc; +.messages { + width: 100%; + border-collapse: collapse; + border-spacing: 0px; + border-width: 0px; } -.inbox-row-unread .inbox-subject { - font-weight: bold; +.messages tbody tr { + border-top: 1px solid #ccc; +} + +.messages .inbox-row { + background: #eee; +} + +.messages tr td, +.messages tr th { + padding: 0px 5px; +} + +.inbox-row .inbox-mark-read { + display: none; +} + +.info-line { + border-bottom: 1px solid #ccc; + padding: 5px 0px 4px 0px; +} + +.info-line form, +.info-line form div { + display: inline; +} + +.info-line .user_thumbnail_tiny { + vertical-align: middle; +} + +.right { + float: right; +} + +.inbox-row-unread .inbox-mark-unread { + display: none; } /* Rules for "flash" notice boxes shown at the top of the content area */ @@ -1001,7 +1147,7 @@ input[type="email"], input[type="url"], input[type="password"], textarea { - border: 1px solid #888; + border: 1px solid #ccc; } /* Rules for user images */ @@ -1009,13 +1155,19 @@ textarea { img.user_image { max-width: 100px; max-height: 100px; - border: 1px solid black; + border: 1px solid #ccc; } img.user_thumbnail { max-width: 50px; max-height: 100px; - border: 1px solid black; + border: 1px solid #ccc; +} + +img.user_thumbnail_tiny { + max-width: 25px; + max-height: 25px; + border: 1px solid #ccc; } /* Rule for "nowrap" class that can be applied to anything to stop wrapping */