xk9mqp2vl7nr4wj8 1.0.0

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,710 @@
1
+ /* src/components/code/hooks/prism-theme.css */
2
+ code[class*=language-]::-moz-selection,
3
+ pre[class*=language-]::-moz-selection,
4
+ code[class*=language-] ::-moz-selection,
5
+ pre[class*=language-] ::-moz-selection {
6
+ background: var(--grey-600);
7
+ }
8
+ code[class*=language-]::selection,
9
+ pre[class*=language-]::selection,
10
+ code[class*=language-] ::selection,
11
+ pre[class*=language-] ::selection {
12
+ background: var(--grey-600);
13
+ }
14
+ [class*=language-] .namespace {
15
+ opacity: 0.7;
16
+ }
17
+ .token.atrule {
18
+ color: var(--green-400);
19
+ }
20
+ .token.attr-name {
21
+ color: var(--yellow-400);
22
+ }
23
+ .token.attr-value {
24
+ color: #ffffff;
25
+ }
26
+ .token.attribute {
27
+ color: #ffffff;
28
+ }
29
+ .token.boolean {
30
+ color: var(--green-400);
31
+ }
32
+ .token.builtin {
33
+ color: var(--green-400);
34
+ }
35
+ .token.cdata {
36
+ color: var(--aqua-400);
37
+ }
38
+ .token.char {
39
+ color: var(--aqua-400);
40
+ }
41
+ .token.class {
42
+ color: var(--yellow-400);
43
+ }
44
+ .token.class-name {
45
+ color: var(--yellow-400);
46
+ }
47
+ .token.comment {
48
+ color: var(--grey-400);
49
+ }
50
+ .token.constant {
51
+ color: var(--green-400);
52
+ }
53
+ .token.deleted {
54
+ color: var(--red-400);
55
+ }
56
+ .token.doctype {
57
+ color: var(--grey-400);
58
+ }
59
+ .token.entity {
60
+ color: var(--red-400);
61
+ }
62
+ .token.function {
63
+ color: #ffffff;
64
+ }
65
+ .token.hexcode {
66
+ color: var(--yellow-400);
67
+ }
68
+ .token.id {
69
+ color: var(--green-400);
70
+ font-weight: bold;
71
+ }
72
+ .token.important {
73
+ color: var(--green-400);
74
+ font-weight: bold;
75
+ }
76
+ .token.inserted {
77
+ color: var(--aqua-400);
78
+ }
79
+ .token.keyword {
80
+ color: var(--green-400);
81
+ }
82
+ .token.number {
83
+ color: var(--yellow-400);
84
+ }
85
+ .token.operator {
86
+ color: #ffffff;
87
+ }
88
+ .token.prolog {
89
+ color: #ffffff;
90
+ }
91
+ .token.property {
92
+ color: var(--green-400);
93
+ }
94
+ .token.pseudo-class {
95
+ color: #ffffff;
96
+ }
97
+ .token.pseudo-element {
98
+ color: #ffffff;
99
+ }
100
+ .token.punctuation {
101
+ color: var(--green-400);
102
+ }
103
+ .token.regex {
104
+ color: var(--yellow-400);
105
+ }
106
+ .token.selector {
107
+ color: var(--red-400);
108
+ }
109
+ .token.string {
110
+ color: #ffffff;
111
+ }
112
+ .token.symbol {
113
+ color: var(--green-400);
114
+ }
115
+ .token.tag {
116
+ color: var(--red-400);
117
+ }
118
+ .token.unit {
119
+ color: var(--yellow-400);
120
+ }
121
+ .token.url {
122
+ color: var(--blue-400);
123
+ }
124
+ .token.variable {
125
+ color: #ffffff;
126
+ }
127
+
128
+ /* node_modules/overlayscrollbars/styles/overlayscrollbars.css */
129
+ .os-size-observer,
130
+ .os-size-observer-listener {
131
+ scroll-behavior: auto !important;
132
+ direction: inherit;
133
+ pointer-events: none;
134
+ overflow: hidden;
135
+ visibility: hidden;
136
+ box-sizing: border-box;
137
+ }
138
+ .os-size-observer,
139
+ .os-size-observer-listener,
140
+ .os-size-observer-listener-item,
141
+ .os-size-observer-listener-item-final {
142
+ writing-mode: horizontal-tb;
143
+ position: absolute;
144
+ left: 0;
145
+ top: 0;
146
+ }
147
+ .os-size-observer {
148
+ z-index: -1;
149
+ contain: strict;
150
+ display: flex;
151
+ flex-direction: row;
152
+ flex-wrap: nowrap;
153
+ padding: inherit;
154
+ border: inherit;
155
+ box-sizing: inherit;
156
+ margin: -133px;
157
+ top: 0;
158
+ right: 0;
159
+ bottom: 0;
160
+ left: 0;
161
+ transform: scale(0.1);
162
+ }
163
+ .os-size-observer::before {
164
+ content: "";
165
+ flex: none;
166
+ box-sizing: inherit;
167
+ padding: 10px;
168
+ width: 10px;
169
+ height: 10px;
170
+ }
171
+ .os-size-observer-appear {
172
+ animation: os-size-observer-appear-animation 1ms forwards;
173
+ }
174
+ .os-size-observer-listener {
175
+ box-sizing: border-box;
176
+ position: relative;
177
+ flex: auto;
178
+ padding: inherit;
179
+ border: inherit;
180
+ margin: -133px;
181
+ transform: scale(calc(1 / 0.1));
182
+ }
183
+ .os-size-observer-listener.ltr {
184
+ margin-right: -266px;
185
+ margin-left: 0;
186
+ }
187
+ .os-size-observer-listener.rtl {
188
+ margin-left: -266px;
189
+ margin-right: 0;
190
+ }
191
+ .os-size-observer-listener:empty::before {
192
+ content: "";
193
+ width: 100%;
194
+ height: 100%;
195
+ }
196
+ .os-size-observer-listener:empty::before,
197
+ .os-size-observer-listener > .os-size-observer-listener-item {
198
+ display: block;
199
+ position: relative;
200
+ padding: inherit;
201
+ border: inherit;
202
+ box-sizing: content-box;
203
+ flex: auto;
204
+ }
205
+ .os-size-observer-listener-scroll {
206
+ box-sizing: border-box;
207
+ display: flex;
208
+ }
209
+ .os-size-observer-listener-item {
210
+ right: 0;
211
+ bottom: 0;
212
+ overflow: hidden;
213
+ direction: ltr;
214
+ flex: none;
215
+ }
216
+ .os-size-observer-listener-item-final {
217
+ transition: none;
218
+ }
219
+ @keyframes os-size-observer-appear-animation {
220
+ from {
221
+ cursor: auto;
222
+ }
223
+ to {
224
+ cursor: none;
225
+ }
226
+ }
227
+ .os-trinsic-observer {
228
+ flex: none;
229
+ box-sizing: border-box;
230
+ position: relative;
231
+ max-width: 0px;
232
+ max-height: 1px;
233
+ padding: 0;
234
+ margin: 0;
235
+ border: none;
236
+ overflow: hidden;
237
+ z-index: -1;
238
+ height: 0;
239
+ top: calc(100% + 1px);
240
+ contain: strict;
241
+ }
242
+ .os-trinsic-observer:not(:empty) {
243
+ height: calc(100% + 1px);
244
+ top: -1px;
245
+ }
246
+ .os-trinsic-observer:not(:empty) > .os-size-observer {
247
+ width: 1000%;
248
+ height: 1000%;
249
+ min-height: 1px;
250
+ min-width: 1px;
251
+ }
252
+ [data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport]),
253
+ [data-overlayscrollbars-viewport~=scrollbarHidden],
254
+ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body {
255
+ scrollbar-width: none !important;
256
+ }
257
+ [data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport])::-webkit-scrollbar,
258
+ [data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport])::-webkit-scrollbar-corner,
259
+ [data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar,
260
+ [data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar-corner,
261
+ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar,
262
+ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar-corner {
263
+ -webkit-appearance: none !important;
264
+ appearance: none !important;
265
+ display: none !important;
266
+ width: 0 !important;
267
+ height: 0 !important;
268
+ }
269
+ [data-overlayscrollbars-initialize]:not([data-overlayscrollbars]):not(html):not(body) {
270
+ overflow: auto;
271
+ }
272
+ html[data-overlayscrollbars-body] {
273
+ overflow: hidden;
274
+ }
275
+ html[data-overlayscrollbars-body],
276
+ html[data-overlayscrollbars-body] > body {
277
+ width: 100%;
278
+ height: 100%;
279
+ margin: 0;
280
+ }
281
+ html[data-overlayscrollbars-body] > body {
282
+ overflow: visible;
283
+ margin: 0;
284
+ }
285
+ [data-overlayscrollbars] {
286
+ position: relative;
287
+ }
288
+ [data-overlayscrollbars~=host],
289
+ [data-overlayscrollbars-padding] {
290
+ display: flex;
291
+ align-items: stretch !important;
292
+ flex-direction: row !important;
293
+ flex-wrap: nowrap !important;
294
+ scroll-behavior: auto !important;
295
+ }
296
+ [data-overlayscrollbars-padding],
297
+ [data-overlayscrollbars-viewport]:not([data-overlayscrollbars]) {
298
+ box-sizing: inherit;
299
+ position: relative;
300
+ flex: auto;
301
+ height: auto;
302
+ width: 100%;
303
+ min-width: 0;
304
+ padding: 0;
305
+ margin: 0;
306
+ border: none;
307
+ z-index: 0;
308
+ }
309
+ [data-overlayscrollbars-viewport]:not([data-overlayscrollbars]) {
310
+ --os-vaw: 0;
311
+ --os-vah: 0;
312
+ outline: none;
313
+ }
314
+ [data-overlayscrollbars-viewport]:not([data-overlayscrollbars]):focus {
315
+ outline: none;
316
+ }
317
+ [data-overlayscrollbars-viewport][data-overlayscrollbars-viewport~=arrange]::before {
318
+ content: "";
319
+ position: absolute;
320
+ pointer-events: none;
321
+ z-index: -1;
322
+ min-width: 1px;
323
+ min-height: 1px;
324
+ width: var(--os-vaw);
325
+ height: var(--os-vah);
326
+ }
327
+ [data-overlayscrollbars~=host],
328
+ [data-overlayscrollbars-padding] {
329
+ overflow: hidden !important;
330
+ }
331
+ [data-overlayscrollbars~=host][data-overlayscrollbars~=noClipping],
332
+ [data-overlayscrollbars-padding~=noClipping] {
333
+ overflow: visible !important;
334
+ }
335
+ [data-overlayscrollbars-viewport] {
336
+ --os-viewport-overflow-x: hidden;
337
+ --os-viewport-overflow-y: hidden;
338
+ overflow-x: var(--os-viewport-overflow-x);
339
+ overflow-y: var(--os-viewport-overflow-y);
340
+ }
341
+ [data-overlayscrollbars-viewport~=overflowXVisible] {
342
+ --os-viewport-overflow-x: visible;
343
+ }
344
+ [data-overlayscrollbars-viewport~=overflowXHidden] {
345
+ --os-viewport-overflow-x: hidden;
346
+ }
347
+ [data-overlayscrollbars-viewport~=overflowXScroll] {
348
+ --os-viewport-overflow-x: scroll;
349
+ }
350
+ [data-overlayscrollbars-viewport~=overflowYVisible] {
351
+ --os-viewport-overflow-y: visible;
352
+ }
353
+ [data-overlayscrollbars-viewport~=overflowYHidden] {
354
+ --os-viewport-overflow-y: hidden;
355
+ }
356
+ [data-overlayscrollbars-viewport~=overflowYScroll] {
357
+ --os-viewport-overflow-y: scroll;
358
+ }
359
+ [data-overlayscrollbars-viewport~=overflowImportant] {
360
+ overflow-x: var(--os-viewport-overflow-x) !important;
361
+ overflow-y: var(--os-viewport-overflow-y) !important;
362
+ }
363
+ [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId) {
364
+ font-size: 0 !important;
365
+ line-height: 0 !important;
366
+ }
367
+ [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::before,
368
+ [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::after,
369
+ [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId) > * {
370
+ display: none !important;
371
+ position: absolute !important;
372
+ width: 1px !important;
373
+ height: 1px !important;
374
+ padding: 0 !important;
375
+ margin: -1px !important;
376
+ overflow: hidden !important;
377
+ clip: rect(0, 0, 0, 0) !important;
378
+ white-space: nowrap !important;
379
+ border-width: 0 !important;
380
+ }
381
+ [data-overlayscrollbars-viewport~=measuring],
382
+ [data-overlayscrollbars-viewport~=scrolling] {
383
+ scroll-behavior: auto !important;
384
+ scroll-snap-type: none !important;
385
+ }
386
+ [data-overlayscrollbars-viewport~=measuring][data-overlayscrollbars-viewport~=overflowXVisible] {
387
+ overflow-x: hidden !important;
388
+ }
389
+ [data-overlayscrollbars-viewport~=measuring][data-overlayscrollbars-viewport~=overflowYVisible] {
390
+ overflow-y: hidden !important;
391
+ }
392
+ [data-overlayscrollbars-content] {
393
+ box-sizing: inherit;
394
+ }
395
+ [data-overlayscrollbars-contents]:not(#osFakeId):not([data-overlayscrollbars-padding]):not([data-overlayscrollbars-viewport]):not([data-overlayscrollbars-content]) {
396
+ display: contents;
397
+ }
398
+ [data-overlayscrollbars-grid],
399
+ [data-overlayscrollbars-grid] [data-overlayscrollbars-padding] {
400
+ display: grid;
401
+ grid-template: 1fr/1fr;
402
+ }
403
+ [data-overlayscrollbars-grid] > [data-overlayscrollbars-padding],
404
+ [data-overlayscrollbars-grid] > [data-overlayscrollbars-viewport],
405
+ [data-overlayscrollbars-grid] > [data-overlayscrollbars-padding] > [data-overlayscrollbars-viewport] {
406
+ height: auto !important;
407
+ width: auto !important;
408
+ }
409
+ @property --os-scroll-percent { syntax: "<number>"; inherits: true; initial-value: 0; }
410
+ @property --os-viewport-percent { syntax: "<number>"; inherits: true; initial-value: 0; }
411
+ .os-scrollbar {
412
+ --os-viewport-percent: 0;
413
+ --os-scroll-percent: 0;
414
+ --os-scroll-direction: 0;
415
+ --os-scroll-percent-directional: calc( var(--os-scroll-percent) - (var(--os-scroll-percent) + (1 - var(--os-scroll-percent)) * -1) * var(--os-scroll-direction) );
416
+ }
417
+ .os-scrollbar {
418
+ contain: size layout;
419
+ contain: size layout style;
420
+ transition:
421
+ opacity 0.15s,
422
+ visibility 0.15s,
423
+ top 0.15s,
424
+ right 0.15s,
425
+ bottom 0.15s,
426
+ left 0.15s;
427
+ pointer-events: none;
428
+ position: absolute;
429
+ opacity: 0;
430
+ visibility: hidden;
431
+ }
432
+ body > .os-scrollbar {
433
+ position: fixed;
434
+ z-index: 99999;
435
+ }
436
+ .os-scrollbar-transitionless {
437
+ transition: none !important;
438
+ }
439
+ .os-scrollbar-track {
440
+ position: relative;
441
+ padding: 0 !important;
442
+ border: none !important;
443
+ }
444
+ .os-scrollbar-handle {
445
+ position: absolute;
446
+ }
447
+ .os-scrollbar-track,
448
+ .os-scrollbar-handle {
449
+ pointer-events: none;
450
+ width: 100%;
451
+ height: 100%;
452
+ }
453
+ .os-scrollbar.os-scrollbar-track-interactive .os-scrollbar-track,
454
+ .os-scrollbar.os-scrollbar-handle-interactive .os-scrollbar-handle {
455
+ pointer-events: auto;
456
+ touch-action: none;
457
+ }
458
+ .os-scrollbar-horizontal {
459
+ bottom: 0;
460
+ left: 0;
461
+ }
462
+ .os-scrollbar-vertical {
463
+ top: 0;
464
+ right: 0;
465
+ }
466
+ .os-scrollbar-rtl.os-scrollbar-horizontal {
467
+ right: 0;
468
+ }
469
+ .os-scrollbar-rtl.os-scrollbar-vertical {
470
+ right: auto;
471
+ left: 0;
472
+ }
473
+ .os-scrollbar-visible {
474
+ opacity: 1;
475
+ visibility: visible;
476
+ }
477
+ .os-scrollbar-auto-hide.os-scrollbar-auto-hide-hidden {
478
+ opacity: 0;
479
+ visibility: hidden;
480
+ }
481
+ .os-scrollbar-interaction.os-scrollbar-visible {
482
+ opacity: 1;
483
+ visibility: visible;
484
+ }
485
+ .os-scrollbar-unusable,
486
+ .os-scrollbar-unusable *,
487
+ .os-scrollbar-wheel,
488
+ .os-scrollbar-wheel * {
489
+ pointer-events: none !important;
490
+ }
491
+ .os-scrollbar-unusable .os-scrollbar-handle {
492
+ opacity: 0 !important;
493
+ transition: none !important;
494
+ }
495
+ .os-scrollbar-horizontal .os-scrollbar-handle {
496
+ bottom: 0;
497
+ left: calc(var(--os-scroll-percent-directional) * 100%);
498
+ transform: translateX(calc(var(--os-scroll-percent-directional) * -100%));
499
+ width: calc(var(--os-viewport-percent) * 100%);
500
+ }
501
+ .os-scrollbar-vertical .os-scrollbar-handle {
502
+ right: 0;
503
+ top: calc(var(--os-scroll-percent-directional) * 100%);
504
+ transform: translateY(calc(var(--os-scroll-percent-directional) * -100%));
505
+ height: calc(var(--os-viewport-percent) * 100%);
506
+ }
507
+ @supports (container-type: size) {
508
+ .os-scrollbar-track {
509
+ container-type: size;
510
+ }
511
+ .os-scrollbar-horizontal .os-scrollbar-handle {
512
+ left: auto;
513
+ transform: translateX(calc(var(--os-scroll-percent-directional) * 100cqw + var(--os-scroll-percent-directional) * -100%));
514
+ }
515
+ .os-scrollbar-vertical .os-scrollbar-handle {
516
+ top: auto;
517
+ transform: translateY(calc(var(--os-scroll-percent-directional) * 100cqh + var(--os-scroll-percent-directional) * -100%));
518
+ }
519
+ .os-scrollbar-rtl.os-scrollbar-horizontal .os-scrollbar-handle {
520
+ right: auto;
521
+ left: 0;
522
+ }
523
+ }
524
+ .os-scrollbar-rtl.os-scrollbar-vertical .os-scrollbar-handle {
525
+ right: auto;
526
+ left: 0;
527
+ }
528
+ .os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless,
529
+ .os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless.os-scrollbar-rtl {
530
+ left: 0;
531
+ right: 0;
532
+ }
533
+ .os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless,
534
+ .os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless.os-scrollbar-rtl {
535
+ top: 0;
536
+ bottom: 0;
537
+ }
538
+ @media print {
539
+ .os-scrollbar {
540
+ display: none;
541
+ }
542
+ }
543
+ .os-scrollbar {
544
+ --os-size: 0;
545
+ --os-padding-perpendicular: 0;
546
+ --os-padding-axis: 0;
547
+ --os-track-border-radius: 0;
548
+ --os-track-bg: none;
549
+ --os-track-bg-hover: none;
550
+ --os-track-bg-active: none;
551
+ --os-track-border: none;
552
+ --os-track-border-hover: none;
553
+ --os-track-border-active: none;
554
+ --os-handle-border-radius: 0;
555
+ --os-handle-bg: none;
556
+ --os-handle-bg-hover: none;
557
+ --os-handle-bg-active: none;
558
+ --os-handle-border: none;
559
+ --os-handle-border-hover: none;
560
+ --os-handle-border-active: none;
561
+ --os-handle-min-size: 33px;
562
+ --os-handle-max-size: none;
563
+ --os-handle-perpendicular-size: 100%;
564
+ --os-handle-perpendicular-size-hover: 100%;
565
+ --os-handle-perpendicular-size-active: 100%;
566
+ --os-handle-interactive-area-offset: 0;
567
+ }
568
+ .os-scrollbar-track {
569
+ border: var(--os-track-border);
570
+ border-radius: var(--os-track-border-radius);
571
+ background: var(--os-track-bg);
572
+ transition:
573
+ opacity 0.15s,
574
+ background-color 0.15s,
575
+ border-color 0.15s;
576
+ }
577
+ .os-scrollbar-track:hover {
578
+ border: var(--os-track-border-hover);
579
+ background: var(--os-track-bg-hover);
580
+ }
581
+ .os-scrollbar-track:active {
582
+ border: var(--os-track-border-active);
583
+ background: var(--os-track-bg-active);
584
+ }
585
+ .os-scrollbar-handle {
586
+ border: var(--os-handle-border);
587
+ border-radius: var(--os-handle-border-radius);
588
+ background: var(--os-handle-bg);
589
+ }
590
+ .os-scrollbar-handle:hover {
591
+ border: var(--os-handle-border-hover);
592
+ background: var(--os-handle-bg-hover);
593
+ }
594
+ .os-scrollbar-handle:active {
595
+ border: var(--os-handle-border-active);
596
+ background: var(--os-handle-bg-active);
597
+ }
598
+ .os-scrollbar-track:before,
599
+ .os-scrollbar-handle:before {
600
+ content: "";
601
+ position: absolute;
602
+ left: 0;
603
+ right: 0;
604
+ top: 0;
605
+ bottom: 0;
606
+ display: block;
607
+ }
608
+ .os-scrollbar-horizontal {
609
+ padding: var(--os-padding-perpendicular) var(--os-padding-axis);
610
+ right: var(--os-size);
611
+ height: var(--os-size);
612
+ }
613
+ .os-scrollbar-horizontal.os-scrollbar-rtl {
614
+ left: var(--os-size);
615
+ right: 0;
616
+ }
617
+ .os-scrollbar-horizontal .os-scrollbar-track:before {
618
+ top: calc(var(--os-padding-perpendicular) * -1);
619
+ bottom: calc(var(--os-padding-perpendicular) * -1);
620
+ }
621
+ .os-scrollbar-horizontal .os-scrollbar-handle {
622
+ min-width: var(--os-handle-min-size);
623
+ max-width: var(--os-handle-max-size);
624
+ height: var(--os-handle-perpendicular-size);
625
+ transition:
626
+ opacity 0.15s,
627
+ background-color 0.15s,
628
+ border-color 0.15s,
629
+ height 0.15s;
630
+ }
631
+ .os-scrollbar-horizontal .os-scrollbar-handle:before {
632
+ top: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
633
+ bottom: calc(var(--os-padding-perpendicular) * -1);
634
+ }
635
+ .os-scrollbar-horizontal:hover .os-scrollbar-handle {
636
+ height: var(--os-handle-perpendicular-size-hover);
637
+ }
638
+ .os-scrollbar-horizontal:active .os-scrollbar-handle {
639
+ height: var(--os-handle-perpendicular-size-active);
640
+ }
641
+ .os-scrollbar-vertical {
642
+ padding: var(--os-padding-axis) var(--os-padding-perpendicular);
643
+ bottom: var(--os-size);
644
+ width: var(--os-size);
645
+ }
646
+ .os-scrollbar-vertical .os-scrollbar-track:before {
647
+ left: calc(var(--os-padding-perpendicular) * -1);
648
+ right: calc(var(--os-padding-perpendicular) * -1);
649
+ }
650
+ .os-scrollbar-vertical .os-scrollbar-handle {
651
+ min-height: var(--os-handle-min-size);
652
+ max-height: var(--os-handle-max-size);
653
+ width: var(--os-handle-perpendicular-size);
654
+ transition:
655
+ opacity 0.15s,
656
+ background-color 0.15s,
657
+ border-color 0.15s,
658
+ width 0.15s;
659
+ }
660
+ .os-scrollbar-vertical .os-scrollbar-handle:before {
661
+ left: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
662
+ right: calc(var(--os-padding-perpendicular) * -1);
663
+ }
664
+ .os-scrollbar-vertical.os-scrollbar-rtl .os-scrollbar-handle:before {
665
+ right: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
666
+ left: calc(var(--os-padding-perpendicular) * -1);
667
+ }
668
+ .os-scrollbar-vertical:hover .os-scrollbar-handle {
669
+ width: var(--os-handle-perpendicular-size-hover);
670
+ }
671
+ .os-scrollbar-vertical:active .os-scrollbar-handle {
672
+ width: var(--os-handle-perpendicular-size-active);
673
+ }
674
+ [data-overlayscrollbars-viewport~=measuring] > .os-scrollbar,
675
+ .os-theme-none.os-scrollbar {
676
+ display: none !important;
677
+ }
678
+ .os-theme-dark,
679
+ .os-theme-light {
680
+ box-sizing: border-box;
681
+ --os-size: 10px;
682
+ --os-padding-perpendicular: 2px;
683
+ --os-padding-axis: 2px;
684
+ --os-track-border-radius: 10px;
685
+ --os-handle-interactive-area-offset: 4px;
686
+ --os-handle-border-radius: 10px;
687
+ }
688
+ .os-theme-dark {
689
+ --os-handle-bg: rgba(0, 0, 0, 0.44);
690
+ --os-handle-bg-hover: rgba(0, 0, 0, 0.55);
691
+ --os-handle-bg-active: rgba(0, 0, 0, 0.66);
692
+ }
693
+ .os-theme-light {
694
+ --os-handle-bg: rgba(255, 255, 255, 0.44);
695
+ --os-handle-bg-hover: rgba(255, 255, 255, 0.55);
696
+ --os-handle-bg-active: rgba(255, 255, 255, 0.66);
697
+ }
698
+ /*! Bundled license information:
699
+
700
+ overlayscrollbars/styles/overlayscrollbars.css:
701
+ (*!
702
+ * OverlayScrollbars
703
+ * Version: 2.13.0
704
+ *
705
+ * Copyright (c) Rene Haas | KingSora.
706
+ * https://github.com/KingSora
707
+ *
708
+ * Released under the MIT license.
709
+ *)
710
+ */