|
1 /* required styles */ |
|
2 |
|
3 .leaflet-map-pane, |
|
4 .leaflet-tile, |
|
5 .leaflet-marker-icon, |
|
6 .leaflet-marker-shadow, |
|
7 .leaflet-tile-pane, |
|
8 .leaflet-overlay-pane, |
|
9 .leaflet-shadow-pane, |
|
10 .leaflet-marker-pane, |
|
11 .leaflet-popup-pane, |
|
12 .leaflet-overlay-pane svg, |
|
13 .leaflet-zoom-box, |
|
14 .leaflet-image-layer { /* TODO optimize classes */ |
|
15 position: absolute; |
|
16 } |
|
17 .leaflet-container { |
|
18 overflow: hidden; |
|
19 } |
|
20 .leaflet-tile-pane { |
|
21 -webkit-transform: translate3d(0,0,0); |
|
22 } |
|
23 .leaflet-tile, |
|
24 .leaflet-marker-icon, |
|
25 .leaflet-marker-shadow { |
|
26 -moz-user-select: none; |
|
27 -webkit-user-select: none; |
|
28 user-select: none; |
|
29 } |
|
30 .leaflet-marker-icon, |
|
31 .leaflet-marker-shadow { |
|
32 display: block; |
|
33 } |
|
34 .leaflet-clickable { |
|
35 cursor: pointer; |
|
36 } |
|
37 .leaflet-container img { |
|
38 max-width: auto; |
|
39 } |
|
40 |
|
41 .leaflet-tile-pane { z-index: 2; } |
|
42 .leaflet-overlay-pane { z-index: 3; } |
|
43 .leaflet-shadow-pane { z-index: 4; } |
|
44 .leaflet-marker-pane { z-index: 5; } |
|
45 .leaflet-popup-pane { z-index: 6; } |
|
46 |
|
47 .leaflet-zoom-box { |
|
48 width: 0; |
|
49 height: 0; |
|
50 } |
|
51 |
|
52 .leaflet-tile { |
|
53 visibility: hidden; |
|
54 } |
|
55 .leaflet-tile-loaded { |
|
56 visibility: inherit; |
|
57 } |
|
58 |
|
59 a.leaflet-active { |
|
60 outline: 2px solid orange; |
|
61 } |
|
62 |
|
63 |
|
64 /* Leaflet controls */ |
|
65 |
|
66 .leaflet-control { |
|
67 position: relative; |
|
68 z-index: 7; |
|
69 } |
|
70 .leaflet-top, |
|
71 .leaflet-bottom { |
|
72 position: absolute; |
|
73 } |
|
74 .leaflet-top { |
|
75 top: 0; |
|
76 } |
|
77 .leaflet-right { |
|
78 right: 0; |
|
79 } |
|
80 .leaflet-bottom { |
|
81 bottom: 0; |
|
82 } |
|
83 .leaflet-left { |
|
84 left: 0; |
|
85 } |
|
86 .leaflet-control { |
|
87 float: left; |
|
88 clear: both; |
|
89 } |
|
90 .leaflet-right .leaflet-control { |
|
91 float: right; |
|
92 } |
|
93 .leaflet-top .leaflet-control { |
|
94 margin-top: 10px; |
|
95 } |
|
96 .leaflet-bottom .leaflet-control { |
|
97 margin-bottom: 10px; |
|
98 } |
|
99 .leaflet-left .leaflet-control { |
|
100 margin-left: 10px; |
|
101 } |
|
102 .leaflet-right .leaflet-control { |
|
103 margin-right: 10px; |
|
104 } |
|
105 |
|
106 .leaflet-control-zoom { |
|
107 padding: 5px; |
|
108 background: rgba(0, 0, 0, 0.25); |
|
109 |
|
110 -moz-border-radius: 7px; |
|
111 -webkit-border-radius: 7px; |
|
112 border-radius: 7px; |
|
113 } |
|
114 .leaflet-control-zoom a { |
|
115 display: block; |
|
116 width: 19px; |
|
117 height: 19px; |
|
118 background-position: 50% 50%; |
|
119 background-repeat: no-repeat; |
|
120 background-color: rgba(255, 255, 255, 0.75); |
|
121 |
|
122 -moz-border-radius: 4px; |
|
123 -webkit-border-radius: 4px; |
|
124 border-radius: 4px; |
|
125 } |
|
126 .leaflet-control-zoom a:hover { |
|
127 background-color: #fff; |
|
128 } |
|
129 .leaflet-big-buttons .leaflet-control-zoom a { |
|
130 width: 27px; |
|
131 height: 27px; |
|
132 } |
|
133 .leaflet-control-zoom-in { |
|
134 background-image: url(images/zoom-in.png); |
|
135 margin-bottom: 5px; |
|
136 } |
|
137 .leaflet-control-zoom-out { |
|
138 background-image: url(images/zoom-out.png); |
|
139 } |
|
140 |
|
141 .leaflet-container .leaflet-control-attribution { |
|
142 margin: 0; |
|
143 padding: 0 5px; |
|
144 |
|
145 font: 11px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif; |
|
146 color: #333; |
|
147 |
|
148 background-color: rgba(255, 255, 255, 0.7); |
|
149 |
|
150 -moz-box-shadow: 0 0 7px #ccc; |
|
151 -webkit-box-shadow: 0 0 7px #ccc; |
|
152 box-shadow: 0 0 7px #ccc; |
|
153 } |
|
154 |
|
155 |
|
156 /* Fade animations */ |
|
157 |
|
158 .leaflet-fade-anim .leaflet-tile { |
|
159 opacity: 0; |
|
160 |
|
161 -webkit-transition: opacity 0.2s linear; |
|
162 -moz-transition: opacity 0.2s linear; |
|
163 -o-transition: opacity 0.2s linear; |
|
164 transition: opacity 0.2s linear; |
|
165 } |
|
166 .leaflet-fade-anim .leaflet-tile-loaded { |
|
167 opacity: 1; |
|
168 } |
|
169 |
|
170 .leaflet-fade-anim .leaflet-popup { |
|
171 opacity: 0; |
|
172 |
|
173 -webkit-transition: opacity 0.2s linear; |
|
174 -moz-transition: opacity 0.2s linear; |
|
175 -o-transition: opacity 0.2s linear; |
|
176 transition: opacity 0.2s linear; |
|
177 } |
|
178 .leaflet-fade-anim .leaflet-map-pane .leaflet-popup { |
|
179 opacity: 1; |
|
180 } |
|
181 |
|
182 .leaflet-zoom-anim .leaflet-tile { |
|
183 -webkit-transition: none; |
|
184 -moz-transition: none; |
|
185 -o-transition: none; |
|
186 transition: none; |
|
187 } |
|
188 |
|
189 .leaflet-zoom-anim .leaflet-objects-pane { |
|
190 visibility: hidden; |
|
191 } |
|
192 |
|
193 |
|
194 /* Popup layout */ |
|
195 |
|
196 .leaflet-popup { |
|
197 position: absolute; |
|
198 text-align: center; |
|
199 -webkit-transform: translate3d(0,0,0); |
|
200 } |
|
201 .leaflet-popup-content-wrapper { |
|
202 padding: 1px; |
|
203 text-align: left; |
|
204 } |
|
205 .leaflet-popup-content { |
|
206 margin: 19px; |
|
207 } |
|
208 .leaflet-popup-tip-container { |
|
209 margin: 0 auto; |
|
210 width: 40px; |
|
211 height: 16px; |
|
212 position: relative; |
|
213 overflow: hidden; |
|
214 } |
|
215 .leaflet-popup-tip { |
|
216 width: 15px; |
|
217 height: 15px; |
|
218 padding: 1px; |
|
219 |
|
220 margin: -8px auto 0; |
|
221 |
|
222 -moz-transform: rotate(45deg); |
|
223 -webkit-transform: rotate(45deg); |
|
224 -ms-transform: rotate(45deg); |
|
225 -o-transform: rotate(45deg); |
|
226 transform: rotate(45deg); |
|
227 } |
|
228 .leaflet-popup-close-button { |
|
229 position: absolute; |
|
230 top: 9px; |
|
231 right: 9px; |
|
232 |
|
233 width: 10px; |
|
234 height: 10px; |
|
235 |
|
236 overflow: hidden; |
|
237 } |
|
238 .leaflet-popup-content p { |
|
239 margin: 18px 0; |
|
240 } |
|
241 |
|
242 |
|
243 /* Visual appearance */ |
|
244 |
|
245 .leaflet-container { |
|
246 background: #ddd; |
|
247 } |
|
248 .leaflet-container a { |
|
249 color: #0078A8; |
|
250 } |
|
251 .leaflet-zoom-box { |
|
252 border: 2px dotted #05f; |
|
253 background: white; |
|
254 opacity: 0.5; |
|
255 } |
|
256 .leaflet-popup-content-wrapper, .leaflet-popup-tip { |
|
257 background: white; |
|
258 |
|
259 box-shadow: 0 1px 10px #888; |
|
260 -moz-box-shadow: 0 1px 10px #888; |
|
261 -webkit-box-shadow: 0 1px 14px #999; |
|
262 } |
|
263 .leaflet-popup-content-wrapper { |
|
264 -moz-border-radius: 20px; |
|
265 -webkit-border-radius: 20px; |
|
266 border-radius: 20px; |
|
267 } |
|
268 .leaflet-popup-content { |
|
269 font: 12px/1.4 "Helvetica Neue", Arial, Helvetica, sans-serif; |
|
270 } |
|
271 .leaflet-popup-close-button { |
|
272 background: white url(images/popup-close.png); |
|
273 } |