@macrostrat/map-interface 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.css ADDED
@@ -0,0 +1,1103 @@
1
+ ._8hZKsW_searchbar-holder {
2
+ flex-direction: column;
3
+ margin: 0;
4
+ transition: margin .3s;
5
+ display: flex;
6
+ }
7
+
8
+ ._8hZKsW_searchbar-holder ._8hZKsW_navbar-holder {
9
+ flex-direction: row;
10
+ display: flex;
11
+ }
12
+
13
+ ._8hZKsW_searchbar-holder ._8hZKsW_searchbar {
14
+ width: 100%;
15
+ background-color: var(--panel-background-color);
16
+ border-radius: 3px;
17
+ flex-direction: row;
18
+ align-items: center;
19
+ padding: 0 5px;
20
+ display: flex;
21
+ }
22
+
23
+ ._8hZKsW_searchbar-holder ._8hZKsW_searchbar .bp4-input-group {
24
+ cursor: text;
25
+ flex-grow: 1;
26
+ }
27
+
28
+ ._8hZKsW_searchbar-holder ._8hZKsW_searchbar > * {
29
+ margin-right: 5px;
30
+ }
31
+
32
+ ._8hZKsW_searchbar-holder ._8hZKsW_searchbar > :last-child {
33
+ margin-right: 0;
34
+ }
35
+
36
+ ._8hZKsW_status-tongue {
37
+ background-color: var(--panel-background-color);
38
+ margin: -12px 5px 5px;
39
+ padding: 12px 0 0;
40
+ }
41
+
42
+ @media screen and (max-width: 768px) {
43
+ ._8hZKsW_status-tongue {
44
+ max-width: 100vw;
45
+ border-radius: 0;
46
+ margin: -3px 0 0;
47
+ }
48
+ }
49
+
50
+ .y-HzBG_recenter-button .bp4-icon:first-child {
51
+ margin-left: -3px;
52
+ margin-right: -3px;
53
+ }
54
+
55
+ .y-HzBG_recenter-button.y-HzBG_off-center .y-HzBG_recenter-label {
56
+ display: none;
57
+ }
58
+
59
+ .y-HzBG_recenter-button.y-HzBG_out-of-padding .y-HzBG_recenter-label {
60
+ opacity: .5;
61
+ }
62
+
63
+ .y-HzBG_recenter-label {
64
+ padding-left: 1em;
65
+ font-size: 12px;
66
+ font-style: italic;
67
+ display: inline-block;
68
+ }
69
+
70
+ .VPa3-W_copy-link-button.bp4-minimal.bp4-button {
71
+ color: var(--text-subtle-color);
72
+ }
73
+
74
+ .VPa3-W_copy-link-button.bp4-minimal.bp4-button svg {
75
+ fill: var(--text-subtle-color);
76
+ }
77
+
78
+ .VPa3-W_location-panel-header {
79
+ border-bottom: 1px solid var(--panel-rule-color);
80
+ flex-direction: row;
81
+ align-items: center;
82
+ gap: 1em;
83
+ padding: 5px;
84
+ display: flex;
85
+ }
86
+
87
+ .VPa3-W_location-panel-header .VPa3-W_spacer {
88
+ flex-grow: 1;
89
+ }
90
+
91
+ .VPa3-W_location-panel-header .VPa3-W_left-icon {
92
+ padding: 7px;
93
+ }
94
+
95
+ .VPa3-W_location-panel-header .VPa3-W_position-controls .bp4-button {
96
+ font-size: 12px !important;
97
+ }
98
+
99
+ .VPa3-W_infodrawer-header-item {
100
+ font-size: 12px;
101
+ }
102
+
103
+ .VPa3-W_infodrawer-header-item .secondary {
104
+ color: var(--text-subtle-color);
105
+ font-size: .9em;
106
+ }
107
+
108
+ .VPa3-W_infodrawer {
109
+ pointer-events: all;
110
+ max-height: 100%;
111
+ max-width: 100%;
112
+ height: fit-content;
113
+ flex-direction: column;
114
+ display: flex;
115
+ overflow: hidden;
116
+ }
117
+
118
+ .VPa3-W_infodrawer.bp4-card {
119
+ padding: 0;
120
+ }
121
+
122
+ .VPa3-W_infodrawer.VPa3-W_loading .VPa3-W_infodrawer-body {
123
+ min-height: 70px;
124
+ overflow-y: hidden;
125
+ }
126
+
127
+ .VPa3-W_infodrawer-body {
128
+ min-height: 0;
129
+ flex-shrink: 1;
130
+ transition: min-height .5s;
131
+ position: relative;
132
+ overflow-y: scroll;
133
+ }
134
+
135
+ @media screen and (max-width: 768px) {
136
+ .VPa3-W_infodrawer {
137
+ border-radius: var(--panel-border-radius, 0px);
138
+ }
139
+ }
140
+
141
+ ._39DLrq_json-view-container._39DLrq_root-hidden {
142
+ padding-left: .8em;
143
+ }
144
+
145
+ ._39DLrq_flex-row {
146
+ flex-direction: row;
147
+ display: flex;
148
+ }
149
+
150
+ ._39DLrq_flex-col {
151
+ flex-direction: column;
152
+ display: flex;
153
+ }
154
+
155
+ ._39DLrq_flex-spacer {
156
+ flex: 1;
157
+ }
158
+
159
+ .TW5XUq_mui-slider-disabled .TW5XUq_bp4-slider-handle {
160
+ display: none;
161
+ }
162
+
163
+ .TW5XUq_nullable-slider {
164
+ flex-direction: row;
165
+ align-items: center;
166
+ display: flex;
167
+ }
168
+
169
+ .TW5XUq_nullable-slider .TW5XUq_bp4-slider {
170
+ flex-grow: 1;
171
+ margin-left: 1em;
172
+ margin-right: 1em;
173
+ }
174
+
175
+ .TW5XUq_nullable-slider .TW5XUq_controls {
176
+ margin-top: -22px;
177
+ }
178
+
179
+ .TGPwIq_panel-header {
180
+ background-color: var(--panel-secondary-background-color, #eee);
181
+ border-bottom: 1px solid var(--panel-rule-color, #ddd);
182
+ flex-direction: row;
183
+ justify-content: space-between;
184
+ align-items: center;
185
+ padding: .2em .6em;
186
+ display: flex;
187
+ }
188
+
189
+ .TGPwIq_panel-header h1 {
190
+ font-size: var(--panel-header-font-size, 1.2em);
191
+ margin-top: .2em;
192
+ margin-bottom: .2em;
193
+ }
194
+
195
+ .TGPwIq_panel-header h1.TGPwIq_overflow-hidden {
196
+ white-space: nowrap;
197
+ text-overflow: ellipsis;
198
+ overflow: hidden;
199
+ }
200
+
201
+ .bp4-dark .TGPwIq_panel, .bp4-dark .TGPwIq_content-panel {
202
+ box-shadow: 0 0 0 1px #fff3, 0 0 #fff0, 0 1px 1px #fff6;
203
+ }
204
+
205
+ .TGPwIq_expander {
206
+ flex-grow: 1;
207
+ }
208
+
209
+ .TGPwIq_panel-column {
210
+ flex-grow: 1;
211
+ position: relative;
212
+ }
213
+
214
+ .TGPwIq_panel, .TGPwIq_content-panel {
215
+ background-color: var(--panel-background-color, #fff);
216
+ border-radius: 6px;
217
+ flex-direction: column;
218
+ display: flex;
219
+ overflow: hidden;
220
+ box-shadow: 0 0 0 1px #10161a33, 0 0 #10161a00, 0 1px 1px #10161a66;
221
+ }
222
+
223
+ .TGPwIq_content-panel {
224
+ padding: .5em;
225
+ }
226
+
227
+ .TGPwIq_panel {
228
+ height: 100%;
229
+ max-height: 100vh;
230
+ flex-shrink: 1;
231
+ }
232
+
233
+ .TGPwIq_panel.TGPwIq_minimal {
234
+ border-radius: 0;
235
+ }
236
+
237
+ .TGPwIq_panel.TGPwIq_minimal .TGPwIq_panel-content {
238
+ border-radius: 0;
239
+ padding: 0;
240
+ }
241
+
242
+ .TGPwIq_panel-content {
243
+ flex: 1;
244
+ padding: 1em;
245
+ overflow-y: scroll;
246
+ }
247
+
248
+ .TGPwIq_panel-content > :last-child {
249
+ margin-bottom: 1em;
250
+ }
251
+
252
+ .TGPwIq_panel-outer {
253
+ max-height: 100%;
254
+ flex-direction: column;
255
+ display: flex;
256
+ position: relative;
257
+ }
258
+
259
+ .TGPwIq_panel-container-inner {
260
+ flex-direction: column;
261
+ display: flex;
262
+ position: absolute;
263
+ inset: 2em 1em;
264
+ }
265
+
266
+ .TGPwIq_panel-container-inner .TGPwIq_expander {
267
+ flex: 1;
268
+ }
269
+
270
+ .TGPwIq_extra-space {
271
+ width: 1em;
272
+ }
273
+
274
+ .TGPwIq_panel-container {
275
+ height: 100vh;
276
+ flex-direction: column;
277
+ display: flex;
278
+ position: sticky;
279
+ top: 0;
280
+ }
281
+
282
+ .tBd70W_user-interface {
283
+ width: 100%;
284
+ height: 100%;
285
+ flex-direction: column;
286
+ display: flex;
287
+ position: absolute;
288
+ top: 0;
289
+ overflow: hidden;
290
+ }
291
+
292
+ .tBd70W_spacer {
293
+ width: 1em;
294
+ }
295
+
296
+ .tBd70W_three-column {
297
+ height: 100%;
298
+ flex-direction: row;
299
+ flex: 1;
300
+ display: flex;
301
+ position: relative;
302
+ overflow: hidden;
303
+ }
304
+
305
+ .tBd70W_three-column > div {
306
+ min-width: 50px;
307
+ height: 100%;
308
+ flex-shrink: 1;
309
+ position: relative;
310
+ overflow-y: scroll;
311
+ }
312
+
313
+ .tBd70W_three-column > div.tBd70W_main-column {
314
+ max-width: 100%;
315
+ flex-grow: 1;
316
+ }
317
+
318
+ .tBd70W_three-column > div.tBd70W_context-column.tBd70W_expanded {
319
+ max-width: 100%;
320
+ flex-grow: 2;
321
+ }
322
+
323
+ .map-page_4c0a66 {
324
+ width: 100%;
325
+ height: 100%;
326
+ flex-direction: column;
327
+ display: flex;
328
+ position: relative;
329
+ }
330
+
331
+ .map-page_4c0a66.fit-viewport_4c0a66 {
332
+ height: 100vh;
333
+ width: 100vw;
334
+ max-height: -webkit-fill-available;
335
+ }
336
+
337
+ .map-page_4c0a66 .compass-control_4c0a66 {
338
+ display: none;
339
+ }
340
+
341
+ .map-page_4c0a66.map-is-rotated_4c0a66 .compass-control_4c0a66 {
342
+ display: block;
343
+ }
344
+
345
+ .map-page_4c0a66 .map-3d-control_4c0a66 {
346
+ display: none;
347
+ }
348
+
349
+ .map-page_4c0a66.map-3d-available_4c0a66 .map-3d-control_4c0a66 {
350
+ display: block;
351
+ }
352
+
353
+ .map-page_4c0a66.map-is-rotated_4c0a66.map-3d-available_4c0a66 .map-3d-control_4c0a66, .map-page_4c0a66 .globe-control_4c0a66 {
354
+ display: none;
355
+ }
356
+
357
+ .map-page_4c0a66 .globe-control_4c0a66 svg {
358
+ color: var(--secondary-color);
359
+ }
360
+
361
+ .map-page_4c0a66.map-is-global_4c0a66 .globe-control_4c0a66 {
362
+ display: block;
363
+ }
364
+
365
+ .main-ui_4c0a66 {
366
+ max-height: 100%;
367
+ height: 100%;
368
+ box-shadow: 0 0 10px 4px var(--card-shadow-color);
369
+ flex-direction: column;
370
+ flex: 1;
371
+ display: flex;
372
+ position: relative;
373
+ }
374
+
375
+ .panel-card_4c0a66 {
376
+ background-color: var(--panel-background-color);
377
+ padding: 10px;
378
+ }
379
+
380
+ .panel-card_4c0a66 > :last-child {
381
+ margin-bottom: 0;
382
+ }
383
+
384
+ .bp4-dark .panel-card_4c0a66 {
385
+ background-color: var(--panel-background-color);
386
+ }
387
+
388
+ .context-stack_4c0a66 {
389
+ max-height: 100%;
390
+ flex-direction: column;
391
+ display: flex;
392
+ }
393
+
394
+ .context-stack_4c0a66 > div {
395
+ flex-shrink: 1;
396
+ }
397
+
398
+ .context-stack_4c0a66 > .searchbar_4c0a66 {
399
+ flex: 0;
400
+ }
401
+
402
+ .context-stack_4c0a66, .detail-stack_4c0a66 {
403
+ z-index: 100;
404
+ }
405
+
406
+ .panel-container_4c0a66 {
407
+ flex-direction: column;
408
+ display: flex;
409
+ }
410
+
411
+ .panel-container_4c0a66 > div {
412
+ pointer-events: all;
413
+ }
414
+
415
+ .panel-title_4c0a66 {
416
+ font-size: 16px;
417
+ }
418
+
419
+ .spacer_4c0a66 {
420
+ pointer-events: none;
421
+ flex-grow: 1;
422
+ }
423
+
424
+ .map-view-container_4c0a66 {
425
+ flex-grow: 1;
426
+ position: relative;
427
+ overflow: hidden;
428
+ }
429
+
430
+ .searchbar-holder_4c0a66 {
431
+ margin-bottom: .5em;
432
+ }
433
+
434
+ .right-panel_4c0a66 {
435
+ width: 24em;
436
+ }
437
+
438
+ .buttons_4c0a66 {
439
+ min-width: 0;
440
+ flex-direction: row;
441
+ flex: 1;
442
+ display: flex;
443
+ }
444
+
445
+ .tab-button_4c0a66 {
446
+ min-width: 40px;
447
+ text-align: right;
448
+ flex-shrink: 1;
449
+ overflow: hidden;
450
+ }
451
+
452
+ .tab-button_4c0a66 .bp4-button-text {
453
+ transition: all .2s .1s;
454
+ }
455
+
456
+ .menu-card_4c0a66.narrow-card_4c0a66 .panel-header_4c0a66:not(.minimal_4c0a66) .tab-button_4c0a66.bp4-active ~ .tab-button_4c0a66 .bp4-button-text {
457
+ width: 0;
458
+ opacity: 0;
459
+ margin-left: -7px;
460
+ }
461
+
462
+ .context-panel-leave_4c0a66 .menu-card_4c0a66 .panel-header_4c0a66 .tab-button_4c0a66 .bp4-button-text {
463
+ opacity: 0;
464
+ width: 0;
465
+ }
466
+
467
+ .narrow-card_4c0a66.narrow-enter_4c0a66 .panel-header_4c0a66 .buttons_4c0a66 {
468
+ margin-right: -500px;
469
+ }
470
+
471
+ .panel-header_4c0a66.minimal_4c0a66 .tab-button_4c0a66:not(:hover):not(.bp4-active) {
472
+ min-width: 30px;
473
+ width: 30px;
474
+ padding-left: 0;
475
+ padding-right: 0;
476
+ }
477
+
478
+ .panel-header_4c0a66.minimal_4c0a66 .tab-button_4c0a66:not(:hover) .bp4-button-text {
479
+ width: 0;
480
+ opacity: 0;
481
+ margin-left: -7px;
482
+ }
483
+
484
+ .menu-group_4c0a66 {
485
+ margin-top: .2em;
486
+ margin-bottom: .5em;
487
+ }
488
+
489
+ .menu-card_4c0a66 .bp4-text ul, .menu-card_4c0a66 .text-panel ul {
490
+ padding-left: 1em;
491
+ }
492
+
493
+ .menu-content_4c0a66 {
494
+ flex-direction: column;
495
+ margin-bottom: -8px;
496
+ display: flex;
497
+ }
498
+
499
+ .menu-content_4c0a66 .bp4-button-group_4c0a66 {
500
+ margin-bottom: 4px;
501
+ }
502
+
503
+ .menu-content_4c0a66 hr {
504
+ width: 100%;
505
+ }
506
+
507
+ #map {
508
+ position: absolute;
509
+ inset: 0;
510
+ }
511
+
512
+ #map .mapbox-compass, #map .mapbox-3d {
513
+ display: none;
514
+ }
515
+
516
+ .mapboxgl-ctrl.mapbox-3d.mapbox-control {
517
+ width: unset;
518
+ }
519
+
520
+ .mapboxgl-ctrl.mapbox-3d.mapbox-control button {
521
+ width: unset;
522
+ padding-inline: 4px;
523
+ }
524
+
525
+ .mapboxgl-canvas-container {
526
+ width: 100%;
527
+ height: 100%;
528
+ }
529
+
530
+ .mapboxgl-ctrl.mapboxgl-ctrl-attrib {
531
+ background-color: var(--translucent-panel-background-color) !important;
532
+ }
533
+
534
+ .mapboxgl-ctrl.mapboxgl-ctrl-attrib a {
535
+ color: var(--text-color);
536
+ }
537
+
538
+ .mapboxgl-marker svg path {
539
+ fill: var(--panel-background-color) !important;
540
+ }
541
+
542
+ .mapboxgl-marker svg circle {
543
+ fill: var(--secondary-color) !important;
544
+ }
545
+
546
+ .mapbox-control.mapbox-zoom {
547
+ background: var(--translucent-panel-background-inner);
548
+ }
549
+
550
+ .mapbox-control.mapbox-zoom svg {
551
+ fill: var(--text-color) !important;
552
+ }
553
+
554
+ .mapboxgl-ctrl-logo {
555
+ transform: scale(.9)translate(-8px, 2px);
556
+ }
557
+
558
+ .bp4-dark .mapboxgl-ctrl-logo {
559
+ filter: invert();
560
+ }
561
+
562
+ .mapboxgl-ctrl-group button + button {
563
+ border-top: 1px solid var(--panel-rule-color) !important;
564
+ }
565
+
566
+ .bp4-dark .mapboxgl-ctrl-group .mapboxgl-ctrl-icon {
567
+ filter: invert(40%);
568
+ }
569
+
570
+ .bp4-dark .mapboxgl-ctrl-group .mapboxgl-ctrl-icon:hover {
571
+ filter: invert(50%);
572
+ }
573
+
574
+ .mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon {
575
+ filter: invert(40%);
576
+ }
577
+
578
+ .mapboxgl-ctrl-geolocate .mapboxgl-ctrl-icon:hover {
579
+ filter: invert(50%);
580
+ }
581
+
582
+ .detail-stack_4c0a66 {
583
+ position: relative;
584
+ }
585
+
586
+ .main-ui_4c0a66.detail-panel-open_4c0a66 .zoom-control_4c0a66 {
587
+ opacity: 0;
588
+ display: none;
589
+ }
590
+
591
+ .zoom-control_4c0a66 {
592
+ width: 30px;
593
+ transition: opacity 1s ease-in-out;
594
+ position: absolute;
595
+ top: 0;
596
+ right: 0;
597
+ }
598
+
599
+ .main-ui_4c0a66.searching_4c0a66 .map-view-container_4c0a66 {
600
+ pointer-events: none;
601
+ }
602
+
603
+ .map-controls_4c0a66 {
604
+ flex-direction: row;
605
+ justify-content: right;
606
+ margin-bottom: 0;
607
+ display: flex;
608
+ }
609
+
610
+ .map-controls_4c0a66 > * {
611
+ margin-left: .5em;
612
+ }
613
+
614
+ .map-controls_4c0a66 .mapbox-control, .map-controls_4c0a66 .map-control-wrapper, .map-controls_4c0a66 .map-control_4c0a66 {
615
+ min-width: 22px;
616
+ min-height: 22px;
617
+ background-color: var(--panel-background-color);
618
+ box-shadow: 0 0 0 1px var(--card-shadow-color);
619
+ border-radius: 4px;
620
+ }
621
+
622
+ .map-controls_4c0a66 .mapbox-control button, .map-controls_4c0a66 .map-control-wrapper button, .map-controls_4c0a66 .map-control_4c0a66 button {
623
+ width: 22px;
624
+ height: 22px;
625
+ background-position: center;
626
+ background-color: var(--panel-background-color);
627
+ color: var(--text-color);
628
+ padding: 0;
629
+ }
630
+
631
+ .map-controls_4c0a66 .mapbox-control button:hover, .map-controls_4c0a66 .map-control-wrapper button:hover, .map-controls_4c0a66 .map-control_4c0a66 button:hover {
632
+ background-color: var(--panel-background-color) !important;
633
+ }
634
+
635
+ .map-controls_4c0a66 .map-scale-control_4c0a66 {
636
+ box-shadow: none;
637
+ background: none;
638
+ padding-top: 8px;
639
+ }
640
+
641
+ .map-controls_4c0a66 .map-scale-control_4c0a66 .mapboxgl-ctrl-scale {
642
+ background-color: var(--translucent-panel-background-color);
643
+ border-color: var(--secondary-text-color);
644
+ color: var(--secondary-text-color);
645
+ }
646
+
647
+ @media only screen and (max-width: 768px) {
648
+ .main-ui_4c0a66.detail-panel-enter_4c0a66 .context-stack_4c0a66 {
649
+ height: 0;
650
+ visibility: hidden;
651
+ transition: height .5s ease-in-out;
652
+ }
653
+
654
+ .detail-stack_4c0a66 {
655
+ height: fit-content;
656
+ position: inherit;
657
+ max-height: 70%;
658
+ }
659
+
660
+ .infodrawer-stack_4c0a66 {
661
+ max-height: 70%;
662
+ }
663
+
664
+ .exit-active {
665
+ max-height: 0;
666
+ }
667
+
668
+ .mapbox-control.mapbox-zoom {
669
+ display: none;
670
+ }
671
+
672
+ .map-controls_4c0a66 {
673
+ position: absolute;
674
+ top: -60px;
675
+ right: 10px;
676
+ }
677
+
678
+ .detail-panel_4c0a66 {
679
+ border-radius: 0;
680
+ }
681
+ }
682
+
683
+ @media screen and (min-width: 768px) {
684
+ .main-ui_4c0a66 {
685
+ min-height: 80px;
686
+ flex-direction: row;
687
+ padding: 1em 1em 2em;
688
+ }
689
+
690
+ .main-ui_4c0a66 > * {
691
+ margin-right: .5em;
692
+ }
693
+
694
+ .main-ui_4c0a66 > * > :last-child {
695
+ margin-right: 0;
696
+ }
697
+
698
+ .main-ui_4c0a66.searching_4c0a66 .context-stack_4c0a66 {
699
+ width: 24em;
700
+ }
701
+
702
+ .context-stack_4c0a66 {
703
+ max-width: 34em;
704
+ min-width: 14em;
705
+ width: 16em;
706
+ padding-bottom: .5em;
707
+ transition: width .3s;
708
+ }
709
+
710
+ .context-stack_4c0a66.panel-open_4c0a66 {
711
+ width: 34em;
712
+ margin-right: .5em;
713
+ }
714
+
715
+ .context-stack_4c0a66.layers_4c0a66, .context-stack_4c0a66.settings_4c0a66 {
716
+ width: 18em;
717
+ margin-right: .5em;
718
+ }
719
+
720
+ .main-ui_4c0a66.detail-panel-open_4c0a66 .detail-stack_4c0a66 {
721
+ width: 30em;
722
+ }
723
+
724
+ .detail-stack_4c0a66 {
725
+ width: 30em;
726
+ pointer-events: none;
727
+ flex-direction: column;
728
+ display: flex;
729
+ }
730
+
731
+ .context-stack_4c0a66, .detail-stack_4c0a66 {
732
+ pointer-events: none;
733
+ z-index: 100;
734
+ }
735
+
736
+ .context-stack_4c0a66 > div, .detail-stack_4c0a66 > div {
737
+ pointer-events: all;
738
+ margin-bottom: .5em;
739
+ }
740
+
741
+ .context-stack_4c0a66 > div:last-child, .detail-stack_4c0a66 > div:last-child {
742
+ margin-bottom: 0;
743
+ }
744
+
745
+ .context-stack_4c0a66 > div.spacer_4c0a66, .detail-stack_4c0a66 > div.spacer_4c0a66 {
746
+ pointer-events: none;
747
+ }
748
+
749
+ .map-view-container_4c0a66 {
750
+ position: unset;
751
+ }
752
+ }
753
+
754
+ .main-ui_4c0a66 .detail-panel_4c0a66 {
755
+ transition: opacity .8s, height .8s, max-height .8s;
756
+ }
757
+
758
+ .main-ui_4c0a66.detail-panel-from_4c0a66 .detail-panel_4c0a66 {
759
+ opacity: 0;
760
+ }
761
+
762
+ .main-ui_4c0a66.detail-panel-enter_4c0a66 .detail-panel_4c0a66 {
763
+ opacity: 1;
764
+ }
765
+
766
+ .main-ui_4c0a66.detail-panel-leave_4c0a66 .detail-panel_4c0a66 {
767
+ opacity: 0;
768
+ }
769
+
770
+ .main-ui_4c0a66 .context-panel_4c0a66 {
771
+ transition: opacity .8s, height .8s, max-height .8s;
772
+ }
773
+
774
+ .main-ui_4c0a66.context-panel-from_4c0a66 .context-panel_4c0a66 {
775
+ opacity: 0;
776
+ }
777
+
778
+ .main-ui_4c0a66.context-panel-enter_4c0a66 .context-panel_4c0a66 {
779
+ opacity: 1;
780
+ }
781
+
782
+ .main-ui_4c0a66.context-panel-leave_4c0a66 .context-panel_4c0a66 {
783
+ opacity: 0;
784
+ }
785
+
786
+ @media only screen and (max-width: 768px) {
787
+ .main-ui_4c0a66 .detail-stack_4c0a66 {
788
+ transition: opacity .8s, height .8s, max-height .8s;
789
+ }
790
+
791
+ .main-ui_4c0a66.detail-panel-from_4c0a66 .detail-stack_4c0a66 {
792
+ max-height: 0;
793
+ height: 0;
794
+ }
795
+
796
+ .main-ui_4c0a66.detail-panel-leave_4c0a66 .detail-stack_4c0a66 {
797
+ max-height: 0;
798
+ max-height: 0;
799
+ }
800
+
801
+ .main-ui_4c0a66 .context-panel_4c0a66 {
802
+ transition: opacity .8s, height .8s, max-height .8s;
803
+ }
804
+
805
+ .main-ui_4c0a66.context-panel-from_4c0a66 .context-panel_4c0a66 {
806
+ max-height: 0;
807
+ height: 0;
808
+ }
809
+
810
+ .main-ui_4c0a66.context-panel-leave_4c0a66 .context-panel_4c0a66 {
811
+ max-height: 0;
812
+ max-height: 0;
813
+ }
814
+ }
815
+
816
+ @media only screen and (min-width: 768px) {
817
+ .map-page_4c0a66 .main-ui_4c0a66.detail-panel-leave_4c0a66 .map-view-container_4c0a66 {
818
+ margin-right: -14em;
819
+ }
820
+
821
+ .map-page_4c0a66.map-is-global_4c0a66 .main-ui_4c0a66.detail-panel-leave_4c0a66 .map-view-container_4c0a66 {
822
+ margin-right: -30em;
823
+ }
824
+
825
+ .map-page_4c0a66.map-is-global_4c0a66 .main-ui_4c0a66.context-panel-leave_4c0a66 .map-view-container_4c0a66 {
826
+ margin-left: -16em;
827
+ }
828
+ }
829
+
830
+ .-mD4Aa_map-view-container {
831
+ flex-grow: 1;
832
+ position: relative;
833
+ overflow: hidden;
834
+ }
835
+
836
+ @media screen and (min-width: 768px) {
837
+ .-mD4Aa_map-view-container {
838
+ position: unset;
839
+ }
840
+ }
841
+
842
+ .feature-panel_48e225 {
843
+ position: relative;
844
+ overflow-x: hidden;
845
+ }
846
+
847
+ .key-value_48e225 {
848
+ margin-right: 1em;
849
+ display: inline-block;
850
+ }
851
+
852
+ .key-value_48e225 .key_48e225 {
853
+ font-size: .9em;
854
+ font-weight: bold;
855
+ }
856
+
857
+ .key-value_48e225 .key_48e225:after {
858
+ content: ": ";
859
+ }
860
+
861
+ .key-value_48e225 .value_48e225 {
862
+ font-size: .9em;
863
+ }
864
+
865
+ .feature-properties_48e225 {
866
+ position: relative;
867
+ }
868
+
869
+ .feature-properties_48e225:before {
870
+ content: "–";
871
+ position: absolute;
872
+ top: 4px;
873
+ left: 0;
874
+ }
875
+
876
+ .feature-header_48e225 h3 {
877
+ margin-top: .5em;
878
+ margin-bottom: 0;
879
+ }
880
+
881
+ .feature-group_48e225 {
882
+ border-bottom: 1px solid var(--panel-rule-inner);
883
+ margin-bottom: .5em;
884
+ margin-left: -1em;
885
+ margin-right: -1em;
886
+ padding: 0 1em;
887
+ }
888
+
889
+ .feature-group_48e225:last-child {
890
+ border-bottom: none;
891
+ }
892
+
893
+ .tile-info_48e225 {
894
+ flex-direction: row;
895
+ align-items: baseline;
896
+ padding: 0 1em;
897
+ display: flex;
898
+ }
899
+
900
+ .tile-info_48e225 h3 {
901
+ margin-right: .5em;
902
+ }
903
+
904
+ .opacity-slider_48e225 {
905
+ margin: 0 1em .5em;
906
+ }
907
+
908
+ .opacity-slider_48e225 .bp4-slider-handle .bp4-slider-label {
909
+ background-color: var(--secondary-color);
910
+ color: var(--text-color);
911
+ }
912
+
913
+ .unit-number_48e225 .unit_48e225 {
914
+ margin-left: .2em;
915
+ font-size: .9em;
916
+ font-weight: bold;
917
+ }
918
+
919
+ .page_48e225 {
920
+ max-width: 50em;
921
+ margin: 2em auto;
922
+ }
923
+
924
+ .dev-index-page_48e225 {
925
+ overflow-y: scroll;
926
+ }
927
+
928
+ .panel-subhead_1340c8 {
929
+ padding: .2em var(--box-horizontal-padding);
930
+ border-top: 1px solid var(--accent-border-color);
931
+ border-bottom: 1px solid var(--accent-border-color);
932
+ background-color: var(--accent-color);
933
+ z-index: 1;
934
+ align-items: center;
935
+ gap: var(--box-horizontal-padding);
936
+ flex-direction: row;
937
+ display: flex;
938
+ position: sticky;
939
+ top: 0;
940
+ }
941
+
942
+ .panel-subhead_1340c8 h1, .panel-subhead_1340c8 h2, .panel-subhead_1340c8 h3, .panel-subhead_1340c8 h4 {
943
+ margin: .2em 0;
944
+ font-family: Montserrat, sans-serif;
945
+ font-weight: 700;
946
+ }
947
+
948
+ .panel-subhead_1340c8 h4 {
949
+ font-weight: 600;
950
+ }
951
+
952
+ .panel-subhead_1340c8 .title_1340c8 {
953
+ flex-grow: 1;
954
+ }
955
+
956
+ .expansion-panel_1340c8 {
957
+ flex-wrap: wrap;
958
+ margin-top: -1px;
959
+ padding: 0;
960
+ }
961
+
962
+ .sub-expansion-panel_1340c8 {
963
+ margin: -1px calc(var(--panel-padding-h) * -.5) 0;
964
+ overflow: hidden;
965
+ }
966
+
967
+ .sub-expansion-panel_1340c8:first-child .expansion-panel-header_1340c8 {
968
+ border-top-width: 0;
969
+ }
970
+
971
+ .sub-expansion-panel_1340c8 .panel-subhead_1340c8 {
972
+ border-top: none;
973
+ border-bottom: none;
974
+ }
975
+
976
+ .sub-expansion-panel_1340c8 .expansion-panel-header_1340c8 {
977
+ background-color: var(--accent-secondary-color);
978
+ cursor: pointer;
979
+ }
980
+
981
+ .sub-expansion-panel_1340c8 .expansion-panel-header_1340c8:hover {
982
+ background-color: var(--accent-secondary-hover-color);
983
+ }
984
+
985
+ .sub-expansion-panel_1340c8 .expansion-panel-header_1340c8 h2, .sub-expansion-panel_1340c8 .expansion-panel-header_1340c8 h3, .sub-expansion-panel_1340c8 .expansion-panel-header_1340c8 h4 {
986
+ border-bottom: 1px solid var(--tertiary-border-color);
987
+ border-top: 1px solid var(--tertiary-border-color);
988
+ align-items: center;
989
+ margin-top: -1px;
990
+ padding: 5px 1em;
991
+ font-weight: 500;
992
+ }
993
+
994
+ .expansion-summary-title-help_1340c8, .expansion-summary-title-help_1340c8 .bp4-icon {
995
+ margin-left: 5px;
996
+ }
997
+
998
+ .expansion-panel-header_1340c8 {
999
+ cursor: pointer;
1000
+ }
1001
+
1002
+ .expansion-panel-header_1340c8:hover {
1003
+ background-color: var(--accent-hover-color);
1004
+ }
1005
+
1006
+ .expansion-panel-header_1340c8 .bp4-icon {
1007
+ transform: translate(0, 3px);
1008
+ }
1009
+
1010
+ .expansion-children_1340c8 {
1011
+ padding: 5px 1em 10px;
1012
+ }
1013
+
1014
+ .expansion-children_1340c8 .expansion-panel_1340c8 {
1015
+ margin-left: -1em;
1016
+ margin-right: -1em;
1017
+ }
1018
+
1019
+ .expansion-children_1340c8 .expansion-panel_1340c8:first-child {
1020
+ margin-top: -5px;
1021
+ }
1022
+
1023
+ .expansion-panel-subtext_1340c8 {
1024
+ font-size: 85%;
1025
+ font-weight: 400;
1026
+ }
1027
+
1028
+ .expansion-panel-root {
1029
+ padding-left: 15px !important;
1030
+ }
1031
+
1032
+ .expansion-panel-detail {
1033
+ padding: 0 !important;
1034
+ display: block !important;
1035
+ }
1036
+
1037
+ .expansion-panel-detail-sub {
1038
+ display: block !important;
1039
+ }
1040
+
1041
+ .expandable-details-main_1340c8 {
1042
+ flex-direction: row;
1043
+ justify-content: space-between;
1044
+ align-items: center;
1045
+ margin: 3px 0;
1046
+ display: flex;
1047
+ }
1048
+
1049
+ .expandable-details-header_1340c8 {
1050
+ flex-direction: row;
1051
+ flex-grow: 1;
1052
+ align-items: baseline;
1053
+ display: inline-flex;
1054
+ }
1055
+
1056
+ .expandable-details-children_1340c8 {
1057
+ position: relative;
1058
+ }
1059
+
1060
+ .expandable-details-toggle_1340c8 .bp4-button {
1061
+ font-size: 10px;
1062
+ }
1063
+
1064
+ .expandable-details_1340c8.macrostrat-unit_1340c8 .title_1340c8:after {
1065
+ content: none;
1066
+ }
1067
+
1068
+ .expandable-details_1340c8 .title_1340c8 {
1069
+ margin-right: 1em;
1070
+ }
1071
+
1072
+ .expandable-details_1340c8 .title_1340c8:after {
1073
+ content: ":";
1074
+ }
1075
+
1076
+ .expansion-body_1340c8 {
1077
+ background-color: var(--tertiary-background);
1078
+ width: 100%;
1079
+ border-radius: 4px;
1080
+ align-items: baseline;
1081
+ margin-bottom: 6px;
1082
+ padding: 2px 6px;
1083
+ display: inline-block;
1084
+ box-shadow: 0 1px 2px 1px #0003;
1085
+ }
1086
+
1087
+ .expansion-panel-detail-header_1340c8 {
1088
+ color: var(--secondary-color);
1089
+ margin-right: 1em;
1090
+ font-size: 90%;
1091
+ font-style: italic;
1092
+ display: inline;
1093
+ }
1094
+
1095
+ .expansion-panel-detail-header_1340c8:after {
1096
+ content: ":";
1097
+ }
1098
+
1099
+ .expansion-panel-detail-body_1340c8 {
1100
+ display: inline;
1101
+ }
1102
+
1103
+ /*# sourceMappingURL=index.css.map */