Simplify CSS code in custom-controls example

By using the ol-control css class and a button instead of a link.
This commit is contained in:
Frederic Junod
2014-10-30 12:37:01 +01:00
parent ffeda3f25a
commit a715a38d75
2 changed files with 7 additions and 37 deletions

View File

@@ -10,39 +10,12 @@
<link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
<style type="text/css">
.rotate-north {
position: absolute;
top: 65px;
left: 8px;
background: rgba(255,255,255,0.4);
border-radius: 4px;
padding: 2px;
left: .5em;
}
.ol-touch .rotate-north {
top: 80px;
}
.rotate-north a {
display: block;
color: white;
font-size: 16px;
font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
font-weight: bold;
margin: 1px;
text-decoration: none;
text-align: center;
border-radius: 2px;
height: 22px;
width: 22px;
background: rgba(0,60,136,0.5);
}
.ol-touch .rotate-north a {
font-size: 20px;
height: 30px;
width: 30px;
line-height: 26px;
}
.rotate-north a:hover {
background: rgba(0,60,136,0.7);
}
</style>
<title>ol3 custom controls example</title>
</head>