X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/0c8ad2f86edefed72052b402742cadedb0d674d9..82f89681695a2c59fe2b3a42c9acfa92246a2a38:/app/assets/stylesheets/common.css.scss diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss index d20e4b4c4..b114ffc0e 100644 --- a/app/assets/stylesheets/common.css.scss +++ b/app/assets/stylesheets/common.css.scss @@ -169,7 +169,7 @@ table { height: 100%; width: 185px; font-size: 11px; - line-height: 12px; + line-height: 1.1; z-index: 100; border-right: 1px solid #ccc; } @@ -187,7 +187,7 @@ table { #logo h1 { font-size: 18px; - line-height: 20px; + line-height: 1.1; text-align: center; margin: 0px; } @@ -262,8 +262,8 @@ table { left: 0px; margin: 0; padding: 5px 10px; - line-height: 15px; font-size: 12px; + line-height: 1.25; list-style-type: none; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; @@ -335,7 +335,7 @@ table { width: 165px; padding: 3px; font-size: 14px; - line-height: 15px; + line-height: 1.1; height: 25px; padding: 2px 0px 2px 5px; box-shadow: inset #DDD 0px 1px 3px; @@ -382,38 +382,26 @@ table { .donate { display: block; - position: relative; width: 153px; padding: 5px; border: 1px solid #AED1A0; background: #cbeea7; - line-height: 20px; - text-align: center; font-size: 14px; + line-height: 1.4; + text-align: center; border-radius: 2px; - -moz-border-radius: 2px; color: #222; margin: 10px 10px 0px 10px; -} -.donate:hover { - background: #9ed485; - text-decoration: none; -} - -.donate p { - text-indent: 20px; - margin: 0; -} - -.donate .donate-icon { - width: 15px; - height: 15px; - border: 0px; - background: image-url("sprite.png") 0 -30px no-repeat; - position: absolute; - top: 8px; - left: 17px; + &:hover { + background: #9ed485; + text-decoration: none; + } + span { + margin: 0; + padding-left: 18px; + background: image-url("sprite.png") 0 -29px no-repeat; + } } /* Rules for Creative Commons logo button */ @@ -529,19 +517,21 @@ table { /* Rules for Leaflet maps */ -#permalink { - z-index: 10000; - position: absolute; - bottom: 0px; - right: 0px; - padding: 5px; - background:#fff; -} +.leaflet-control-attribution { + a.disabled { + color: #99c9dc; + cursor: default; + text-decoration: none; + } -.leaflet-control-attribution a.disabled { - color: #99c9dc; - cursor: default; - text-decoration: none; + ul.secondary-actions { + float: left; + margin-right: 5px; + + &:only-child { + margin-right: 0px; + } + } } .site-index .leaflet-top, @@ -563,6 +553,11 @@ table { border-top: 0px !important; } +.leaflet-popup-content-wrapper { + border-radius: 4px !important; + -webkit-border-radius: 4px !important; +} + /* Rules for edit menu */ .menuicon { @@ -685,7 +680,12 @@ table { } .search_results_entry { - margin-bottom: 0 ; + margin-bottom: 0; + + .search_details { + display: block; + text-align: right; + } } .search_results_entry .search_searching { @@ -915,17 +915,31 @@ ul.results-list li { border-bottom: 1px solid #ccc; } } } +#changeset_list_map_wrapper { + position: absolute; + width: 50%; + height: 490px; + top: 0; + right: 0; +} + +#changeset_list_map_wrapper.scrolled { + position: fixed; +} + #changeset_list_map { position: absolute; bottom: 20px; top: 20px; right: 20px; - width: 45%; - min-height: 398px; - max-height: 598px; + left: 20px; border: 1px solid #ccc; } +#changeset_list_map_wrapper.scrolled #changeset_list_map { + margin-left: 93px; +} + /* Rules for the data browser */ .browse-section { @@ -935,15 +949,19 @@ ul.results-list li { border-bottom: 1px solid #ccc; } &:first-child { margin-top: 0; } - &.warning { - color: #ff7070; - font-weight: bold; + .warning { + background-color: #ffe0cc; + margin: 0px; + padding: 4px 6px; + max-width: 100%; } h4, p { margin-bottom: 5px; } - p, ul, .bbox { - margin-left: 33.3333%; + p, ul, .bbox, .geo { + display: inline-block; + vertical-align: top; + max-width: 65%; } ul p { margin-left: 0; @@ -951,7 +969,8 @@ ul.results-list li { border-bottom: 1px solid #ccc; } } h4 { width: 33.3333%; - float: left; + display: inline-block; + vertical-align: top; } } @@ -1078,11 +1097,6 @@ ul.results-list li { border-bottom: 1px solid #ccc; } min-height: 62px; } -.content_map .leaflet-popup-content-wrapper { --webkit-border-radius: 4px; - border-radius: 4px; -} - /* Rules for user popups on maps */ .user_popup { @@ -1152,7 +1166,7 @@ ul.results-list li { border-bottom: 1px solid #ccc; } } h1, h2 { font-size: 21px; - line-height: 21px; + line-height: 1; } small.deemphasize { float: left; @@ -1368,7 +1382,7 @@ p#contributorGuidance { background-color: #ff7070; } &#warning { - background-color: #fff6f0; + background-color: #ffe0cc; } &#notice { background-color: #CBEEA7; @@ -1424,7 +1438,7 @@ p#contributorGuidance { vertical-align: top; font-weight: bold; font-size: 12px; - line-height: 20px; + line-height: 1.6666; text-align: right; } @@ -1591,6 +1605,12 @@ a.button.submit { font-size: 14px; } + code { + font-size: 13px; + background: #e8e8e8; + padding: 2px 3px; + } + img { padding: 20px; background-color: #f4f4ff; @@ -1636,18 +1656,15 @@ a.button.submit { /* Rules for rich text editors */ .richtext_container { - white-space: nowrap; - .richtext_content { display: inline-block; vertical-align: top; - white-space: normal; .richtext_preview { display: inline-block; padding: 20px; background-color: #f4f4ff; - overflow-x: scroll; + overflow-x: auto; &.loading { background-image: image-url("loading.gif"); @@ -1667,7 +1684,7 @@ a.button.submit { margin-left: 15px; background-color: #f8f8ff; padding: 10px; - width: 200px; + max-width: 450px; ul { margin-bottom: 0; @@ -1679,20 +1696,22 @@ a.button.submit { padding-bottom: 5px; } - li h4, li span { - display: block; + li h4, li span, li p { + display: inline-block; + vertical-align: top; font-size: 11px; } li h4 { + width: 35%; margin: 0; - float: left; } - li span { - float: right; - width: 50%; + li span, li p { + width: 60%; margin-left: 10px; + margin-bottom: 5px; + white-space: nowrap; } input.richtext_doedit, @@ -1720,21 +1739,47 @@ a.button.submit { /* Rules for the notes interface */ +.note { + padding-top: 10px; +} + .note { h2 { margin-bottom: 10px; } + div { + margin-top: 10px; + } + + .permalink { + position: absolute; + top: 5px; + left: 5px; + min-width: 15px; + min-height: 15px; + background: image-url("sprite.png") 0 -45px no-repeat; + } + + .permalink span { + display: none; + padding-left: 20px; + } + + .permalink:hover span { + display: block; + } + .warning { display: block; - background-color: #ff7070; + background-color: #ffe0cc; padding: 4px 6px; margin-bottom: 10px; } .comment_body { - margin-top: 4px; - margin-bottom: 4px; + margin-top: 2px; + margin-bottom: 2px; p { margin-top: 0px; @@ -1744,6 +1789,7 @@ a.button.submit { .comment { width: 100%; + height: 100px; } .buttons { @@ -1751,3 +1797,34 @@ a.button.submit { text-align: right; } } + +/* + * Rules for the iD editor + */ +.id-embed { + width: 100%; + height: 100%; +} + +/* Rules for rotating sidebar ads */ +.ad-container { + display: block; + height: 120px; + overflow: hidden; + position: relative; + border-bottom: 1px solid #cccccc; +} + +.ads { + width: 370px; + position: absolute; + left: 0%; +} + +.ad { + float: left; + height: 100px; + padding: 10px; + border: 0px; + background: #fff; +}