X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/880d53d62ccbd1dae9a9a29a4bcc8ee50754beb1..44c3e1d66a983a41d4cdc4d3472a1d99d5bf6ef7:/app/assets/stylesheets/common.css.scss?ds=sidebyside diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss index 320413f78..a8fba1943 100644 --- a/app/assets/stylesheets/common.css.scss +++ b/app/assets/stylesheets/common.css.scss @@ -888,6 +888,12 @@ nav.secondary { p { padding: $lineheight; } + + input { + display: block; + margin-left: auto; + margin-right: auto; + } } #sidebar { @@ -910,6 +916,7 @@ header .search_form { .search_form { position: relative; padding: $lineheight/2; + padding-top: 1px; background-color: $lightgrey; .query_wrapper { @@ -940,13 +947,15 @@ header .search_form { border-radius: 0 2px 2px 0; } - .describe_location { - position: absolute; - top: 6px; - right: 6px; + .query_options { + text-align: right; font-size: 10px; color: $blue; } + + .routing { + display: none; + } } /* Rules for the map key which appears in the popout sidebar */ @@ -983,6 +992,41 @@ 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; } +} + +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 { @@ -1025,6 +1069,7 @@ header .search_form { h4:first-child { margin-top: 0; + word-wrap: break-word; } } @@ -1069,20 +1114,20 @@ header .search_form { border: 1px solid #ddd; border-radius: 3px; font-size: 12px; + table-layout: fixed; + border-collapse: separate; - li { + th, td { border-bottom: 1px solid #ddd; } - li:last-child { + tr:last-child th, tr:last-child td { border-bottom: 0; } .browse-tag-k, .browse-tag-v { - display: inline-block; width: 50%; - float: left; padding: 6px 10px; word-wrap: break-word; } @@ -1160,6 +1205,7 @@ header .search_form { .export_button { margin-top: $lineheight; + margin-bottom: $lineheight; } dl { @@ -1171,6 +1217,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 { @@ -1268,7 +1323,7 @@ header .search_form { right: 0; bottom: 0; border: 0; - z-index: 1000; + z-index: 2000; } #slim_container { @@ -1690,6 +1745,7 @@ header .search_form { .message-read .message-buttons { margin-top: $lineheight; + margin-bottom: $lineheight * 1.5; padding-top: $lineheight; border-top: 1px solid $lightgrey; } @@ -1717,12 +1773,6 @@ header .search_form { /* Rules for highlighting fields with rails validation errors */ -.field_with_errors { - padding: 2px; - background-color: #ff7070; - display: inline-block; -} - .formError { display: inline-block; padding: 5px 10px; @@ -1835,6 +1885,10 @@ textarea { padding: 2px 5px; margin: 0; width: 200px; + + &.field_with_errors { + border: 2px solid #ff7070; + } } textarea { @@ -1861,6 +1915,8 @@ img.user_thumbnail { } img.user_thumbnail_tiny { + width: auto; + height: auto; max-width: 25px; max-height: 25px; border: 1px solid #ccc; @@ -2108,14 +2164,32 @@ a.button { /* Rules for rich text editors */ +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) { + width: 100%; + } +} + .richtext_container { margin-bottom: $lineheight; .richtext_content { width: 50%; + width: -moz-calc(100% - 235px); + width: -webkit-calc(100% - 235px); + width: calc(100% - 235px); display: inline-block; vertical-align: top; + @media only screen and (max-width:768px) { + width: 100%; + } + .richtext_preview { display: inline-block; padding: $lineheight; @@ -2325,7 +2399,7 @@ a.button { } /* Rules for the "Welcome" page */ -.site-welcome { +.site-welcome, .site-fixthemap { .center { text-align: center; .sprite {