westdc-zf1/htdocs/js/theme/default/style.mobile.css

64 lines
1.6 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;
}
/* Enable 3d acceleration when operating on tiles, this is
known to yield better performance on IOS Safari.
http://osgeo-org.1803224.n2.nabble.com/Harware-accelerated-CSS3-animations-for-iOS-td6255560.html
It also prevents tile blinking effects in iOS 5.
See https://github.com/openlayers/openlayers/issues/511
*/
@media (-webkit-transform-3d) {
img.olTileImage {
-webkit-transform: translate3d(0, 0, 0);
}
}