X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/606ac7610873859c48a42ccd39cfe58abb0d3870..3a9db4cf30899d256558f2e03a7c4c30d66669fd:/app/assets/stylesheets/common.css.scss diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss index 9e614f906..39519b81a 100644 --- a/app/assets/stylesheets/common.css.scss +++ b/app/assets/stylesheets/common.css.scss @@ -87,9 +87,7 @@ strong { /* Default rules for the body of every page */ * { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + box-sizing: border-box; } body { @@ -464,9 +462,8 @@ nav.secondary { #noscript { z-index: 20000000; - position: absolute; - top: 15px; - left: 15px; + margin-left: 400px; + margin-top: 50px; } /* Rules for bootstrap tooltips */ @@ -569,16 +566,16 @@ nav.secondary { background-color: black; } - &.active { - background-color: #9ed485; - } - &.disabled { background-color: #333; background-color: rgba(0,0,0,.5); cursor: default; } + &.active { + background-color: #9ed485; + } + .icon { margin: 10px; } @@ -854,7 +851,6 @@ nav.secondary { .leaflet-popup-content-wrapper { border-radius: 4px !important; - -webkit-border-radius: 4px !important; } /* Rules for attribution text under the main map shown on printouts */ @@ -911,13 +907,15 @@ nav.secondary { } } -/* Rules for the search box */ +/* Rules for the search and direction forms */ -header .search_form { +header .search_forms, +.directions_form { display: none; } -.search_form { +.search_form, +.directions_form { position: relative; padding: $lineheight/2; background-color: $lightgrey; @@ -931,11 +929,11 @@ header .search_form { input[type=text] { width: 100%; height: 30px; - border-right: none; - transition: 300ms linear; - -webkit-transition: 300ms linear; - -moz-transition: 300ms linear; + } + + input[type=text].overflow { + border-right: none; } input:focus { @@ -943,13 +941,19 @@ header .search_form { box-shadow: 0px 0px 7px #9ED485; } - input[type=submit] { + input[type=submit].float { float: right; width: auto; min-width: 0; border-radius: 0 2px 2px 0; } + .query_options { + text-align: right; + font-size: 10px; + color: $blue; + } + .describe_location { position: absolute; top: 6px; @@ -957,6 +961,23 @@ header .search_form { font-size: 10px; color: $blue; } + + .switch_link { + float: right; + width: auto; + min-width: 0; + margin-left: 6px; + } + + img.button { + display: block; + } + + span.force_width { + width: 100%; + padding-right: 25px; + display: block; + } } /* Rules for the map key which appears in the popout sidebar */ @@ -977,7 +998,9 @@ header .search_form { .search_results_entry { ul li { border-bottom: $keyline; + cursor: pointer; &:first-child { border-top: $keyline; } + &.selected { background: #FFFFE6; } } .search_details { @@ -993,6 +1016,45 @@ header .search_form { color: #f00; } +/* Rules for routing */ + +#sidebar_content>table { + padding: 5px 20px 10px 15px; + width: 100%; + border-collapse: separate; +} + +td.direction { + background-image: image-url('routing-sprite.png'); + width: 20px; height: 20px; + background-repeat: no-repeat; +} +@for $i from 1 through 17 { +td.direction.i#{$i} { background-position: #{($i)*-20+20}px 0px; } +} + +p#routing_summary { + padding: 0 $lineheight $lineheight/4; +} + +td.instruction, td.distance { + padding-top: 0; + border-bottom: 1px solid #DDD; +} +td.distance { + color: #BBB; + text-align: right; + font-size: x-small; +} +tr.turn { + cursor: pointer; +} +tr.turn:hover { + background: lighten($green, 30%); +} +.routing_engines, #route_from, #route_to { margin-left: 25px; } +.routing_marker { width: 15px; position: absolute; } + /* Rules for entity history */ #sidebar_content { @@ -1115,7 +1177,7 @@ header .search_form { font-size: 90%; } - .note-comments li { + .note-comments li, .changeset-comments li { margin: $lineheight/2 0; p { @@ -1123,6 +1185,27 @@ header .search_form { } } + .comments-header { + float: left; + } + + .subscribe-buttons { + float: left; + margin: 18px 10px 10px; + min-width: 80px; + } + + .subscribe-buttons input { + font-size: 90%; + line-height: 15px; + min-height: 20px; + } + + span.action-button:hover { + cursor: pointer; + text-decoration: underline; + } + .note-description { overflow: hidden; margin: 0 0 10px 10px; @@ -1152,10 +1235,6 @@ header .search_form { &.selected { background: #FFFFE6; } - - a { - color: #000; - } } } } @@ -1215,6 +1294,15 @@ header .search_form { } } +/* Rules for the routing sidebar */ + +#sidebar_content { + #routing_credit { + text-align: center; + padding: 0.5em; + } +} + /* Rules for edit pages */ .site-edit { @@ -1359,6 +1447,30 @@ header .search_form { } } +/* Rules for the new trace form */ + +#new_trace { + input[type=text] { + width: 50%; + width: calc(100% - 150px); + max-width: 500px; + } +} + +/* Rules for the edit trace form */ + +.edit_trace { + .form-row p { + margin-bottom: 0px; + } + + input[type=text] { + width: 50%; + width: calc(100% - 150px); + max-width: 500px; + } +} + /* Rules for the user profile page */ #userinformation { @@ -1941,7 +2053,6 @@ a.button { cursor: pointer; border: 0; display: inline-block; - line-height: 20px; padding: $lineheight/4 $lineheight/2; min-height: 20px + $lineheight/2; min-width: 120px; @@ -1950,7 +2061,6 @@ a.button { background: $blue; text-align: center; border-radius: 2px; - -moz-border-radius: 2px; &:hover { background: darken($blue, $hovercolor); text-decoration: none; @@ -1972,6 +2082,16 @@ a.button { } } +input[type="button"], +input[type="submit"], +input[type="reset"] { + line-height: normal; +} + +a.button { + line-height: 20px; +} + .buttons { min-width: 200px; input[type="submit"], @@ -2119,8 +2239,6 @@ a.button { input.richtext_title[type="text"] { width: 50%; - width: -moz-calc(100% - 235px); - width: -webkit-calc(100% - 235px); width: calc(100% - 235px); @media only screen and (max-width:768px) { @@ -2133,8 +2251,6 @@ input.richtext_title[type="text"] { .richtext_content { width: 50%; - width: -moz-calc(100% - 235px); - width: -webkit-calc(100% - 235px); width: calc(100% - 235px); display: inline-block; vertical-align: top; @@ -2269,12 +2385,8 @@ input.richtext_title[type="text"] { border-radius: 0 3px 3px; *border-right-width: 2px; *border-bottom-width: 2px; - -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); - -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); - box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); - -webkit-background-clip: padding-box; - -moz-background-clip: padding; - background-clip: padding-box; + box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); + background-clip: padding-box; } .dropdown-menu.pull-right { @@ -2439,13 +2551,6 @@ input.richtext_title[type="text"] { background-size: cover; background-attachment: fixed; - &.photo-0 { background-image: image-url('about/0.jpg'); .photo-0 { display: block; } } - &.photo-1 { background-image: image-url('about/1.jpg'); .photo-1 { display: block; } } - &.photo-2 { background-image: image-url('about/2.jpg'); .photo-2 { display: block; } } - &.photo-3 { background-image: image-url('about/4.jpg'); .photo-3 { display: block; } } - &.photo-4 { background-image: image-url('about/4.jpg'); .photo-4 { display: block; } } - &.photo-5 { background-image: image-url('about/5.jpg'); .photo-5 { display: block; } } - .caption { max-width: 200px; font: 13px/20px Helvetica, Arial, sans-serif;