179 lines
3.6 KiB
CSS
179 lines
3.6 KiB
CSS
.ol-control.ol-routing {
|
|
top: 0.5em;
|
|
left: 3em;
|
|
max-height: 90%;
|
|
overflow-y: auto;
|
|
}
|
|
.ol-touch .ol-control.ol-routing {
|
|
left: 3.5em;
|
|
}
|
|
.ol-control.ol-routing.ol-searching {
|
|
opacity: .5;
|
|
}
|
|
|
|
.ol-control.ol-routing .ol-car,
|
|
.ol-control.ol-routing > button {
|
|
position: relative;
|
|
}
|
|
.ol-control.ol-routing .ol-car:after,
|
|
.ol-control.ol-routing > button:after {
|
|
content: "";
|
|
position: absolute;
|
|
width: .78em;
|
|
height: 0.6em;
|
|
border-radius: 40% 50% 0 0 / 50% 70% 0 0;
|
|
box-shadow: inset 0 0 0 0.065em, -0.35em 0.14em 0 -0.09em, inset 0 -0.37em, inset -0.14em 0.005em;
|
|
clip: rect(0 1em .5em -1em);
|
|
top: .35em;
|
|
left: .4em;
|
|
}
|
|
.ol-control.ol-routing .ol-car:before,
|
|
.ol-control.ol-routing > button:before {
|
|
content: "";
|
|
position: absolute;
|
|
width: .28em;
|
|
height: .28em;
|
|
border-radius: 50%;
|
|
box-shadow: inset 0 0 0 1em, 0.65em 0;
|
|
top: 0.73em;
|
|
left: .20em;
|
|
}
|
|
.ol-control.ol-routing .ol-pedestrian:after {
|
|
content: "";
|
|
position: absolute;
|
|
width: .3em;
|
|
height: .4em;
|
|
top: .25em;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
box-shadow: inset 0.3em 0, 0.1em 0.5em 0 -0.1em, -0.1em 0.5em 0 -0.1em, 0.25em 0.1em 0 -0.1em, -0.25em 0.1em 0 -0.1em;
|
|
border-top: .2em solid transparent;
|
|
}
|
|
.ol-control.ol-routing .ol-pedestrian:before {
|
|
content: "";
|
|
position: absolute;
|
|
width: .3em;
|
|
height: .3em;
|
|
top: .1em;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
border-radius: 50%;
|
|
background-color: currentColor;
|
|
}
|
|
|
|
.ol-control.ol-routing .content {
|
|
margin: .5em;
|
|
}
|
|
|
|
.ol-control.ol-routing.ol-collapsed .content {
|
|
display: none;
|
|
}
|
|
|
|
.ol-routing .ol-search.ol-collapsed ul {
|
|
display: none;
|
|
}
|
|
.ol-routing .ol-search ul .copy {
|
|
display: none;
|
|
}
|
|
.ol-routing .ol-search ul.history {
|
|
/* display: none; */
|
|
}
|
|
.ol-routing .content .search-input > div > * {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
}
|
|
.ol-routing .ol-result ul {
|
|
list-style: none;
|
|
display: block;
|
|
}
|
|
.ol-routing .ol-result li {
|
|
position: relative;
|
|
min-height: 1.65em;
|
|
}
|
|
.ol-routing .ol-result li i {
|
|
display: block;
|
|
font-size: .8em;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.ol-routing .ol-result li:before {
|
|
content: "";
|
|
border: 5px solid transparent;
|
|
position: absolute;
|
|
left: -1.75em;
|
|
border-bottom-color: #369;
|
|
border-width: .6em .4em .6em;
|
|
transform-origin: 50% 125%;
|
|
box-shadow: 0 0.65em 0 -0.25em #369;
|
|
top: -.8em;
|
|
}
|
|
.ol-routing .ol-result li:after {
|
|
content: "";
|
|
position: absolute;
|
|
width: 0.25em;
|
|
height: .6em;
|
|
left: -1.5em;
|
|
background: #369;
|
|
top: .6em;
|
|
border-radius: 0.1em;
|
|
}
|
|
.ol-routing .ol-result li.R:before {
|
|
transform: rotate(90deg);
|
|
}
|
|
.ol-routing .ol-result li.FR:before {
|
|
transform: rotate(45deg);
|
|
}
|
|
.ol-routing .ol-result li.L:before {
|
|
transform: rotate(-90deg);
|
|
}
|
|
.ol-routing .ol-result li.FL:before {
|
|
transform: rotate(-45deg);
|
|
}
|
|
|
|
.ol-routing .content > i {
|
|
vertical-align: middle;
|
|
margin: 0 .3em 0 .1em;
|
|
font-style: normal;
|
|
}
|
|
.ol-routing .ol-button,
|
|
.ol-routing .ol-button:focus,
|
|
.ol-routing .ol-pedestrian,
|
|
.ol-routing .ol-car {
|
|
font-size: 1.1em;
|
|
position: relative;
|
|
display: inline-block;
|
|
width: 1.4em;
|
|
height: 1.4em;
|
|
color: rgba(0,60,136,1);
|
|
background-color: transparent;
|
|
margin: 0 .1em;
|
|
opacity: .5;
|
|
vertical-align: middle;
|
|
outline: none;
|
|
cursor: pointer;
|
|
}
|
|
.ol-routing .ol-constraints {
|
|
display: block;
|
|
}
|
|
|
|
.ol-routing .ol-button:hover,
|
|
.ol-routing .ol-button.selected,
|
|
.ol-routing i.selected {
|
|
opacity: 1;
|
|
background: transparent;
|
|
}
|
|
.ol-routing .ol-method {
|
|
display: block;
|
|
}
|
|
|
|
|
|
.ol-control.ol-routing {
|
|
background-color: rgba(255,255,255,.25);
|
|
}
|
|
.ol-control.ol-routing:hover {
|
|
background-color: rgba(255,255,255,.75);
|
|
}
|
|
|
|
.search-input > div > button:before {
|
|
content: '\00b1';
|
|
} |