mapbox-rails 1.6.1.1 → 2.3.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,948 +0,0 @@
1
- /* general typography */
2
-
3
- .leaflet-container {
4
- background: #fff;
5
- font: 15px/25px 'Helvetica Neue', Arial, Helvetica, sans-serif;
6
- color: #404040;
7
- color: rgba(0, 0, 0, 0.75);
8
- outline: 0;
9
- overflow: hidden;
10
- -ms-touch-action: none;
11
- * {
12
- -webkit-box-sizing: border-box;
13
- -moz-box-sizing: border-box;
14
- box-sizing: border-box;
15
- &:after, &:before {
16
- -webkit-box-sizing: border-box;
17
- -moz-box-sizing: border-box;
18
- box-sizing: border-box;
19
- }
20
- }
21
- h1, h2, h3, h4, h5, h6, p {
22
- font-size: 15px;
23
- line-height: 25px;
24
- margin: 0 0 10px;
25
- }
26
- }
27
-
28
- .mapbox-small, .leaflet-control-attribution, .leaflet-control-scale {
29
- font-size: 12px;
30
- line-height: 20px;
31
- }
32
-
33
- .leaflet-container {
34
- input, textarea, label, small {
35
- font-size: 12px;
36
- line-height: 20px;
37
- }
38
- a {
39
- color: #3887BE;
40
- font-weight: normal;
41
- text-decoration: none;
42
- &:hover {
43
- color: #63b6e5;
44
- }
45
- }
46
- &.dark {
47
- a {
48
- color: #63b6e5;
49
- &:hover {
50
- color: #8fcaec;
51
- }
52
- }
53
- .mapbox-button {
54
- background-color: #3887be;
55
- display: inline-block;
56
- height: 40px;
57
- line-height: 40px;
58
- text-decoration: none;
59
- color: #fff;
60
- font-size: 12px;
61
- white-space: nowrap;
62
- text-overflow: ellipsis;
63
- }
64
- }
65
- .mapbox-button {
66
- background-color: #3887be;
67
- display: inline-block;
68
- height: 40px;
69
- line-height: 40px;
70
- text-decoration: none;
71
- color: #fff;
72
- font-size: 12px;
73
- white-space: nowrap;
74
- text-overflow: ellipsis;
75
- }
76
- &.dark .mapbox-button:hover, .mapbox-button:hover {
77
- color: #fff;
78
- background-color: #3bb2d0;
79
- }
80
- }
81
-
82
- /* Base Leaflet
83
- ------------------------------------------------------- */
84
-
85
- .leaflet-map-pane, .leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow, .leaflet-tile-pane, .leaflet-tile-container, .leaflet-overlay-pane, .leaflet-shadow-pane, .leaflet-marker-pane, .leaflet-popup-pane, .leaflet-overlay-pane svg, .leaflet-zoom-box, .leaflet-image-layer, .leaflet-layer {
86
- position: absolute;
87
- left: 0;
88
- top: 0;
89
- }
90
-
91
- .leaflet-tile, .leaflet-marker-icon, .leaflet-marker-shadow {
92
- -webkit-user-drag: none;
93
- -webkit-user-select: none;
94
- -moz-user-select: none;
95
- user-select: none;
96
- }
97
-
98
- .leaflet-marker-icon, .leaflet-marker-shadow {
99
- display: block;
100
- }
101
-
102
- .leaflet-tile {
103
- filter: inherit;
104
- visibility: hidden;
105
- }
106
-
107
- .leaflet-tile-loaded {
108
- visibility: inherit;
109
- }
110
-
111
- .leaflet-zoom-box {
112
- width: 0;
113
- height: 0;
114
- }
115
-
116
- .leaflet-tile-pane {
117
- z-index: 2;
118
- }
119
-
120
- .leaflet-objects-pane {
121
- z-index: 3;
122
- }
123
-
124
- .leaflet-overlay-pane {
125
- z-index: 4;
126
- }
127
-
128
- .leaflet-shadow-pane {
129
- z-index: 5;
130
- }
131
-
132
- .leaflet-marker-pane {
133
- z-index: 6;
134
- }
135
-
136
- .leaflet-popup-pane {
137
- z-index: 7;
138
- }
139
-
140
- .leaflet-control {
141
- position: relative;
142
- z-index: 7;
143
- pointer-events: auto;
144
- float: left;
145
- clear: both;
146
- }
147
-
148
- .leaflet-right .leaflet-control {
149
- float: right;
150
- }
151
-
152
- .leaflet-top .leaflet-control {
153
- margin-top: 10px;
154
- }
155
-
156
- .leaflet-bottom .leaflet-control {
157
- margin-bottom: 10px;
158
- }
159
-
160
- .leaflet-left .leaflet-control {
161
- margin-left: 10px;
162
- }
163
-
164
- .leaflet-right .leaflet-control {
165
- margin-right: 10px;
166
- }
167
-
168
- .leaflet-top, .leaflet-bottom {
169
- position: absolute;
170
- z-index: 1000;
171
- pointer-events: none;
172
- }
173
-
174
- .leaflet-top {
175
- top: 0;
176
- }
177
-
178
- .leaflet-right {
179
- right: 0;
180
- }
181
-
182
- .leaflet-bottom {
183
- bottom: 0;
184
- }
185
-
186
- .leaflet-left {
187
- left: 0;
188
- }
189
-
190
- /* zoom and fade animations */
191
-
192
- .leaflet-fade-anim {
193
- .leaflet-tile, .leaflet-popup {
194
- opacity: 0;
195
- -webkit-transition: opacity 0.2s linear;
196
- -moz-transition: opacity 0.2s linear;
197
- -o-transition: opacity 0.2s linear;
198
- transition: opacity 0.2s linear;
199
- }
200
- .leaflet-tile-loaded, .leaflet-map-pane .leaflet-popup {
201
- opacity: 1;
202
- }
203
- }
204
-
205
- .leaflet-zoom-anim {
206
- .leaflet-zoom-animated {
207
- -webkit-transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
208
- -moz-transition: -moz-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
209
- -o-transition: -o-transform 0.25s cubic-bezier(0, 0, 0.25, 1);
210
- transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1);
211
- }
212
- .leaflet-tile {
213
- -webkit-transition: none;
214
- -moz-transition: none;
215
- -o-transition: none;
216
- transition: none;
217
- }
218
- }
219
-
220
- .leaflet-pan-anim .leaflet-tile, .leaflet-touching .leaflet-zoom-animated {
221
- -webkit-transition: none;
222
- -moz-transition: none;
223
- -o-transition: none;
224
- transition: none;
225
- }
226
-
227
- .leaflet-zoom-anim .leaflet-zoom-hide {
228
- visibility: hidden;
229
- }
230
-
231
- /* cursors */
232
-
233
- .map-clickable, .leaflet-clickable {
234
- cursor: pointer;
235
- }
236
-
237
- .leaflet-popup-pane, .leaflet-control {
238
- cursor: auto;
239
- }
240
-
241
- .leaflet-container {
242
- cursor: -webkit-grab;
243
- cursor: -moz-grab;
244
- }
245
-
246
- .leaflet-dragging {
247
- cursor: move;
248
- cursor: -webkit-grabbing;
249
- cursor: -moz-grabbing;
250
- .map-clickable, .leaflet-clickable, .leaflet-container {
251
- cursor: move;
252
- cursor: -webkit-grabbing;
253
- cursor: -moz-grabbing;
254
- }
255
- }
256
-
257
- .leaflet-zoom-box {
258
- background: #fff;
259
- border: 2px dotted #202020;
260
- opacity: 0.5;
261
- }
262
-
263
- /* general toolbar styles */
264
-
265
- .leaflet-control-layers {
266
- background-color: #fff;
267
- border: 1px solid #999;
268
- border-color: rgba(0, 0, 0, 0.4);
269
- border-radius: 3px;
270
- box-shadow: none;
271
- }
272
-
273
- .leaflet-bar {
274
- background-color: #fff;
275
- border: 1px solid #999;
276
- border-color: rgba(0, 0, 0, 0.4);
277
- border-radius: 3px;
278
- box-shadow: none;
279
- a {
280
- color: #404040;
281
- color: rgba(0, 0, 0, 0.75);
282
- border-bottom: 1px solid #ddd;
283
- border-bottom-color: rgba(0, 0, 0, 0.1);
284
- &:hover {
285
- color: #404040;
286
- color: rgba(0, 0, 0, 0.75);
287
- border-bottom: 1px solid #ddd;
288
- border-bottom-color: rgba(0, 0, 0, 0.1);
289
- background-color: #f8f8f8;
290
- cursor: pointer;
291
- }
292
- &:active {
293
- background-color: #f8f8f8;
294
- cursor: pointer;
295
- }
296
- &:first-child {
297
- border-radius: 3px 3px 0 0;
298
- }
299
- &:last-child {
300
- border-bottom: none;
301
- border-radius: 0 0 3px 3px;
302
- }
303
- &:only-of-type {
304
- border-radius: 3px;
305
- }
306
- }
307
- .leaflet-disabled {
308
- cursor: default;
309
- opacity: 0.75;
310
- }
311
- }
312
-
313
- .leaflet-control-zoom-in, .leaflet-control-zoom-out {
314
- display: block;
315
- content: '';
316
- text-indent: -999em;
317
- }
318
-
319
- .leaflet-control-layers .leaflet-control-layers-list {
320
- display: none;
321
- }
322
-
323
- .leaflet-control-layers-expanded {
324
- .leaflet-control-layers-toggle {
325
- display: none;
326
- }
327
- .leaflet-control-layers-list {
328
- display: block;
329
- position: relative;
330
- }
331
- background: #fff;
332
- padding: 6px 10px 6px 6px;
333
- color: #404040;
334
- color: rgba(0, 0, 0, 0.75);
335
- }
336
-
337
- .leaflet-control-layers-selector {
338
- margin-top: 2px;
339
- position: relative;
340
- top: 1px;
341
- }
342
-
343
- .leaflet-control-layers label {
344
- display: block;
345
- }
346
-
347
- .leaflet-control-layers-separator {
348
- height: 0;
349
- border-top: 1px solid #ddd;
350
- border-top-color: rgba(0, 0, 0, 0.1);
351
- margin: 5px -10px 5px -6px;
352
- }
353
-
354
- .leaflet-container .leaflet-control-attribution {
355
- background-color: rgba(255, 255, 255, 0.25);
356
- margin: 0;
357
- box-shadow: none;
358
- }
359
-
360
- .leaflet-control-attribution a:hover, .map-info-container a:hover {
361
- color: inherit;
362
- text-decoration: underline;
363
- }
364
-
365
- .leaflet-control-attribution, .leaflet-control-scale-line {
366
- padding: 0 5px;
367
- }
368
-
369
- .leaflet-left .leaflet-control-scale {
370
- margin-left: 5px;
371
- }
372
-
373
- .leaflet-bottom .leaflet-control-scale {
374
- margin-bottom: 5px;
375
- }
376
-
377
- .leaflet-control-scale-line {
378
- background-color: rgba(255, 255, 255, 0.5);
379
- border: 1px solid #999;
380
- border-color: rgba(0, 0, 0, 0.4);
381
- border-top: none;
382
- padding: 2px 5px 1px;
383
- white-space: nowrap;
384
- overflow: hidden;
385
- &:not(:first-child) {
386
- border-top: 2px solid #ddd;
387
- border-top-color: rgba(0, 0, 0, 0.1);
388
- border-bottom: none;
389
- margin-top: -2px;
390
- &:not(:last-child) {
391
- border-bottom: 2px solid #777;
392
- }
393
- }
394
- }
395
-
396
- /* popup */
397
-
398
- .leaflet-popup {
399
- position: absolute;
400
- text-align: center;
401
- pointer-events: none;
402
- }
403
-
404
- .leaflet-popup-content-wrapper {
405
- padding: 1px;
406
- text-align: left;
407
- pointer-events: all;
408
- }
409
-
410
- .leaflet-popup-content {
411
- padding: 10px 10px 15px;
412
- margin: 0;
413
- line-height: inherit;
414
- }
415
-
416
- .leaflet-popup-tip-container {
417
- width: 20px;
418
- height: 20px;
419
- margin: 0 auto;
420
- position: relative;
421
- }
422
-
423
- .leaflet-popup-tip {
424
- width: 0;
425
- height: 0;
426
- margin: 0;
427
- border-left: 10px solid transparent;
428
- border-right: 10px solid transparent;
429
- border-top: 10px solid #fff;
430
- box-shadow: none;
431
- }
432
-
433
- .leaflet-popup-close-button {
434
- text-indent: -999em;
435
- position: absolute;
436
- top: 0;
437
- right: 0;
438
- pointer-events: all;
439
- &:hover {
440
- background-color: #f8f8f8;
441
- }
442
- }
443
-
444
- .leaflet-popup-scrolled {
445
- overflow: auto;
446
- border-bottom: 1px solid #ddd;
447
- border-top: 1px solid #ddd;
448
- }
449
-
450
- /* div icon */
451
-
452
- .leaflet-div-icon {
453
- background: #fff;
454
- border: 1px solid #999;
455
- border-color: rgba(0, 0, 0, 0.4);
456
- }
457
-
458
- .leaflet-editing-icon {
459
- border-radius: 3px;
460
- }
461
-
462
- /* Leaflet + Mapbox
463
- ------------------------------------------------------- */
464
-
465
- .leaflet-bar a, .mapbox-icon, .map-tooltip.closable .close, .leaflet-control-layers-toggle, .leaflet-popup-close-button, .mapbox-button-icon:before {
466
- content: '';
467
- display: inline-block;
468
- width: 26px;
469
- height: 26px;
470
- vertical-align: middle;
471
- background-repeat: no-repeat;
472
- }
473
-
474
- .leaflet-bar a {
475
- display: block;
476
- }
477
-
478
- .leaflet-control-zoom-in, .leaflet-control-zoom-out, .leaflet-popup-close-button, .leaflet-control-layers-toggle, .leaflet-container.dark .map-tooltip .close, .map-tooltip .close, .mapbox-icon {
479
- opacity: .75;
480
- background-image: image-url('icons-000000.png');
481
- background-repeat: no-repeat;
482
- background-size: 26px 260px;
483
- }
484
-
485
- .mapbox-button-icon:before {
486
- opacity: 1;
487
- background-image: image-url('icons-ffffff.png');
488
- background-size: 26px 260px;
489
- }
490
-
491
- .leaflet-container.dark {
492
- .leaflet-control-zoom-in, .leaflet-control-zoom-out, .leaflet-control-layers-toggle, .mapbox-icon {
493
- opacity: 1;
494
- background-image: image-url('icons-ffffff.png');
495
- background-size: 26px 260px;
496
- }
497
- }
498
-
499
- .leaflet-bar {
500
- .leaflet-control-zoom-in {
501
- background-position: 0 0;
502
- }
503
- .leaflet-control-zoom-out {
504
- background-position: 0 -26px;
505
- }
506
- }
507
-
508
- .map-tooltip .close, .leaflet-popup-close-button {
509
- background-position: 0 -52px;
510
- }
511
-
512
- .mapbox-icon-info {
513
- background-position: 0 -78px;
514
- }
515
-
516
- .leaflet-control-layers-toggle {
517
- background-position: 0 -104px;
518
- }
519
-
520
- .mapbox-icon-share {
521
- &:before {
522
- background-position: 0 -130px;
523
- }
524
- background-position: 0 -130px;
525
- }
526
-
527
- .mapbox-icon-geocoder {
528
- &:before {
529
- background-position: 0 -156px;
530
- }
531
- background-position: 0 -156px;
532
- }
533
-
534
- .mapbox-icon-facebook {
535
- &:before {
536
- background-position: 0 -182px;
537
- }
538
- background-position: 0 -182px;
539
- }
540
-
541
- .mapbox-icon-twitter {
542
- &:before {
543
- background-position: 0 -208px;
544
- }
545
- background-position: 0 -208px;
546
- }
547
-
548
- .mapbox-icon-pinterest {
549
- &:before {
550
- background-position: 0 -234px;
551
- }
552
- background-position: 0 -234px;
553
- }
554
-
555
- @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
556
- .leaflet-control-zoom-in, .leaflet-control-zoom-out, .leaflet-popup-close-button, .leaflet-control-layers-toggle, .mapbox-icon {
557
- background-image: image-url('icons-000000@2x.png');
558
- }
559
- .mapbox-button-icon:before {
560
- background-image: image-url('icons-ffffff@2x.png');
561
- }
562
- .leaflet-container.dark {
563
- .leaflet-control-zoom-in, .leaflet-control-zoom-out, .leaflet-control-layers-toggle, .mapbox-icon {
564
- background-image: image-url('icons-ffffff@2x.png');
565
- }
566
- }
567
- }
568
-
569
- .leaflet-popup-content-wrapper, .map-legends, .map-tooltip {
570
- background: #fff;
571
- border-radius: 3px;
572
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
573
- }
574
-
575
- .map-legends, .map-tooltip {
576
- max-width: 300px;
577
- }
578
-
579
- .map-legends .map-legend {
580
- padding: 10px;
581
- }
582
-
583
- .map-tooltip {
584
- z-index: 999999;
585
- padding: 10px;
586
- min-width: 180px;
587
- max-height: 400px;
588
- overflow: auto;
589
- opacity: 1;
590
- -webkit-transition: opacity 150ms;
591
- -moz-transition: opacity 150ms;
592
- -o-transition: opacity 150ms;
593
- transition: opacity 150ms;
594
- .close {
595
- text-indent: -999em;
596
- overflow: hidden;
597
- display: none;
598
- }
599
- &.closable .close {
600
- position: absolute;
601
- top: 0;
602
- right: 0;
603
- border-radius: 3px;
604
- &:active {
605
- background-color: #f8f8f8;
606
- }
607
- }
608
- }
609
-
610
- .leaflet-control-interaction {
611
- position: absolute;
612
- top: 10px;
613
- right: 10px;
614
- width: 300px;
615
- }
616
-
617
- .leaflet-popup-content .marker-title {
618
- font-weight: bold;
619
- }
620
-
621
- .leaflet-control .mapbox-button {
622
- background-color: #fff;
623
- border: 1px solid #ddd;
624
- border-color: rgba(0, 0, 0, 0.1);
625
- padding: 5px 10px;
626
- border-radius: 3px;
627
- }
628
-
629
- /* Share modal
630
- ------------------------------------------------------- */
631
-
632
- .mapbox-modal {
633
- > div {
634
- position: absolute;
635
- top: 0;
636
- left: 0;
637
- width: 100%;
638
- height: 100%;
639
- z-index: -1;
640
- overflow-y: auto;
641
- }
642
- &.active > div {
643
- z-index: 99999;
644
- transition: all .2s, z-index 0 0;
645
- }
646
- .mapbox-modal-mask {
647
- background: rgba(0, 0, 0, 0.5);
648
- opacity: 0;
649
- }
650
- &.active .mapbox-modal-mask {
651
- opacity: 1;
652
- }
653
- .mapbox-modal-content {
654
- -webkit-transform: translateY(-100%);
655
- -moz-transform: translateY(-100%);
656
- -ms-transform: translateY(-100%);
657
- transform: translateY(-100%);
658
- }
659
- &.active .mapbox-modal-content {
660
- -webkit-transform: translateY(0);
661
- -moz-transform: translateY(0);
662
- -ms-transform: translateY(0);
663
- transform: translateY(0);
664
- }
665
- }
666
-
667
- .mapbox-modal-body {
668
- position: relative;
669
- background: #fff;
670
- padding: 20px;
671
- z-index: 1000;
672
- width: 50%;
673
- margin: 20px 0 20px 25%;
674
- }
675
-
676
- .mapbox-share-buttons {
677
- margin: 0 0 20px;
678
- a {
679
- width: 33.3333%;
680
- border-left: 1px solid #fff;
681
- text-align: center;
682
- border-radius: 0;
683
- &:last-child {
684
- border-radius: 0 3px 3px 0;
685
- }
686
- &:first-child {
687
- border: none;
688
- border-radius: 3px 0 0 3px;
689
- }
690
- }
691
- }
692
-
693
- .mapbox-modal input {
694
- width: 100%;
695
- height: 40px;
696
- padding: 10px;
697
- border: 1px solid #ddd;
698
- border-color: rgba(0, 0, 0, 0.1);
699
- color: rgba(0, 0, 0, 0.5);
700
- }
701
-
702
- /* Info Control
703
- ------------------------------------------------------- */
704
-
705
- .leaflet-control {
706
- &.mapbox-control-info {
707
- margin: 5px 30px 10px 10px;
708
- min-height: 26px;
709
- }
710
- &.mapbox-control-info-right {
711
- margin: 5px 10px 10px 30px;
712
- }
713
- }
714
-
715
- .mapbox-info-toggle {
716
- background-color: #fff;
717
- background-color: rgba(255, 255, 255, 0.5);
718
- border-radius: 50%;
719
- position: absolute;
720
- bottom: 0;
721
- left: 0;
722
- z-index: 1;
723
- }
724
-
725
- .mapbox-control-info-right .mapbox-info-toggle {
726
- left: auto;
727
- right: 0;
728
- }
729
-
730
- .mapbox-info-toggle:hover {
731
- background-color: #fff;
732
- }
733
-
734
- .map-info-container {
735
- background: #fff;
736
- padding: 3px 5px 3px 27px;
737
- display: none;
738
- position: relative;
739
- bottom: 0;
740
- left: 0;
741
- border-radius: 13px 3px 3px 13px;
742
- }
743
-
744
- .mapbox-control-info.active .map-info-container {
745
- display: inline-block;
746
- }
747
-
748
- .mapbox-control-info-right .map-info-container {
749
- left: auto;
750
- right: 0;
751
- padding: 3px 27px 3px 5px;
752
- border-radius: 3px 13px 13px 3px;
753
- }
754
-
755
- /* Geocoder
756
- ------------------------------------------------------- */
757
-
758
- .leaflet-control-mapbox-geocoder {
759
- position: relative;
760
- &.searching {
761
- opacity: 0.75;
762
- }
763
- .leaflet-control-mapbox-geocoder-wrap {
764
- background: #fff;
765
- position: absolute;
766
- border: 1px solid #999;
767
- border-color: rgba(0, 0, 0, 0.4);
768
- border-bottom-width: 0;
769
- overflow: hidden;
770
- left: 26px;
771
- height: 27px;
772
- width: 0;
773
- top: -1px;
774
- border-radius: 0 3px 3px 0;
775
- opacity: 0;
776
- -webkit-transition: opacity 100ms;
777
- -moz-transition: opacity 100ms;
778
- -o-transition: opacity 100ms;
779
- transition: opacity 100ms;
780
- }
781
- &.active .leaflet-control-mapbox-geocoder-wrap {
782
- width: 180px;
783
- opacity: 1;
784
- }
785
- }
786
-
787
- .leaflet-bar .leaflet-control-mapbox-geocoder-toggle {
788
- border-bottom: none;
789
- &:hover {
790
- border-bottom: none;
791
- }
792
- }
793
-
794
- .leaflet-control-mapbox-geocoder-toggle {
795
- border-radius: 3px;
796
- }
797
-
798
- .leaflet-control-mapbox-geocoder {
799
- &.active {
800
- border-top-right-radius: 0;
801
- border-bottom-right-radius: 0;
802
- .leaflet-control-mapbox-geocoder-toggle {
803
- border-top-right-radius: 0;
804
- border-bottom-right-radius: 0;
805
- }
806
- }
807
- .leaflet-control-mapbox-geocoder-form input {
808
- background: transparent;
809
- border: 0;
810
- width: 180px;
811
- padding: 0 0 0 10px;
812
- height: 26px;
813
- outline: none;
814
- }
815
- }
816
-
817
- .leaflet-control-mapbox-geocoder-results {
818
- width: 180px;
819
- position: absolute;
820
- left: 26px;
821
- top: 25px;
822
- border-radius: 0 0 3px 3px;
823
- }
824
-
825
- .leaflet-control-mapbox-geocoder.active .leaflet-control-mapbox-geocoder-results {
826
- background: #fff;
827
- border: 1px solid #999;
828
- border-color: rgba(0, 0, 0, 0.4);
829
- }
830
-
831
- .leaflet-control-mapbox-geocoder-results {
832
- a, span {
833
- padding: 0 10px;
834
- text-overflow: ellipsis;
835
- white-space: nowrap;
836
- display: block;
837
- width: 100%;
838
- font-size: 12px;
839
- line-height: 26px;
840
- text-align: left;
841
- overflow: hidden;
842
- }
843
- a:first-child {
844
- border-top: 1px solid #999;
845
- border-top-color: rgba(0, 0, 0, 0.4);
846
- border-radius: 0;
847
- }
848
- }
849
-
850
- .leaflet-container.dark .leaflet-control .leaflet-control-mapbox-geocoder-results a:hover, .leaflet-control-mapbox-geocoder-results a:hover {
851
- background: #f8f8f8;
852
- opacity: 1;
853
- }
854
-
855
- /* Dark Theme
856
- ------------------------------------------------------- */
857
-
858
- .leaflet-container {
859
- &.dark {
860
- .leaflet-bar {
861
- background-color: #404040;
862
- border-color: #202020;
863
- border-color: rgba(0, 0, 0, 0.75);
864
- a {
865
- color: #404040;
866
- border-color: rgba(0, 0, 0, 0.5);
867
- &:active, &:hover {
868
- background-color: #505050;
869
- }
870
- }
871
- }
872
- .mapbox-info-toggle, .map-info-container, .leaflet-control-attribution {
873
- background-color: rgba(0, 0, 0, 0.25);
874
- color: #f8f8f8;
875
- }
876
- .leaflet-bar a.leaflet-disabled, .leaflet-control .mapbox-button.disabled {
877
- background-color: #252525;
878
- color: #404040;
879
- }
880
- .leaflet-control-mapbox-geocoder > div {
881
- border-color: #202020;
882
- border-color: rgba(0, 0, 0, 0.75);
883
- }
884
- .leaflet-control .leaflet-control-mapbox-geocoder-results {
885
- a {
886
- border-color: #ddd #202020;
887
- border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.75);
888
- }
889
- span {
890
- border-color: #202020;
891
- border-color: rgba(0, 0, 0, 0.75);
892
- }
893
- }
894
- }
895
- img {
896
- max-width: none !important;
897
- &.leaflet-image-layer {
898
- max-width: 15000px !important;
899
- }
900
- }
901
- }
902
-
903
- /* Larger Screens
904
- ------------------------------------------------------- */
905
- @media only screen and (max-width: 800px) {
906
- .mapbox-modal-body {
907
- width: 83.3333%;
908
- margin-left: 8.3333%;
909
- }
910
- }
911
-
912
- /* Smaller Screens
913
- ------------------------------------------------------- */
914
- @media only screen and (max-width: 640px) {
915
- .mapbox-modal-body {
916
- width: 100%;
917
- height: 100%;
918
- margin: 0;
919
- }
920
- }
921
-
922
- /* Browser Fixes
923
- ------------------------------------------------------- */
924
- /* Map is broken in FF if you have max-width: 100% on tiles */
925
-
926
- /* Stupid Android 2 doesn't understand "max-width: none" properly */
927
-
928
- /* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
929
-
930
- .leaflet-overlay-pane svg {
931
- -moz-user-select: none;
932
- }
933
-
934
- /* Older IEs don't support the translateY property for display animation */
935
-
936
- .leaflet-oldie .mapbox-modal {
937
- .mapbox-modal-content {
938
- display: none;
939
- }
940
- &.active .mapbox-modal-content {
941
- display: block;
942
- }
943
- }
944
-
945
- .map-tooltip {
946
- width: 280px\8;
947
- /* < IE9 */
948
- }