Add marker halo animation styles
This commit is contained in:
parent
1b19974b12
commit
721e32b5ce
2 changed files with 32 additions and 1 deletions
|
@ -25,3 +25,34 @@ div.leaflet-marker-icon.location-filter.move-marker {
|
|||
.site .leaflet-popup p {
|
||||
margin: 0 0 20px 0;
|
||||
}
|
||||
|
||||
img.leaflet-marker-icon:after {
|
||||
content:'';
|
||||
position:absolute; left:50%; top:50%;
|
||||
margin:-30px 0 0 -30px;
|
||||
width:59px;
|
||||
height:59px;
|
||||
display:block;
|
||||
background:rgba(0,0,0,0.2);
|
||||
border:2px solid rgba(0,0,0,0.6);
|
||||
border-radius:50%;
|
||||
opacity:0;
|
||||
-webkit-animation:place-tmp 2000ms infinite;
|
||||
-moz-animation:place-tmp 2000ms infinite;
|
||||
animation:place-tmp 2000ms infinite;
|
||||
@-webkit-keyframes place-tmp {
|
||||
0% { opacity:1; -webkit-transform:scale(0); }
|
||||
50% { opacity:0; -webkit-transform:scale(1); }
|
||||
100% { opacity:0; -webkit-transform:scale(1); }
|
||||
}
|
||||
@-moz-keyframes place-tmp {
|
||||
0% { opacity:1; -moz-transform:scale(0); }
|
||||
50% { opacity:0; -moz-transform:scale(1); }
|
||||
100% { opacity:0; -moz-transform:scale(1); }
|
||||
}
|
||||
@keyframes place-tmp {
|
||||
0% { opacity:1; transform:scale(0); }
|
||||
50% { opacity:0; transform:scale(1); }
|
||||
100% { opacity:0; transform:scale(1); }
|
||||
}
|
||||
}
|
|
@ -6,7 +6,7 @@
|
|||
</h2>
|
||||
|
||||
<div class="note browse-section">
|
||||
<p><%= t('javascripts.notes.new.intro') %></p>
|
||||
<h4><%= t('javascripts.notes.new.intro') %></h4>
|
||||
<form action="#">
|
||||
<input type="hidden" name="lon">
|
||||
<input type="hidden" name="lat">
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue