]> git.openstreetmap.org Git - rails.git/blob - vendor/assets/leaflet/leaflet.css
Update Leaflet
[rails.git] / vendor / assets / leaflet / leaflet.css
1 /* required styles */\r
2 \r
3 .leaflet-map-pane,\r
4 .leaflet-tile,\r
5 .leaflet-marker-icon,\r
6 .leaflet-marker-shadow,\r
7 .leaflet-tile-pane,\r
8 .leaflet-overlay-pane,\r
9 .leaflet-shadow-pane,\r
10 .leaflet-marker-pane,\r
11 .leaflet-popup-pane,\r
12 .leaflet-overlay-pane svg,\r
13 .leaflet-zoom-box,\r
14 .leaflet-image-layer,\r
15 .leaflet-layer {\r
16         position: absolute;\r
17         left: 0;\r
18         }\r
19 .leaflet-container {\r
20         overflow: hidden;\r
21         -ms-touch-action: none;\r
22         }\r
23 .leaflet-tile,\r
24 .leaflet-marker-icon,\r
25 .leaflet-marker-shadow {\r
26         -webkit-user-select: none;\r
27            -moz-user-select: none;\r
28                 user-select: none;\r
29         }\r
30 .leaflet-marker-icon,\r
31 .leaflet-marker-shadow {\r
32         display: block;\r
33         }\r
34 /* map is broken in FF if you have max-width: 100% on tiles */\r
35 .leaflet-container img {\r
36         max-width: none !important;\r
37         }\r
38 /* stupid Android 2 doesn't understand "max-width: none" properly */\r
39 .leaflet-container img.leaflet-image-layer {\r
40         max-width: 15000px !important;\r
41         }\r
42 .leaflet-tile {\r
43         filter: inherit;\r
44         visibility: hidden;\r
45         }\r
46 .leaflet-tile-loaded {\r
47         visibility: inherit;\r
48         }\r
49 .leaflet-zoom-box {\r
50         width: 0;\r
51         height: 0;\r
52         }\r
53 \r
54 .leaflet-tile-pane    { z-index: 2; }\r
55 .leaflet-objects-pane { z-index: 3; }\r
56 .leaflet-overlay-pane { z-index: 4; }\r
57 .leaflet-shadow-pane  { z-index: 5; }\r
58 .leaflet-marker-pane  { z-index: 6; }\r
59 .leaflet-popup-pane   { z-index: 7; }\r
60 \r
61 \r
62 /* control positioning */\r
63 \r
64 .leaflet-control {\r
65         position: relative;\r
66         z-index: 7;\r
67         pointer-events: auto;\r
68         }\r
69 .leaflet-top,\r
70 .leaflet-bottom {\r
71         position: absolute;\r
72         z-index: 1000;\r
73         pointer-events: none;\r
74         }\r
75 .leaflet-top {\r
76         top: 0;\r
77         }\r
78 .leaflet-right {\r
79         right: 0;\r
80         }\r
81 .leaflet-bottom {\r
82         bottom: 0;\r
83         }\r
84 .leaflet-left {\r
85         left: 0;\r
86         }\r
87 .leaflet-control {\r
88         float: left;\r
89         clear: both;\r
90         }\r
91 .leaflet-right .leaflet-control {\r
92         float: right;\r
93         }\r
94 .leaflet-top .leaflet-control {\r
95         margin-top: 10px;\r
96         }\r
97 .leaflet-bottom .leaflet-control {\r
98         margin-bottom: 10px;\r
99         }\r
100 .leaflet-left .leaflet-control {\r
101         margin-left: 10px;\r
102         }\r
103 .leaflet-right .leaflet-control {\r
104         margin-right: 10px;\r
105         }\r
106 \r
107 \r
108 /* zoom and fade animations */\r
109 \r
110 .leaflet-fade-anim .leaflet-tile,\r
111 .leaflet-fade-anim .leaflet-popup {\r
112         opacity: 0;\r
113         -webkit-transition: opacity 0.2s linear;\r
114            -moz-transition: opacity 0.2s linear;\r
115              -o-transition: opacity 0.2s linear;\r
116                 transition: opacity 0.2s linear;\r
117         }\r
118 .leaflet-fade-anim .leaflet-tile-loaded,\r
119 .leaflet-fade-anim .leaflet-map-pane .leaflet-popup {\r
120         opacity: 1;\r
121         }\r
122 \r
123 .leaflet-zoom-anim .leaflet-zoom-animated {\r
124         -webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);\r
125            -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);\r
126              -o-transition:      -o-transform 0.25s cubic-bezier(0,0,0.25,1);\r
127                 transition:         transform 0.25s cubic-bezier(0,0,0.25,1);\r
128         }\r
129 .leaflet-zoom-anim .leaflet-tile,\r
130 .leaflet-pan-anim .leaflet-tile,\r
131 .leaflet-touching .leaflet-zoom-animated {\r
132         -webkit-transition: none;\r
133            -moz-transition: none;\r
134              -o-transition: none;\r
135                 transition: none;\r
136         }\r
137 \r
138 .leaflet-zoom-anim .leaflet-zoom-hide {\r
139         visibility: hidden;\r
140         }\r
141 \r
142 \r
143 /* cursors */\r
144 \r
145 .leaflet-clickable {\r
146         cursor: pointer;\r
147         }\r
148 .leaflet-container {\r
149         cursor: -webkit-grab;\r
150         cursor:    -moz-grab;\r
151         }\r
152 .leaflet-popup-pane,\r
153 .leaflet-control {\r
154         cursor: auto;\r
155         }\r
156 .leaflet-dragging,\r
157 .leaflet-dragging .leaflet-clickable,\r
158 .leaflet-dragging .leaflet-container {\r
159         cursor: move;\r
160         cursor: -webkit-grabbing;\r
161         cursor:    -moz-grabbing;\r
162         }\r
163 \r
164 \r
165 /* visual tweaks */\r
166 \r
167 .leaflet-container {\r
168         background: #ddd;\r
169         outline: 0;\r
170         }\r
171 .leaflet-container a {\r
172         color: #0078A8;\r
173         }\r
174 .leaflet-container a.leaflet-active {\r
175         outline: 2px solid orange;\r
176         }\r
177 .leaflet-zoom-box {\r
178         border: 2px dotted #05f;\r
179         background: white;\r
180         opacity: 0.5;\r
181         }\r
182 \r
183 \r
184 /* general typography */\r
185 .leaflet-container {\r
186         font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;\r
187 }\r
188 \r
189 \r
190 /* zoom control */\r
191 \r
192 .leaflet-control-zoom {\r
193         -webkit-border-radius: 7px;\r
194                 border-radius: 7px;\r
195         }\r
196 .leaflet-control-zoom {\r
197         padding: 5px;\r
198         background: rgba(0, 0, 0, 0.25);\r
199         }\r
200 .leaflet-control-zoom a {\r
201         width: 19px;\r
202         height: 19px;\r
203         background-color: rgba(255, 255, 255, 0.75);\r
204         -webkit-border-radius: 4px;\r
205                 border-radius: 4px;\r
206         }\r
207 .leaflet-control-zoom a,\r
208 .leaflet-control-layers-toggle {\r
209         background-position: 50% 50%;\r
210         background-repeat: no-repeat;\r
211         display: block;\r
212         }\r
213 .leaflet-control-zoom a:hover {\r
214         background-color: #fff;\r
215         }\r
216 .leaflet-touch .leaflet-control-zoom a {\r
217         width: 27px;\r
218         height: 27px;\r
219         }\r
220 .leaflet-control-zoom-in {\r
221         background-image: url(images/zoom-in.png);\r
222         margin-bottom: 5px;\r
223         }\r
224 .leaflet-control-zoom-out {\r
225         background-image: url(images/zoom-out.png);\r
226         }\r
227 \r
228 \r
229 /* layers control */\r
230 \r
231 .leaflet-control-layers {\r
232         box-shadow: 0 1px 7px #999;\r
233         background: #f8f8f9;\r
234         -webkit-border-radius: 8px;\r
235                 border-radius: 8px;\r
236         }\r
237 .leaflet-control-layers-toggle {\r
238         background-image: url(images/layers.png);\r
239         width: 36px;\r
240         height: 36px;\r
241         }\r
242 .leaflet-touch .leaflet-control-layers-toggle {\r
243         width: 44px;\r
244         height: 44px;\r
245         }\r
246 .leaflet-control-layers .leaflet-control-layers-list,\r
247 .leaflet-control-layers-expanded .leaflet-control-layers-toggle {\r
248         display: none;\r
249         }\r
250 .leaflet-control-layers-expanded .leaflet-control-layers-list {\r
251         display: block;\r
252         position: relative;\r
253         }\r
254 .leaflet-control-layers-expanded {\r
255         padding: 6px 10px 6px 6px;\r
256         color: #333;\r
257         background: #fff;\r
258         }\r
259 .leaflet-control-layers-selector {\r
260         margin-top: 2px;\r
261         position: relative;\r
262         top: 1px;\r
263         }\r
264 .leaflet-control-layers label {\r
265         display: block;\r
266         }\r
267 .leaflet-control-layers-separator {\r
268         height: 0;\r
269         border-top: 1px solid #ddd;\r
270         margin: 5px -10px 5px -6px;\r
271         }\r
272 \r
273 \r
274 /* attribution and scale controls */\r
275 \r
276 .leaflet-container .leaflet-control-attribution {\r
277         background-color: rgba(255, 255, 255, 0.7);\r
278         box-shadow: 0 0 5px #bbb;\r
279         margin: 0;\r
280         }\r
281 .leaflet-control-attribution,\r
282 .leaflet-control-scale-line {\r
283         padding: 0 5px;\r
284         color: #333;\r
285         }\r
286 .leaflet-container .leaflet-control-attribution,\r
287 .leaflet-container .leaflet-control-scale {\r
288         font-size: 11px;\r
289         }\r
290 .leaflet-left .leaflet-control-scale {\r
291         margin-left: 5px;\r
292         }\r
293 .leaflet-bottom .leaflet-control-scale {\r
294         margin-bottom: 5px;\r
295         }\r
296 .leaflet-control-scale-line {\r
297         border: 2px solid #777;\r
298         border-top: none;\r
299         color: black;\r
300         line-height: 1;\r
301         font-size: 10px;\r
302         padding-bottom: 2px;\r
303         text-shadow: 1px 1px 1px #fff;\r
304         background-color: rgba(255, 255, 255, 0.5);\r
305         }\r
306 .leaflet-control-scale-line:not(:first-child) {\r
307         border-top: 2px solid #777;\r
308         padding-top: 1px;\r
309         border-bottom: none;\r
310         margin-top: -2px;\r
311         }\r
312 .leaflet-control-scale-line:not(:first-child):not(:last-child) {\r
313         border-bottom: 2px solid #777;\r
314         }\r
315 \r
316 .leaflet-touch .leaflet-control-attribution, .leaflet-touch .leaflet-control-layers {\r
317         box-shadow: none;\r
318         }\r
319 .leaflet-touch .leaflet-control-layers {\r
320         border: 5px solid #bbb;\r
321         }\r
322 \r
323 \r
324 /* popup */\r
325 \r
326 .leaflet-popup {\r
327         position: absolute;\r
328         text-align: center;\r
329         }\r
330 .leaflet-popup-content-wrapper {\r
331         padding: 1px;\r
332         text-align: left;\r
333         -webkit-border-radius: 20px;\r
334                 border-radius: 20px;\r
335         }\r
336 .leaflet-popup-content {\r
337         margin: 14px 20px;\r
338         line-height: 1.4;\r
339         }\r
340 .leaflet-popup-content p {\r
341         margin: 18px 0;\r
342         }\r
343 .leaflet-popup-tip-container {\r
344         margin: 0 auto;\r
345         width: 40px;\r
346         height: 20px;\r
347         position: relative;\r
348         overflow: hidden;\r
349         }\r
350 .leaflet-popup-tip {\r
351         width: 15px;\r
352         height: 15px;\r
353         padding: 1px;\r
354 \r
355         margin: -8px auto 0;\r
356 \r
357         -webkit-transform: rotate(45deg);\r
358            -moz-transform: rotate(45deg);\r
359             -ms-transform: rotate(45deg);\r
360              -o-transform: rotate(45deg);\r
361                 transform: rotate(45deg);\r
362         }\r
363 .leaflet-popup-content-wrapper, .leaflet-popup-tip {\r
364         background: white;\r
365 \r
366         box-shadow: 0 3px 14px rgba(0,0,0,0.35);\r
367         -webkit-box-shadow: 0 3px 18px rgba(0,0,0,0.33);\r
368         }\r
369 .leaflet-container a.leaflet-popup-close-button {\r
370         position: absolute;\r
371         top: 0;\r
372         right: 0;\r
373         padding: 4px 5px 0 0;\r
374         text-align: center;\r
375         width: 18px;\r
376         height: 14px;\r
377         font: 16px/14px Tahoma, Verdana, sans-serif;\r
378         color: #c3c3c3;\r
379         text-decoration: none;\r
380         font-weight: bold;\r
381         }\r
382 .leaflet-container a.leaflet-popup-close-button:hover {\r
383         color: #999;\r
384         }\r
385 .leaflet-popup-scrolled {\r
386         overflow: auto;\r
387         border-bottom: 1px solid #ddd;\r
388         border-top: 1px solid #ddd;\r
389         }\r
390 \r
391 \r
392 /* div icon */\r
393 \r
394 .leaflet-div-icon {\r
395         background: #fff;\r
396         border: 1px solid #666;\r
397         }\r
398 .leaflet-editing-icon {\r
399         -webkit-border-radius: 2px;\r
400                 border-radius: 2px;\r
401         }\r