ol-ext/examples/layer/map.layer.gppvtile.css
2021-02-18 16:36:07 +01:00

134 lines
2.0 KiB
CSS

body {}
#map {
position: fixed;
background: rgb(255, 255, 255);
top: 7em;
left: 0;
bottom: 0;
right: 16.5em;
margin: .5em;
}
h1 {
overflow: hidden;
white-space: nowrap;
}
.options button {
float: right;
min-width: 6em;
margin: 0 0 .5em;
}
.options button i {
color: #000;
}
.info {
margin: 0;
}
.ol-popup h2 {
display: inline;
margin: 0;
}
.options {
position: fixed;
top: 4em;
bottom: 0;
right: 0;
margin: 0;
overflow-y: auto;
height: auto;
display: block;
width: 15.5em;
}
.options ul {
border: 1px solid #369;
padding: .5em;
margin: .5em 0;
clear: both;
transition: .3s;
}
.options > ul i {
width: .7em;
height: .7em;
transform: translateX(-.3em) rotate(45deg);
box-shadow: inset -.3em -.3em;
float: left;
margin: .1em;
cursor: pointer;
transition: .3s;
}
.options li.collapse i {
transform: translateX(-.3em) rotate(-45deg);
}
.options ul ul {
overflow: hidden;
transition: .3s;
}
.options li li {
height: 1.3em;
transition: .3s;
overflow: hidden;
}
.options li.collapse li {
height: 0;
}
.options li.collapse ul {
padding: 0 .5em;
}
.options > ul > li > label {
font-weight: bold;
color: #369;
}
.options label.toponyme {
float: right;
font-weight: normal;
margin: .5em 0;
}
.options ul ul label {
width: 100%;
display: inline-block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.options select {
float: right;
}
.ol-permalink {
display: none;
}
#color > div {
position: fixed;
top: 30%;
left: 50%;
transform: translate(-50%, -30%);
background-color: #fff;
box-shadow: 0 0 .1em;
padding: .5em 1em;
width: fit-content;
max-width: calc(100% - 2em);
box-sizing: border-box;
}
#color {
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0,0,0,.5);
z-index: 999;
display: none;
}
#police {
display: block;
text-align: right;
clear: both;
}
@media (max-width: 800px) {
.options {
width: 12.5em;
letter-spacing: -.06em;
}
#map {
right: 13.5em;
}
}