In current Webkit browsers, having translate3d on svg child elements causes the positioning from the layer not to be inherited by the vector layer content.
63 lines
1.5 KiB
CSS
63 lines
1.5 KiB
CSS
div.olControlZoom {
|
|
position: absolute;
|
|
top: 8px;
|
|
left: 8px;
|
|
background: rgba(255,255,255,0.4);
|
|
border-radius: 4px;
|
|
padding: 2px;
|
|
}
|
|
* {
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
}
|
|
div.olControlZoom a {
|
|
display: block;
|
|
margin: 1px;
|
|
padding: 0;
|
|
color: white;
|
|
font-size: 28px;
|
|
font-family: sans-serif;
|
|
font-weight: bold;
|
|
text-decoration: none;
|
|
text-align: center;
|
|
height: 32px;
|
|
width: 32px;
|
|
line-height: 28px;
|
|
text-shadow: 0 0 3px rgba(0,0,0,0.8);
|
|
background: #130085; /* fallback for IE - IE6 requires background shorthand*/
|
|
background: rgba(0, 60, 136, 0.5);
|
|
filter: alpha(opacity=80);
|
|
}
|
|
a.olControlZoomIn {
|
|
border-radius: 4px 4px 0 0;
|
|
}
|
|
a.olControlZoomOut {
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
div.olControlZoom a:hover {
|
|
background: #130085; /* fallback for IE */
|
|
background: rgba(0, 60, 136, 0.7);
|
|
filter: alpha(opacity=100);
|
|
}
|
|
@media only screen and (max-width: 600px) {
|
|
div.olControlZoom a:hover {
|
|
background: rgba(0, 60, 136, 0.5);
|
|
}
|
|
}
|
|
.olLayerGrid .olTileImage {
|
|
-webkit-transition: opacity 0.2s linear;
|
|
-moz-transition: opacity 0.2s linear;
|
|
-o-transition: opacity 0.2s linear;
|
|
transition: opacity 0.2s linear;
|
|
}
|
|
/* Turn on GPU support where available */
|
|
.olMapViewport, .olMapViewport * {
|
|
-webkit-transform: translate3d(0,0,0);
|
|
-moz-transform: translate3d(0,0,0);
|
|
-o-transform: translate3d(0,0,0);
|
|
-ms-transform: translate3d(0,0,0);
|
|
transform: translate3d(0,0,0);
|
|
}
|
|
.olLayerDiv svg * {
|
|
-webkit-transform: none;
|
|
}
|