/* 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 {
.icon.close:hover { background-position: -200px -20px; }
.icon.check { background-position: -220px 0; }
.icon.note { background-position: -240px 0; }
-.icon.gear { background-position: -260px 0; }
+.icon.query { background-position: -260px 0; }
/* Rules for links */
#noscript {
z-index: 20000000;
- position: absolute;
- top: 15px;
- left: 15px;
+ margin-left: 400px;
+ margin-top: 50px;
}
/* Rules for bootstrap tooltips */
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;
}
#map {
height: 100%;
overflow: hidden;
+
+ &.query-active {
+ cursor: help;
+ }
+
+ &.query-disabled {
+ cursor: not-allowed;
+ }
}
#map-ui {
.leaflet-popup-content-wrapper {
border-radius: 4px !important;
- -webkit-border-radius: 4px !important;
}
/* Rules for attribution text under the main map shown on printouts */
}
}
-/* 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;
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 {
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;
}
+ select {
+ /* this next line is to polyfill the vertical alignment of text within a select element,
+ * which is different between firefox and chrome. */
+ padding: 0.3em 0;
+ }
+
+ .query_options {
+ text-align: right;
+ font-size: 10px;
+ color: $blue;
+ }
+
.describe_location {
position: absolute;
top: 6px;
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;
+ }
+
+ select.routing_engines {
+ min-height: 30px;
+ margin: 0px 0px 5px 25px;
+ }
+
+ div.line {
+ width: 100%;
+ margin: 0px 0px 5px 0px;
+ }
}
/* Rules for the map key which appears in the popout sidebar */
border-bottom: $keyline;
cursor: pointer;
&:first-child { border-top: $keyline; }
- &.selected { background: #FFFFE6; }
+ &.selected { background: $list-highlight; }
}
.search_details {
color: #f00;
}
+/* Rules for routing */
+
+#sidebar_content>table {
+ padding: 5px 20px 10px 15px;
+ width: 100%;
+ border-collapse: separate;
+}
+
+div.direction {
+ background-image: image-url('routing-sprite.png');
+ width: 20px;
+ height: 20px;
+ background-repeat: no-repeat;
+}
+@for $i from 1 through 17 {
+div.direction.i#{$i} { background-position: #{($i)*-20+20}px 0px; }
+}
+
+p#routing_summary {
+ padding: 0 $lineheight $lineheight/4;
+}
+
+td.instruction, td.distance {
+ padding-top: $lineheight/5;
+ padding-bottom: $lineheight/5;
+ border-bottom: 1px solid #DDD;
+}
+td.distance {
+ color: #BBB;
+ text-align: right;
+ font-size: x-small;
+}
+tr.turn {
+ cursor: pointer;
+}
+tr.turn:hover {
+ background: $list-highlight;
+}
+.routing_engines, #route_from, #route_to { margin-left: 25px; }
+.routing_marker { width: 15px; position: absolute; }
+
/* Rules for entity history */
#sidebar_content {
border-bottom: 1px solid #ddd;
cursor: pointer;
- &.selected { background: #FFFFE6; }
+ &.selected { background: $list-highlight; }
/* color is derived from changeset bbox fillColor in history.js */
}
font-size: 90%;
}
- .note-comments li {
+ .note-comments li, .changeset-comments li {
margin: $lineheight/2 0;
p {
}
}
+ .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;
}
+
+ .query-intro p {
+ padding: $lineheight $lineheight $lineheight/2;
+ }
+
+ .query-results {
+ display: none;
+
+ h3 {
+ padding: $lineheight $lineheight $lineheight/2;
+ margin: 0;
+ }
+
+ ul {
+ li {
+ padding: 15px 20px;
+ border-bottom: 1px solid #ddd;
+
+ &.query-result {
+ cursor: pointer;
+ }
+
+ &.selected {
+ background: $list-highlight;
+ }
+ }
+ }
+ }
}
/* Rules for export sidebar */
}
}
+/* Rules for the routing sidebar */
+
+#sidebar_content {
+ #routing_credit {
+ text-align: center;
+ padding: 0.5em;
+ }
+}
+
/* Rules for edit pages */
.site-edit {
#new_trace {
input[type=text] {
width: 50%;
- width: -moz-calc(100% - 150px);
- width: -webkit-calc(100% - 150px);
+ 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;
}
cursor: pointer;
border: 0;
display: inline-block;
- line-height: 20px;
padding: $lineheight/4 $lineheight/2;
min-height: 20px + $lineheight/2;
min-width: 120px;
background: $blue;
text-align: center;
border-radius: 2px;
- -moz-border-radius: 2px;
&:hover {
background: darken($blue, $hovercolor);
text-decoration: none;
}
}
+input[type="button"],
+input[type="submit"],
+input[type="reset"] {
+ line-height: normal;
+}
+
+a.button {
+ line-height: 20px;
+}
+
.buttons {
min-width: 200px;
input[type="submit"],
input[type="button"],
input[type="reset"],
- .button {
+ .button,
+ .button_to {
box-sizing: border-box;
float: left;
border-radius: 0;
overflow: hidden;
}
input:first-child,
- .button:first-child {
+ .button:first-child,
+ .button_to:first-child {
border-radius:2px 0 0 2px;
}
input:last-child,
- .button:last-child {
+ .button:last-child,
+ .button_to:last-child {
border-radius:0 2px 2px 0;
border-right-width: 0;
}
input:only-child,
.button:only-child,
+ .button_to:only-child,
*[value="Hide"] + input:last-child,
- *[value="Hide"] + .button:last-child {
+ *[value="Hide"] + .button:last-child,
+ *[value="Hide"] + .button_to:last-child {
border-radius:2px;
border-right-width: 0;
}
/* if a 3-button set has a hidden middle button */
*[value="Hide"] + input:nth-child(3),
- *[value="Hide"] + .button:nth-child(3) {
+ *[value="Hide"] + .button:nth-child(3),
+ *[value="Hide"] + .button_to:nth-child(3) {
border-radius:0 2px 2px 0;
border-right-width: 0;
}
/* if a 3-button set starts with a hidden button */
*[value="Hide"] + input:nth-child(2):not(:last-child),
- *[value="Hide"] + .button:nth-child(2):not(:last-child) {
+ *[value="Hide"] + .button:nth-child(2):not(:last-child),
+ *[value="Hide"] + .button_to:nth-child(2):not(:last-child) {
border-radius:2px 0 0 2px;
border-right-width: 1px;
}
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) {
.richtext_content {
width: 50%;
- width: -moz-calc(100% - 235px);
- width: -webkit-calc(100% - 235px);
width: calc(100% - 235px);
display: inline-block;
vertical-align: top;
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 {
projects / rails.git / blobdiff