X-Git-Url: https://git.openstreetmap.org/rails.git/blobdiff_plain/1f0884a34c078ae955c0466fbcdddadfab9dca33..dca0be1886d9b9fcd2cab1b7c82ac4132fbf722b:/app/assets/stylesheets/common.scss diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss index 740305cd3..009082e28 100644 --- a/app/assets/stylesheets/common.scss +++ b/app/assets/stylesheets/common.scss @@ -15,9 +15,15 @@ fieldset,img { border: 0; } legend { color: #000; } -sup { vertical-align: text-top; } +sup { + vertical-align: super; + font-size: smaller; +} -sub { vertical-align: text-bottom; } +sub { + vertical-align: sub; + font-size: smaller; +} table { border-collapse: collapse; @@ -169,6 +175,7 @@ small, aside { .icon.close:hover { background-position: -200px -20px; } .icon.check { background-position: -220px 0; } .icon.note { background-position: -240px 0; } +.icon.note.grey { background-position: -240px -20px; } .icon.query { background-position: -260px 0; } /* Rules for links */ @@ -222,7 +229,7 @@ table { /* Rules for the header */ -#menu-icon { +#menu-icon { display: none !important; float: right; background: image-url("menu-icon.png") no-repeat; @@ -284,7 +291,7 @@ nav.primary { > li { border-right: $border; float: left; - &:last-child { + &:last-child { border-right: 0; } > a:hover { background: lighten($green, 30%); } @@ -365,12 +372,12 @@ nav.secondary { > li { border-right: $border; float: left; - &:last-child { + &:last-child { border-right: 0; > a { border-radius: 0 $border-radius $border-radius 0; - } + } } &:first-child > a { border-radius: $border-radius 0 0 $border-radius; } &:hover a { background: lighten($darkgrey, 30%); } @@ -438,7 +445,7 @@ nav.secondary { } } -@media only screen and (max-width:960px) { +body.compact { #compact-secondary-nav { display: inline-block; } @@ -466,90 +473,6 @@ nav.secondary { margin-top: 50px; } -/* Rules for bootstrap tooltips */ - -.tooltip { - position: absolute; - display: none; - color: #333; - text-align: left; - font-size: 12px; - max-width: 250px; -} - -.tooltip.in { - opacity: 0.8; - z-index: 1030; - height: auto; - display: block; -} - -.tooltip.top { - margin-top: -10px; - text-align: center; -} - -.tooltip.right { - margin-left: 10px; -} - -.tooltip.bottom { - margin-top: 10px; - text-align: center; -} - -.tooltip.left { - margin-left: -10px; - text-align: right; -} - -.tooltip-inner { - display: inline-block; - padding: 10px; - font-weight: normal; - background-color: white; -} - -.tooltip-arrow { - position: absolute; - width: 0; - height: 0; - border-color: transparent; - border-style: solid; -} - -.tooltip.top .tooltip-arrow { - bottom: -5px; - left: 50%; - margin-left: -5px; - border-top-color: white; - border-width: 5px 5px 0; -} - -.tooltip.right .tooltip-arrow { - top: 50%; - left: -5px; - margin-top: -5px; - border-right-color: white; - border-width: 5px 5px 5px 0; -} - -.tooltip.left .tooltip-arrow { - top: 50%; - right: -5px; - margin-top: -5px; - border-left-color: white; - border-width: 5px 0 5px 5px; -} - -.tooltip.bottom .tooltip-arrow { - top: -5px; - left: 50%; - margin-left: -5px; - border-bottom-color: white; - border-width: 0 5px 5px; -} - /* Rules for Leaflet maps */ .leaflet-control .control-button { @@ -636,6 +559,12 @@ nav.secondary { float: right; cursor: pointer; } + + p.error { + background-color: #ff7070; + padding: 10px; + font-weight: bold; + } } .welcome { @@ -688,6 +617,10 @@ nav.secondary { &.query-disabled { cursor: not-allowed; } + + .leaflet-marker-draggable { + cursor: move; + } } #map-ui { @@ -745,7 +678,7 @@ nav.secondary { margin-bottom: 8px; position: relative; transition: border-color 0.08s ease-in; - + label { position: absolute; top: 0; @@ -789,6 +722,7 @@ nav.secondary { text-decoration: none; background-color: $lightblue; padding: 5px 10px; + border-right: 1px solid #fff; } a:first-child { @@ -797,7 +731,6 @@ nav.secondary { } a:last-child { - border-left: 1px solid #fff; border-radius: 0 4px 4px 0; } @@ -857,6 +790,10 @@ nav.secondary { #attribution { display: none; + + table { + width: 100% + } } .attribution_license, @@ -877,10 +814,10 @@ nav.secondary { padding: $lineheight/2 $lineheight; // background: $offwhite; // border-bottom: 1px solid #ccc; - > .close { + > .close { float: right; margin-top: 2px; - cursor: pointer; + cursor: pointer; } } @@ -995,10 +932,23 @@ header .search_forms, float: right; } + div.header { + width: 100%; + height: 30px; + } + div.line { width: 100%; margin: 0px 0px 5px 0px; } + + div.loader_copy { + display: none; + + img { + vertical-align: middle; + } + } } /* Rules for the map key which appears in the popout sidebar */ @@ -1035,6 +985,7 @@ header .search_forms, .search_results_error { color: #f00; + padding: 10px 20px; } /* Rules for routing */ @@ -1076,7 +1027,7 @@ tr.turn:hover { background: $list-highlight; } .routing_engines, #route_from, #route_to { margin-left: 25px; } -.routing_marker { width: 15px; position: absolute; } +.routing_marker { width: 15px; position: absolute; cursor: move; } /* Rules for entity history */ @@ -1109,6 +1060,15 @@ tr.turn:hover { color: #000; } } + + .comments { + float: right; + color: #999; + } + + .comments-0 { + opacity: 0.5; + } } /* Rules for the browse sidebar */ @@ -1346,7 +1306,7 @@ tr.turn:hover { .content-heading { background: $lightgrey; - + h1 { font-size: 22px; } } @@ -1681,11 +1641,11 @@ tr.turn:hover { /* Rules for the log in page */ -#login_openid_buttons { +#login_auth_buttons { margin-bottom: 0; } -#login_openid_buttons li { +#login_auth_buttons li { float: left; padding: $lineheight/4 $lineheight/2; } @@ -1844,19 +1804,26 @@ tr.turn:hover { /* Rules for "flash" notice boxes shown at the top of the content area */ -.error { +.flash { padding: $lineheight; - background-color: #ff7070; -} -.warning { - padding: $lineheight; - background-color: #ffe0cc; -} + &.error { + background-color: #ff7070; + } -.notice { - padding: $lineheight; - background-color: #CBEEA7; + &.warning { + background-color: #ffe0cc; + } + + &.notice { + background-color: #CBEEA7; + } + + div.message { + display: inline-block; + margin-left: $lineheight / 2; + vertical-align: middle; + } } /* Rules for highlighting fields with rails validation errors */ @@ -1935,7 +1902,7 @@ tr.turn:hover { padding-top: $lineheight; border-top: 1px solid $lightgrey; } - .horizontal-list .form-row { + .horizontal-list .form-row { float: left; padding-right: 10px; } @@ -2503,7 +2470,7 @@ input.richtext_title[type="text"] { .site-welcome, .site-fixthemap { .center { text-align: center; - .sprite { + .sprite { float: none; margin: auto; } @@ -2516,7 +2483,7 @@ input.richtext_title[type="text"] { float: left; } - .icon-list { + .icon-list { padding-bottom: 20px; div { margin-bottom: 10px; @@ -2559,6 +2526,10 @@ input.richtext_title[type="text"] { background-position: -300px 0; } + .sprite.rules { + background-position: -350px 0; + } + .start-mapping { margin: auto; cursor: pointer; @@ -2709,6 +2680,7 @@ input.richtext_title[type="text"] { &.open { background-position: 0px -80px; } &.partners { background-position: 0px -120px; } &.infringement { background-position: 0px -160px; } + &.legal { background-position: -45px -160px; } } } @@ -2719,4 +2691,3 @@ input.richtext_title[type="text"] { display: none; } } -