source: binary-improvements/webserver/leaflet/leaflet.css@ 336

Last change on this file since 336 was 315, checked in by alloc, 7 years ago

Fixes

  • Property svn:executable set to *
File size: 13.7 KB
RevLine 
[133]1/* required styles */
2
[315]3.leaflet-pane,
[133]4.leaflet-tile,
5.leaflet-marker-icon,
6.leaflet-marker-shadow,
7.leaflet-tile-container,
[315]8.leaflet-pane > svg,
9.leaflet-pane > canvas,
[133]10.leaflet-zoom-box,
11.leaflet-image-layer,
12.leaflet-layer {
13 position: absolute;
14 left: 0;
15 top: 0;
16 }
17.leaflet-container {
18 overflow: hidden;
19 }
20.leaflet-tile,
21.leaflet-marker-icon,
22.leaflet-marker-shadow {
23 -webkit-user-select: none;
24 -moz-user-select: none;
25 user-select: none;
[315]26 -webkit-user-drag: none;
[133]27 }
[315]28/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
29.leaflet-safari .leaflet-tile {
30 image-rendering: -webkit-optimize-contrast;
31 }
32/* hack that prevents hw layers "stretching" when loading new tiles */
33.leaflet-safari .leaflet-tile-container {
34 width: 1600px;
35 height: 1600px;
36 -webkit-transform-origin: 0 0;
37 }
[133]38.leaflet-marker-icon,
39.leaflet-marker-shadow {
40 display: block;
41 }
[315]42/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
43/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
44.leaflet-container .leaflet-overlay-pane svg,
45.leaflet-container .leaflet-marker-pane img,
46.leaflet-container .leaflet-shadow-pane img,
47.leaflet-container .leaflet-tile-pane img,
48.leaflet-container img.leaflet-image-layer {
[133]49 max-width: none !important;
50 }
[315]51
52.leaflet-container.leaflet-touch-zoom {
53 -ms-touch-action: pan-x pan-y;
54 touch-action: pan-x pan-y;
[133]55 }
[315]56.leaflet-container.leaflet-touch-drag {
57 -ms-touch-action: pinch-zoom;
58 }
59.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
60 -ms-touch-action: none;
61 touch-action: none;
62}
63.leaflet-container {
64 -webkit-tap-highlight-color: transparent;
65}
66.leaflet-container a {
67 -webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
68}
[133]69.leaflet-tile {
70 filter: inherit;
71 visibility: hidden;
72 }
73.leaflet-tile-loaded {
74 visibility: inherit;
75 }
76.leaflet-zoom-box {
77 width: 0;
78 height: 0;
[315]79 -moz-box-sizing: border-box;
80 box-sizing: border-box;
81 z-index: 800;
[133]82 }
83/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
84.leaflet-overlay-pane svg {
85 -moz-user-select: none;
86 }
87
[315]88.leaflet-pane { z-index: 400; }
[133]89
[315]90.leaflet-tile-pane { z-index: 200; }
91.leaflet-overlay-pane { z-index: 400; }
92.leaflet-shadow-pane { z-index: 500; }
93.leaflet-marker-pane { z-index: 600; }
94.leaflet-tooltip-pane { z-index: 650; }
95.leaflet-popup-pane { z-index: 700; }
96
97.leaflet-map-pane canvas { z-index: 100; }
98.leaflet-map-pane svg { z-index: 200; }
99
[133]100.leaflet-vml-shape {
101 width: 1px;
102 height: 1px;
103 }
104.lvml {
105 behavior: url(#default#VML);
106 display: inline-block;
107 position: absolute;
108 }
109
110
111/* control positioning */
112
113.leaflet-control {
114 position: relative;
[315]115 z-index: 800;
116 pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
[133]117 pointer-events: auto;
118 }
119.leaflet-top,
120.leaflet-bottom {
121 position: absolute;
122 z-index: 1000;
123 pointer-events: none;
124 }
125.leaflet-top {
126 top: 0;
127 }
128.leaflet-right {
129 right: 0;
130 }
131.leaflet-bottom {
132 bottom: 0;
133 }
134.leaflet-left {
135 left: 0;
136 }
137.leaflet-control {
138 float: left;
139 clear: both;
140 }
141.leaflet-right .leaflet-control {
142 float: right;
143 }
144.leaflet-top .leaflet-control {
145 margin-top: 10px;
146 }
147.leaflet-bottom .leaflet-control {
148 margin-bottom: 10px;
149 }
150.leaflet-left .leaflet-control {
151 margin-left: 10px;
152 }
153.leaflet-right .leaflet-control {
154 margin-right: 10px;
155 }
156
157
158/* zoom and fade animations */
159
[315]160.leaflet-fade-anim .leaflet-tile {
161 will-change: opacity;
162 }
[133]163.leaflet-fade-anim .leaflet-popup {
164 opacity: 0;
165 -webkit-transition: opacity 0.2s linear;
166 -moz-transition: opacity 0.2s linear;
167 -o-transition: opacity 0.2s linear;
168 transition: opacity 0.2s linear;
169 }
170.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
171 opacity: 1;
172 }
[315]173.leaflet-zoom-animated {
174 -webkit-transform-origin: 0 0;
175 -ms-transform-origin: 0 0;
176 transform-origin: 0 0;
177 }
[133]178.leaflet-zoom-anim .leaflet-zoom-animated {
[315]179 will-change: transform;
180 }
181.leaflet-zoom-anim .leaflet-zoom-animated {
[133]182 -webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
183 -moz-transition: -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
184 -o-transition: -o-transform 0.25s cubic-bezier(0,0,0.25,1);
185 transition: transform 0.25s cubic-bezier(0,0,0.25,1);
186 }
187.leaflet-zoom-anim .leaflet-tile,
[315]188.leaflet-pan-anim .leaflet-tile {
[133]189 -webkit-transition: none;
190 -moz-transition: none;
191 -o-transition: none;
192 transition: none;
193 }
194
195.leaflet-zoom-anim .leaflet-zoom-hide {
196 visibility: hidden;
197 }
198
199
200/* cursors */
201
[315]202.leaflet-interactive {
[133]203 cursor: pointer;
204 }
[315]205.leaflet-grab {
[133]206 cursor: -webkit-grab;
207 cursor: -moz-grab;
208 }
[315]209.leaflet-crosshair,
210.leaflet-crosshair .leaflet-interactive {
211 cursor: crosshair;
212 }
[133]213.leaflet-popup-pane,
214.leaflet-control {
215 cursor: auto;
216 }
[315]217.leaflet-dragging .leaflet-grab,
218.leaflet-dragging .leaflet-grab .leaflet-interactive,
219.leaflet-dragging .leaflet-marker-draggable {
[133]220 cursor: move;
221 cursor: -webkit-grabbing;
222 cursor: -moz-grabbing;
223 }
224
[315]225/* marker & overlays interactivity */
226.leaflet-marker-icon,
227.leaflet-marker-shadow,
228.leaflet-image-layer,
229.leaflet-pane > svg path,
230.leaflet-tile-container {
231 pointer-events: none;
232 }
[133]233
[315]234.leaflet-marker-icon.leaflet-interactive,
235.leaflet-image-layer.leaflet-interactive,
236.leaflet-pane > svg path.leaflet-interactive {
237 pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
238 pointer-events: auto;
239 }
240
[133]241/* visual tweaks */
242
243.leaflet-container {
244 background: #ddd;
245 outline: 0;
246 }
247.leaflet-container a {
248 color: #0078A8;
249 }
250.leaflet-container a.leaflet-active {
251 outline: 2px solid orange;
252 }
253.leaflet-zoom-box {
254 border: 2px dotted #38f;
255 background: rgba(255,255,255,0.5);
256 }
257
258
259/* general typography */
260.leaflet-container {
261 font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
262 }
263
264
265/* general toolbar styles */
266
267.leaflet-bar {
268 box-shadow: 0 1px 5px rgba(0,0,0,0.65);
269 border-radius: 4px;
270 }
271.leaflet-bar a,
272.leaflet-bar a:hover {
273 background-color: #fff;
274 border-bottom: 1px solid #ccc;
275 width: 26px;
276 height: 26px;
277 line-height: 26px;
278 display: block;
279 text-align: center;
280 text-decoration: none;
281 color: black;
282 }
283.leaflet-bar a,
284.leaflet-control-layers-toggle {
285 background-position: 50% 50%;
286 background-repeat: no-repeat;
287 display: block;
288 }
289.leaflet-bar a:hover {
290 background-color: #f4f4f4;
291 }
292.leaflet-bar a:first-child {
293 border-top-left-radius: 4px;
294 border-top-right-radius: 4px;
295 }
296.leaflet-bar a:last-child {
297 border-bottom-left-radius: 4px;
298 border-bottom-right-radius: 4px;
299 border-bottom: none;
300 }
301.leaflet-bar a.leaflet-disabled {
302 cursor: default;
303 background-color: #f4f4f4;
304 color: #bbb;
305 }
306
307.leaflet-touch .leaflet-bar a {
308 width: 30px;
309 height: 30px;
310 line-height: 30px;
311 }
[315]312.leaflet-touch .leaflet-bar a:first-child {
313 border-top-left-radius: 2px;
314 border-top-right-radius: 2px;
315 }
316.leaflet-touch .leaflet-bar a:last-child {
317 border-bottom-left-radius: 2px;
318 border-bottom-right-radius: 2px;
319 }
[133]320
321/* zoom control */
322
323.leaflet-control-zoom-in,
324.leaflet-control-zoom-out {
325 font: bold 18px 'Lucida Console', Monaco, monospace;
326 text-indent: 1px;
327 }
328
[315]329.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out {
[133]330 font-size: 22px;
331 }
332
333
334/* layers control */
335
336.leaflet-control-layers {
337 box-shadow: 0 1px 5px rgba(0,0,0,0.4);
338 background: #fff;
339 border-radius: 5px;
340 }
341.leaflet-control-layers-toggle {
342 background-image: url(images/layers.png);
343 width: 36px;
344 height: 36px;
345 }
346.leaflet-retina .leaflet-control-layers-toggle {
347 background-image: url(images/layers-2x.png);
348 background-size: 26px 26px;
349 }
350.leaflet-touch .leaflet-control-layers-toggle {
351 width: 44px;
352 height: 44px;
353 }
354.leaflet-control-layers .leaflet-control-layers-list,
355.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
356 display: none;
357 }
358.leaflet-control-layers-expanded .leaflet-control-layers-list {
359 display: block;
360 position: relative;
361 }
362.leaflet-control-layers-expanded {
363 padding: 6px 10px 6px 6px;
364 color: #333;
365 background: #fff;
366 }
[315]367.leaflet-control-layers-scrollbar {
368 overflow-y: scroll;
369 overflow-x: hidden;
370 padding-right: 5px;
371 }
[133]372.leaflet-control-layers-selector {
373 margin-top: 2px;
374 position: relative;
375 top: 1px;
376 }
377.leaflet-control-layers label {
378 display: block;
379 }
380.leaflet-control-layers-separator {
381 height: 0;
382 border-top: 1px solid #ddd;
383 margin: 5px -10px 5px -6px;
384 }
385
[315]386/* Default icon URLs */
387.leaflet-default-icon-path {
388 background-image: url(images/marker-icon.png);
389 }
[133]390
[315]391
[133]392/* attribution and scale controls */
393
394.leaflet-container .leaflet-control-attribution {
395 background: #fff;
396 background: rgba(255, 255, 255, 0.7);
397 margin: 0;
398 }
399.leaflet-control-attribution,
400.leaflet-control-scale-line {
401 padding: 0 5px;
402 color: #333;
403 }
404.leaflet-control-attribution a {
405 text-decoration: none;
406 }
407.leaflet-control-attribution a:hover {
408 text-decoration: underline;
409 }
410.leaflet-container .leaflet-control-attribution,
411.leaflet-container .leaflet-control-scale {
412 font-size: 11px;
413 }
414.leaflet-left .leaflet-control-scale {
415 margin-left: 5px;
416 }
417.leaflet-bottom .leaflet-control-scale {
418 margin-bottom: 5px;
419 }
420.leaflet-control-scale-line {
421 border: 2px solid #777;
422 border-top: none;
423 line-height: 1.1;
424 padding: 2px 5px 1px;
425 font-size: 11px;
426 white-space: nowrap;
427 overflow: hidden;
[315]428 -moz-box-sizing: border-box;
429 box-sizing: border-box;
[133]430
431 background: #fff;
432 background: rgba(255, 255, 255, 0.5);
433 }
434.leaflet-control-scale-line:not(:first-child) {
435 border-top: 2px solid #777;
436 border-bottom: none;
437 margin-top: -2px;
438 }
439.leaflet-control-scale-line:not(:first-child):not(:last-child) {
440 border-bottom: 2px solid #777;
441 }
442
443.leaflet-touch .leaflet-control-attribution,
444.leaflet-touch .leaflet-control-layers,
445.leaflet-touch .leaflet-bar {
446 box-shadow: none;
447 }
448.leaflet-touch .leaflet-control-layers,
449.leaflet-touch .leaflet-bar {
450 border: 2px solid rgba(0,0,0,0.2);
451 background-clip: padding-box;
452 }
453
454
455/* popup */
456
457.leaflet-popup {
458 position: absolute;
459 text-align: center;
[315]460 margin-bottom: 20px;
[133]461 }
462.leaflet-popup-content-wrapper {
463 padding: 1px;
464 text-align: left;
465 border-radius: 12px;
466 }
467.leaflet-popup-content {
468 margin: 13px 19px;
469 line-height: 1.4;
470 }
471.leaflet-popup-content p {
472 margin: 18px 0;
473 }
474.leaflet-popup-tip-container {
475 width: 40px;
476 height: 20px;
[315]477 position: absolute;
478 left: 50%;
479 margin-left: -20px;
[133]480 overflow: hidden;
[315]481 pointer-events: none;
[133]482 }
483.leaflet-popup-tip {
484 width: 17px;
485 height: 17px;
486 padding: 1px;
487
488 margin: -10px auto 0;
489
490 -webkit-transform: rotate(45deg);
491 -moz-transform: rotate(45deg);
492 -ms-transform: rotate(45deg);
493 -o-transform: rotate(45deg);
494 transform: rotate(45deg);
495 }
496.leaflet-popup-content-wrapper,
497.leaflet-popup-tip {
498 background: white;
[315]499 color: #333;
[133]500 box-shadow: 0 3px 14px rgba(0,0,0,0.4);
501 }
502.leaflet-container a.leaflet-popup-close-button {
503 position: absolute;
504 top: 0;
505 right: 0;
506 padding: 4px 4px 0 0;
[315]507 border: none;
[133]508 text-align: center;
509 width: 18px;
510 height: 14px;
511 font: 16px/14px Tahoma, Verdana, sans-serif;
512 color: #c3c3c3;
513 text-decoration: none;
514 font-weight: bold;
515 background: transparent;
516 }
517.leaflet-container a.leaflet-popup-close-button:hover {
518 color: #999;
519 }
520.leaflet-popup-scrolled {
521 overflow: auto;
522 border-bottom: 1px solid #ddd;
523 border-top: 1px solid #ddd;
524 }
525
526.leaflet-oldie .leaflet-popup-content-wrapper {
527 zoom: 1;
528 }
529.leaflet-oldie .leaflet-popup-tip {
530 width: 24px;
531 margin: 0 auto;
532
533 -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
534 filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
535 }
536.leaflet-oldie .leaflet-popup-tip-container {
537 margin-top: -1px;
538 }
539
540.leaflet-oldie .leaflet-control-zoom,
541.leaflet-oldie .leaflet-control-layers,
542.leaflet-oldie .leaflet-popup-content-wrapper,
543.leaflet-oldie .leaflet-popup-tip {
544 border: 1px solid #999;
545 }
546
547
548/* div icon */
549
550.leaflet-div-icon {
551 background: #fff;
552 border: 1px solid #666;
553 }
[315]554
555
556/* Tooltip */
557/* Base styles for the element that has a tooltip */
558.leaflet-tooltip {
559 position: absolute;
560 padding: 6px;
561 background-color: #fff;
562 border: 1px solid #fff;
563 border-radius: 3px;
564 color: #222;
565 white-space: nowrap;
566 -webkit-user-select: none;
567 -moz-user-select: none;
568 -ms-user-select: none;
569 user-select: none;
570 pointer-events: none;
571 box-shadow: 0 1px 3px rgba(0,0,0,0.4);
572 }
573.leaflet-tooltip.leaflet-clickable {
574 cursor: pointer;
575 pointer-events: auto;
576 }
577.leaflet-tooltip-top:before,
578.leaflet-tooltip-bottom:before,
579.leaflet-tooltip-left:before,
580.leaflet-tooltip-right:before {
581 position: absolute;
582 pointer-events: none;
583 border: 6px solid transparent;
584 background: transparent;
585 content: "";
586 }
587
588/* Directions */
589
590.leaflet-tooltip-bottom {
591 margin-top: 6px;
592}
593.leaflet-tooltip-top {
594 margin-top: -6px;
595}
596.leaflet-tooltip-bottom:before,
597.leaflet-tooltip-top:before {
598 left: 50%;
599 margin-left: -6px;
600 }
601.leaflet-tooltip-top:before {
602 bottom: 0;
603 margin-bottom: -12px;
604 border-top-color: #fff;
605 }
606.leaflet-tooltip-bottom:before {
607 top: 0;
608 margin-top: -12px;
609 margin-left: -6px;
610 border-bottom-color: #fff;
611 }
612.leaflet-tooltip-left {
613 margin-left: -6px;
614}
615.leaflet-tooltip-right {
616 margin-left: 6px;
617}
618.leaflet-tooltip-left:before,
619.leaflet-tooltip-right:before {
620 top: 50%;
621 margin-top: -6px;
622 }
623.leaflet-tooltip-left:before {
624 right: 0;
625 margin-right: -12px;
626 border-left-color: #fff;
627 }
628.leaflet-tooltip-right:before {
629 left: 0;
630 margin-left: -12px;
631 border-right-color: #fff;
632 }
Note: See TracBrowser for help on using the repository browser.