@flamingo-stack/openframe-frontend-core 0.0.458 → 0.0.459

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.
Files changed (122) hide show
  1. package/dist/{chunk-YV2YA3QH.cjs → chunk-6XYHSDCL.cjs} +31 -31
  2. package/dist/{chunk-YV2YA3QH.cjs.map → chunk-6XYHSDCL.cjs.map} +1 -1
  3. package/dist/{chunk-VTQSB6QB.cjs → chunk-A2RF7ZG6.cjs} +5 -5
  4. package/dist/{chunk-VTQSB6QB.cjs.map → chunk-A2RF7ZG6.cjs.map} +1 -1
  5. package/dist/{chunk-KQGFKG6Y.js → chunk-AS5B343N.js} +2 -2
  6. package/dist/{chunk-WGJPTFRH.js → chunk-CBNHSXTR.js} +2 -2
  7. package/dist/{chunk-7IRPMNRL.cjs → chunk-DMU3BSPR.cjs} +59 -59
  8. package/dist/{chunk-7IRPMNRL.cjs.map → chunk-DMU3BSPR.cjs.map} +1 -1
  9. package/dist/{chunk-QL7ODLJA.js → chunk-EFGFAVOI.js} +4 -4
  10. package/dist/{chunk-YQBPIUZU.js → chunk-GSKLTMIY.js} +2 -2
  11. package/dist/{chunk-DQ3EHM6G.cjs → chunk-IG4QVZSP.cjs} +9 -9
  12. package/dist/{chunk-DQ3EHM6G.cjs.map → chunk-IG4QVZSP.cjs.map} +1 -1
  13. package/dist/{chunk-ZHQQRYMB.js → chunk-JGSBLQLE.js} +4 -4
  14. package/dist/{chunk-6B27O3ZB.js → chunk-JWXOZRZ6.js} +4 -4
  15. package/dist/{chunk-R5QYMUKN.js → chunk-KW33TBQX.js} +2 -2
  16. package/dist/{chunk-IDKDOQZL.js → chunk-LDVQIOS7.js} +2 -2
  17. package/dist/{chunk-H7ETLG65.js → chunk-MRKRE54X.js} +4 -4
  18. package/dist/{chunk-L676XVP4.cjs → chunk-O5E7ZWHK.cjs} +7 -7
  19. package/dist/{chunk-L676XVP4.cjs.map → chunk-O5E7ZWHK.cjs.map} +1 -1
  20. package/dist/{chunk-LDAOPWXZ.cjs → chunk-OFPHMNRL.cjs} +11 -11
  21. package/dist/{chunk-LDAOPWXZ.cjs.map → chunk-OFPHMNRL.cjs.map} +1 -1
  22. package/dist/{chunk-ZDJ4ZUQ4.cjs → chunk-OJ5ROJSS.cjs} +37 -37
  23. package/dist/{chunk-ZDJ4ZUQ4.cjs.map → chunk-OJ5ROJSS.cjs.map} +1 -1
  24. package/dist/{chunk-HWTUVLYB.js → chunk-Q74TSDZY.js} +2 -2
  25. package/dist/{chunk-U2YDR5DT.js → chunk-RTQ57HC5.js} +2 -2
  26. package/dist/{chunk-5USSSRAL.cjs → chunk-T2EBDVMZ.cjs} +26 -26
  27. package/dist/{chunk-5USSSRAL.cjs.map → chunk-T2EBDVMZ.cjs.map} +1 -1
  28. package/dist/{chunk-TNLFAJPA.js → chunk-TP5MVWQ2.js} +4721 -4901
  29. package/dist/chunk-TP5MVWQ2.js.map +1 -0
  30. package/dist/{chunk-KIIOBK7G.cjs → chunk-WVC627C7.cjs} +26 -26
  31. package/dist/{chunk-KIIOBK7G.cjs.map → chunk-WVC627C7.cjs.map} +1 -1
  32. package/dist/{chunk-XUNJILJT.cjs → chunk-X5TAAOE7.cjs} +62 -62
  33. package/dist/{chunk-XUNJILJT.cjs.map → chunk-X5TAAOE7.cjs.map} +1 -1
  34. package/dist/{chunk-FTXDIDNX.cjs → chunk-XVHNAMAL.cjs} +15 -15
  35. package/dist/{chunk-FTXDIDNX.cjs.map → chunk-XVHNAMAL.cjs.map} +1 -1
  36. package/dist/{chunk-MKLP2SOZ.cjs → chunk-YFPZLP63.cjs} +1196 -1376
  37. package/dist/chunk-YFPZLP63.cjs.map +1 -0
  38. package/dist/components/case-studies/index.cjs +8 -8
  39. package/dist/components/case-studies/index.js +2 -2
  40. package/dist/components/chart.d.ts +1 -1
  41. package/dist/components/chat/chat-message-list.d.ts.map +1 -1
  42. package/dist/components/chat/chat-sidebar.d.ts.map +1 -1
  43. package/dist/components/chat/chat-ticket-list.d.ts.map +1 -1
  44. package/dist/components/chat/guide-welcome.d.ts.map +1 -1
  45. package/dist/components/chat/index.cjs +2 -2
  46. package/dist/components/chat/index.js +1 -1
  47. package/dist/components/chat/mingo-chat-history.d.ts.map +1 -1
  48. package/dist/components/chat/mingo-welcome.d.ts.map +1 -1
  49. package/dist/components/contact/index.cjs +3 -3
  50. package/dist/components/contact/index.js +2 -2
  51. package/dist/components/docs/index.cjs +5 -5
  52. package/dist/components/docs/index.js +4 -4
  53. package/dist/components/embeds/index.cjs +3 -3
  54. package/dist/components/embeds/index.js +2 -2
  55. package/dist/components/faq/index.cjs +3 -3
  56. package/dist/components/faq/index.js +2 -2
  57. package/dist/components/features/index.cjs +2 -2
  58. package/dist/components/features/index.js +1 -1
  59. package/dist/components/features/notifications/notification-drawer.d.ts.map +1 -1
  60. package/dist/components/features/time-tracker/time-tracker-panel.d.ts.map +1 -1
  61. package/dist/components/help-center-pages/index.cjs +20 -20
  62. package/dist/components/help-center-pages/index.js +11 -11
  63. package/dist/components/index.cjs +129 -135
  64. package/dist/components/index.cjs.map +1 -1
  65. package/dist/components/index.js +9 -15
  66. package/dist/components/index.js.map +1 -1
  67. package/dist/components/layout/page-container.d.ts.map +1 -1
  68. package/dist/components/navigation/app-layout-drawer.d.ts +1 -1
  69. package/dist/components/navigation/index.cjs +2 -2
  70. package/dist/components/navigation/index.js +1 -1
  71. package/dist/components/onboarding-guides/index.cjs +5 -5
  72. package/dist/components/onboarding-guides/index.js +4 -4
  73. package/dist/components/related-content/index.cjs +3 -3
  74. package/dist/components/related-content/index.js +2 -2
  75. package/dist/components/tickets/index.cjs +5 -5
  76. package/dist/components/tickets/index.js +4 -4
  77. package/dist/components/ui/drawer.d.ts +1 -1
  78. package/dist/components/ui/drawer.d.ts.map +1 -1
  79. package/dist/components/ui/index.cjs +2 -8
  80. package/dist/components/ui/index.cjs.map +1 -1
  81. package/dist/components/ui/index.d.ts +0 -1
  82. package/dist/components/ui/index.d.ts.map +1 -1
  83. package/dist/components/ui/index.js +1 -7
  84. package/dist/components/ui/modal-v2.d.ts.map +1 -1
  85. package/dist/components/ui/modal.d.ts.map +1 -1
  86. package/dist/index.cjs +2 -8
  87. package/dist/index.cjs.map +1 -1
  88. package/dist/index.js +1 -7
  89. package/package.json +1 -3
  90. package/src/components/chat/chat-message-list.tsx +6 -7
  91. package/src/components/chat/chat-sidebar.tsx +4 -9
  92. package/src/components/chat/chat-ticket-list.tsx +2 -8
  93. package/src/components/chat/guide-welcome.tsx +4 -6
  94. package/src/components/chat/mingo-chat-history.tsx +4 -6
  95. package/src/components/chat/mingo-welcome.tsx +4 -6
  96. package/src/components/features/notifications/notification-drawer.tsx +4 -8
  97. package/src/components/features/time-tracker/time-tracker-panel.tsx +3 -11
  98. package/src/components/layout/page-container.tsx +5 -17
  99. package/src/components/ui/drawer.tsx +3 -8
  100. package/src/components/ui/index.ts +0 -1
  101. package/src/components/ui/modal-v2.tsx +2 -12
  102. package/src/components/ui/modal.tsx +2 -9
  103. package/src/styles/index.css +0 -2
  104. package/dist/chunk-MKLP2SOZ.cjs.map +0 -1
  105. package/dist/chunk-TNLFAJPA.js.map +0 -1
  106. package/dist/components/ui/overlay-scroll-area.d.ts +0 -59
  107. package/dist/components/ui/overlay-scroll-area.d.ts.map +0 -1
  108. package/src/components/ui/overlay-scroll-area.tsx +0 -219
  109. package/src/stories/OverlayScrollArea.stories.tsx +0 -52
  110. package/src/styles/overlay-scrollbars-theme.css +0 -19
  111. package/src/styles/vendor-overlayscrollbars.css +0 -673
  112. /package/dist/{chunk-KQGFKG6Y.js.map → chunk-AS5B343N.js.map} +0 -0
  113. /package/dist/{chunk-WGJPTFRH.js.map → chunk-CBNHSXTR.js.map} +0 -0
  114. /package/dist/{chunk-QL7ODLJA.js.map → chunk-EFGFAVOI.js.map} +0 -0
  115. /package/dist/{chunk-YQBPIUZU.js.map → chunk-GSKLTMIY.js.map} +0 -0
  116. /package/dist/{chunk-ZHQQRYMB.js.map → chunk-JGSBLQLE.js.map} +0 -0
  117. /package/dist/{chunk-6B27O3ZB.js.map → chunk-JWXOZRZ6.js.map} +0 -0
  118. /package/dist/{chunk-R5QYMUKN.js.map → chunk-KW33TBQX.js.map} +0 -0
  119. /package/dist/{chunk-IDKDOQZL.js.map → chunk-LDVQIOS7.js.map} +0 -0
  120. /package/dist/{chunk-H7ETLG65.js.map → chunk-MRKRE54X.js.map} +0 -0
  121. /package/dist/{chunk-HWTUVLYB.js.map → chunk-Q74TSDZY.js.map} +0 -0
  122. /package/dist/{chunk-U2YDR5DT.js.map → chunk-RTQ57HC5.js.map} +0 -0
@@ -1,673 +0,0 @@
1
- /* Vendored from overlayscrollbars@2.16.0 (styles/overlayscrollbars.css).
2
- Do not edit — replace wholesale on package upgrade. ODS theme lives in
3
- ./overlay-scrollbars-theme.css */
4
- /*!
5
- * OverlayScrollbars
6
- * Version: 2.16.0
7
- *
8
- * Copyright (c) Rene Haas | KingSora.
9
- * https://github.com/KingSora
10
- *
11
- * Released under the MIT license.
12
- */
13
- .os-size-observer,
14
- .os-size-observer-listener {
15
- scroll-behavior: auto !important;
16
- direction: inherit;
17
- pointer-events: none;
18
- overflow: hidden;
19
- visibility: hidden;
20
- box-sizing: border-box;
21
- }
22
-
23
- .os-size-observer,
24
- .os-size-observer-listener,
25
- .os-size-observer-listener-item,
26
- .os-size-observer-listener-item-final {
27
- writing-mode: horizontal-tb;
28
- position: absolute;
29
- left: 0;
30
- top: 0;
31
- }
32
-
33
- .os-size-observer {
34
- z-index: -1;
35
- contain: strict;
36
- display: flex;
37
- flex-direction: row;
38
- flex-wrap: nowrap;
39
- padding: inherit;
40
- border: inherit;
41
- box-sizing: inherit;
42
- margin: -133px;
43
- top: 0;
44
- right: 0;
45
- bottom: 0;
46
- left: 0;
47
- transform: scale(0.1);
48
- }
49
- .os-size-observer::before {
50
- content: "";
51
- flex: none;
52
- box-sizing: inherit;
53
- padding: 10px;
54
- width: 10px;
55
- height: 10px;
56
- }
57
-
58
- .os-size-observer-appear {
59
- animation: os-size-observer-appear-animation 1ms forwards;
60
- }
61
-
62
- .os-size-observer-listener {
63
- box-sizing: border-box;
64
- position: relative;
65
- flex: auto;
66
- padding: inherit;
67
- border: inherit;
68
- margin: -133px;
69
- transform: scale(calc(1 / 0.1));
70
- }
71
- .os-size-observer-listener.ltr {
72
- margin-right: -266px;
73
- margin-left: 0;
74
- }
75
- .os-size-observer-listener.rtl {
76
- margin-left: -266px;
77
- margin-right: 0;
78
- }
79
- .os-size-observer-listener:empty::before {
80
- content: "";
81
- width: 100%;
82
- height: 100%;
83
- }
84
- .os-size-observer-listener:empty::before, .os-size-observer-listener > .os-size-observer-listener-item {
85
- display: block;
86
- position: relative;
87
- padding: inherit;
88
- border: inherit;
89
- box-sizing: content-box;
90
- flex: auto;
91
- }
92
-
93
- .os-size-observer-listener-scroll {
94
- box-sizing: border-box;
95
- display: flex;
96
- }
97
-
98
- .os-size-observer-listener-item {
99
- right: 0;
100
- bottom: 0;
101
- overflow: hidden;
102
- direction: ltr;
103
- flex: none;
104
- }
105
-
106
- .os-size-observer-listener-item-final {
107
- transition: none;
108
- }
109
-
110
- @keyframes os-size-observer-appear-animation {
111
- from {
112
- cursor: auto;
113
- }
114
- to {
115
- cursor: none;
116
- }
117
- }
118
- .os-trinsic-observer {
119
- flex: none;
120
- box-sizing: border-box;
121
- position: relative;
122
- max-width: 0px;
123
- max-height: 1px;
124
- padding: 0;
125
- margin: 0;
126
- border: none;
127
- overflow: hidden;
128
- z-index: -1;
129
- height: 0;
130
- top: calc(100% + 1px);
131
- contain: strict;
132
- }
133
- .os-trinsic-observer:not(:empty) {
134
- height: calc(100% + 1px);
135
- top: -1px;
136
- }
137
- .os-trinsic-observer:not(:empty) > .os-size-observer {
138
- width: 1000%;
139
- height: 1000%;
140
- min-height: 1px;
141
- min-width: 1px;
142
- }
143
-
144
- /**
145
- * hide native scrollbars
146
- * changes to this styles need to be reflected in the environment styles to correctly detect scrollbar hiding
147
- */
148
- /**
149
- * body element
150
- */
151
- html[data-overlayscrollbars-body] {
152
- overflow: hidden;
153
- }
154
-
155
- html[data-overlayscrollbars-body],
156
- html[data-overlayscrollbars-body] > body {
157
- width: 100%;
158
- height: 100%;
159
- margin: 0;
160
- }
161
-
162
- html[data-overlayscrollbars-body] > body {
163
- overflow: visible;
164
- margin: 0;
165
- }
166
-
167
- /**
168
- * structure setup
169
- */
170
- [data-overlayscrollbars] {
171
- position: relative;
172
- }
173
-
174
- [data-overlayscrollbars~=host],
175
- [data-overlayscrollbars-padding] {
176
- display: flex;
177
- align-items: stretch !important;
178
- flex-direction: row !important;
179
- flex-wrap: nowrap !important;
180
- scroll-behavior: auto !important;
181
- }
182
-
183
- [data-overlayscrollbars-padding],
184
- [data-overlayscrollbars-viewport]:not([data-overlayscrollbars]) {
185
- box-sizing: inherit;
186
- position: relative;
187
- flex: auto;
188
- height: auto;
189
- width: 100%;
190
- min-width: 0;
191
- padding: 0;
192
- margin: 0;
193
- border: none;
194
- z-index: 0;
195
- }
196
-
197
- [data-overlayscrollbars-viewport]:not([data-overlayscrollbars]) {
198
- --os-vaw: 0;
199
- --os-vah: 0;
200
- outline: none;
201
- }
202
- [data-overlayscrollbars-viewport]:not([data-overlayscrollbars]):focus {
203
- outline: none;
204
- }
205
- [data-overlayscrollbars-viewport][data-overlayscrollbars-viewport~=arrange]::before {
206
- content: "";
207
- position: absolute;
208
- pointer-events: none;
209
- z-index: -1;
210
- min-width: 1px;
211
- min-height: 1px;
212
- width: var(--os-vaw);
213
- height: var(--os-vah);
214
- }
215
-
216
- /**
217
- * wrapper elements overflow:
218
- */
219
- [data-overlayscrollbars~=host],
220
- [data-overlayscrollbars-padding] {
221
- overflow: hidden !important;
222
- }
223
-
224
- [data-overlayscrollbars~=host][data-overlayscrollbars~=noClipping],
225
- [data-overlayscrollbars-padding~=noClipping] {
226
- overflow: visible !important;
227
- }
228
-
229
- /**
230
- * viewport overflow:
231
- */
232
- [data-overlayscrollbars-viewport] {
233
- --os-viewport-overflow-x: hidden;
234
- --os-viewport-overflow-y: hidden;
235
- overflow-x: var(--os-viewport-overflow-x);
236
- overflow-y: var(--os-viewport-overflow-y);
237
- }
238
-
239
- [data-overlayscrollbars-viewport~=overflowXVisible] {
240
- --os-viewport-overflow-x: visible;
241
- }
242
-
243
- [data-overlayscrollbars-viewport~=overflowXHidden] {
244
- --os-viewport-overflow-x: hidden;
245
- }
246
-
247
- [data-overlayscrollbars-viewport~=overflowXScroll] {
248
- --os-viewport-overflow-x: scroll;
249
- }
250
-
251
- [data-overlayscrollbars-viewport~=overflowYVisible] {
252
- --os-viewport-overflow-y: visible;
253
- }
254
-
255
- [data-overlayscrollbars-viewport~=overflowYHidden] {
256
- --os-viewport-overflow-y: hidden;
257
- }
258
-
259
- [data-overlayscrollbars-viewport~=overflowYScroll] {
260
- --os-viewport-overflow-y: scroll;
261
- }
262
-
263
- [data-overlayscrollbars-viewport~=overflowImportant] {
264
- overflow-x: var(--os-viewport-overflow-x) !important;
265
- overflow-y: var(--os-viewport-overflow-y) !important;
266
- }
267
-
268
- /**
269
- * viewport state modifiers:
270
- */
271
- [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId) {
272
- font-size: 0 !important;
273
- line-height: 0 !important;
274
- }
275
-
276
- [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::before,
277
- [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::after,
278
- [data-overlayscrollbars-viewport~=noContent]:not(#osFakeId) > *:not(#osFakeId) {
279
- display: none !important;
280
- position: absolute !important;
281
- width: 1px !important;
282
- height: 1px !important;
283
- padding: 0 !important;
284
- margin: -1px !important;
285
- overflow: hidden !important;
286
- clip: rect(0, 0, 0, 0) !important;
287
- white-space: nowrap !important;
288
- border-width: 0 !important;
289
- }
290
-
291
- [data-overlayscrollbars-viewport~=measuring],
292
- [data-overlayscrollbars-viewport~=scrolling] {
293
- scroll-behavior: auto !important;
294
- scroll-snap-type: none !important;
295
- }
296
-
297
- [data-overlayscrollbars-viewport~=measuring][data-overlayscrollbars-viewport~=overflowXVisible] {
298
- overflow-x: hidden !important;
299
- }
300
-
301
- [data-overlayscrollbars-viewport~=measuring][data-overlayscrollbars-viewport~=overflowYVisible] {
302
- overflow-y: hidden !important;
303
- }
304
-
305
- /**
306
- * content element:
307
- */
308
- [data-overlayscrollbars-content] {
309
- box-sizing: inherit;
310
- }
311
-
312
- /**
313
- * Display contents to bridge any flickering during deferred initialization.
314
- */
315
- [data-overlayscrollbars-contents]:not(#osFakeId):not([data-overlayscrollbars-padding]):not([data-overlayscrollbars-viewport]):not([data-overlayscrollbars-content]) {
316
- display: contents;
317
- }
318
-
319
- /**
320
- * optional & experimental grid mode
321
- */
322
- [data-overlayscrollbars-grid],
323
- [data-overlayscrollbars-grid] [data-overlayscrollbars-padding] {
324
- display: grid;
325
- grid-template: 1fr/1fr;
326
- }
327
-
328
- [data-overlayscrollbars-grid] > [data-overlayscrollbars-padding],
329
- [data-overlayscrollbars-grid] > [data-overlayscrollbars-viewport],
330
- [data-overlayscrollbars-grid] > [data-overlayscrollbars-padding] > [data-overlayscrollbars-viewport] {
331
- height: auto !important;
332
- width: auto !important;
333
- }
334
-
335
- @property --os-scroll-percent {
336
- syntax: "<number>";
337
- inherits: true;
338
- initial-value: 0;
339
- }
340
- @property --os-viewport-percent {
341
- syntax: "<number>";
342
- inherits: true;
343
- initial-value: 0;
344
- }
345
- .os-scrollbar {
346
- --os-viewport-percent: 0;
347
- --os-scroll-percent: 0;
348
- --os-scroll-direction: 0;
349
- --os-scroll-percent-directional: calc(
350
- var(--os-scroll-percent) - (var(--os-scroll-percent) + (1 - var(--os-scroll-percent)) * -1) *
351
- var(--os-scroll-direction)
352
- );
353
- }
354
-
355
- .os-scrollbar {
356
- contain: size layout;
357
- contain: size layout style;
358
- transition: opacity 0.15s, visibility 0.15s, top 0.15s, right 0.15s, bottom 0.15s, left 0.15s;
359
- pointer-events: none;
360
- position: absolute;
361
- opacity: 0;
362
- visibility: hidden;
363
- }
364
-
365
- body > .os-scrollbar {
366
- position: fixed;
367
- z-index: 99999;
368
- }
369
-
370
- .os-scrollbar-transitionless {
371
- transition: none !important;
372
- }
373
-
374
- .os-scrollbar-track {
375
- position: relative;
376
- padding: 0 !important;
377
- border: none !important;
378
- }
379
-
380
- .os-scrollbar-handle {
381
- position: absolute;
382
- }
383
-
384
- .os-scrollbar-track,
385
- .os-scrollbar-handle {
386
- pointer-events: none;
387
- width: 100%;
388
- height: 100%;
389
- }
390
-
391
- .os-scrollbar.os-scrollbar-track-interactive .os-scrollbar-track,
392
- .os-scrollbar.os-scrollbar-handle-interactive .os-scrollbar-handle {
393
- pointer-events: auto;
394
- touch-action: none;
395
- }
396
-
397
- .os-scrollbar-horizontal {
398
- bottom: 0;
399
- left: 0;
400
- }
401
-
402
- .os-scrollbar-vertical {
403
- top: 0;
404
- right: 0;
405
- }
406
-
407
- .os-scrollbar-rtl.os-scrollbar-horizontal {
408
- right: 0;
409
- }
410
-
411
- .os-scrollbar-rtl.os-scrollbar-vertical {
412
- right: auto;
413
- left: 0;
414
- }
415
-
416
- .os-scrollbar-visible {
417
- opacity: 1;
418
- visibility: visible;
419
- }
420
-
421
- .os-scrollbar-auto-hide.os-scrollbar-auto-hide-hidden {
422
- opacity: 0;
423
- visibility: hidden;
424
- }
425
-
426
- .os-scrollbar-interaction.os-scrollbar-visible {
427
- opacity: 1;
428
- visibility: visible;
429
- }
430
-
431
- .os-scrollbar-unusable,
432
- .os-scrollbar-unusable *,
433
- .os-scrollbar-wheel,
434
- .os-scrollbar-wheel * {
435
- pointer-events: none !important;
436
- }
437
-
438
- .os-scrollbar-unusable .os-scrollbar-handle {
439
- opacity: 0 !important;
440
- transition: none !important;
441
- }
442
-
443
- .os-scrollbar-horizontal .os-scrollbar-handle {
444
- bottom: 0;
445
- left: calc(var(--os-scroll-percent-directional) * 100%);
446
- transform: translateX(calc(var(--os-scroll-percent-directional) * -100%));
447
- width: calc(var(--os-viewport-percent) * 100%);
448
- }
449
-
450
- .os-scrollbar-vertical .os-scrollbar-handle {
451
- right: 0;
452
- top: calc(var(--os-scroll-percent-directional) * 100%);
453
- transform: translateY(calc(var(--os-scroll-percent-directional) * -100%));
454
- height: calc(var(--os-viewport-percent) * 100%);
455
- }
456
-
457
- @supports (container-type: size) {
458
- .os-scrollbar-track {
459
- container-type: size;
460
- }
461
- .os-scrollbar-horizontal .os-scrollbar-handle {
462
- left: auto;
463
- transform: translateX(calc(var(--os-scroll-percent-directional) * 100cqw + var(--os-scroll-percent-directional) * -100%));
464
- }
465
- .os-scrollbar-vertical .os-scrollbar-handle {
466
- top: auto;
467
- transform: translateY(calc(var(--os-scroll-percent-directional) * 100cqh + var(--os-scroll-percent-directional) * -100%));
468
- }
469
- .os-scrollbar-rtl.os-scrollbar-horizontal .os-scrollbar-handle {
470
- right: auto;
471
- left: 0;
472
- }
473
- }
474
- .os-scrollbar-rtl.os-scrollbar-vertical .os-scrollbar-handle {
475
- right: auto;
476
- left: 0;
477
- }
478
-
479
- .os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless,
480
- .os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless.os-scrollbar-rtl {
481
- left: 0;
482
- right: 0;
483
- }
484
-
485
- .os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless,
486
- .os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless.os-scrollbar-rtl {
487
- top: 0;
488
- bottom: 0;
489
- }
490
-
491
- @media print {
492
- .os-scrollbar {
493
- display: none;
494
- }
495
- }
496
- .os-scrollbar {
497
- --os-size: 0;
498
- --os-padding-perpendicular: 0;
499
- --os-padding-axis: 0;
500
- --os-track-border-radius: 0;
501
- --os-track-bg: none;
502
- --os-track-bg-hover: none;
503
- --os-track-bg-active: none;
504
- --os-track-border: none;
505
- --os-track-border-hover: none;
506
- --os-track-border-active: none;
507
- --os-handle-border-radius: 0;
508
- --os-handle-bg: none;
509
- --os-handle-bg-hover: none;
510
- --os-handle-bg-active: none;
511
- --os-handle-border: none;
512
- --os-handle-border-hover: none;
513
- --os-handle-border-active: none;
514
- --os-handle-min-size: 33px;
515
- --os-handle-max-size: none;
516
- --os-handle-perpendicular-size: 100%;
517
- --os-handle-perpendicular-size-hover: 100%;
518
- --os-handle-perpendicular-size-active: 100%;
519
- --os-handle-interactive-area-offset: 0;
520
- }
521
-
522
- .os-scrollbar-track {
523
- border: var(--os-track-border);
524
- border-radius: var(--os-track-border-radius);
525
- background: var(--os-track-bg);
526
- transition: opacity 0.15s, background-color 0.15s, border-color 0.15s;
527
- }
528
- .os-scrollbar-track:hover {
529
- border: var(--os-track-border-hover);
530
- background: var(--os-track-bg-hover);
531
- }
532
- .os-scrollbar-track:active {
533
- border: var(--os-track-border-active);
534
- background: var(--os-track-bg-active);
535
- }
536
-
537
- .os-scrollbar-handle {
538
- border: var(--os-handle-border);
539
- border-radius: var(--os-handle-border-radius);
540
- background: var(--os-handle-bg);
541
- }
542
- .os-scrollbar-handle:hover {
543
- border: var(--os-handle-border-hover);
544
- background: var(--os-handle-bg-hover);
545
- }
546
- .os-scrollbar-handle:active {
547
- border: var(--os-handle-border-active);
548
- background: var(--os-handle-bg-active);
549
- }
550
-
551
- .os-scrollbar-track:before,
552
- .os-scrollbar-handle:before {
553
- content: "";
554
- position: absolute;
555
- left: 0;
556
- right: 0;
557
- top: 0;
558
- bottom: 0;
559
- display: block;
560
- }
561
-
562
- .os-scrollbar-horizontal {
563
- padding: var(--os-padding-perpendicular) var(--os-padding-axis);
564
- right: var(--os-size);
565
- height: var(--os-size);
566
- }
567
- .os-scrollbar-horizontal.os-scrollbar-rtl {
568
- left: var(--os-size);
569
- right: 0;
570
- }
571
- .os-scrollbar-horizontal .os-scrollbar-track:before {
572
- top: calc(var(--os-padding-perpendicular) * -1);
573
- bottom: calc(var(--os-padding-perpendicular) * -1);
574
- }
575
- .os-scrollbar-horizontal .os-scrollbar-handle {
576
- min-width: var(--os-handle-min-size);
577
- max-width: var(--os-handle-max-size);
578
- height: var(--os-handle-perpendicular-size);
579
- transition: opacity 0.15s, background-color 0.15s, border-color 0.15s, height 0.15s;
580
- }
581
- .os-scrollbar-horizontal .os-scrollbar-handle:before {
582
- top: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
583
- bottom: calc(var(--os-padding-perpendicular) * -1);
584
- }
585
- .os-scrollbar-horizontal:hover .os-scrollbar-handle {
586
- height: var(--os-handle-perpendicular-size-hover);
587
- }
588
- .os-scrollbar-horizontal:active .os-scrollbar-handle {
589
- height: var(--os-handle-perpendicular-size-active);
590
- }
591
-
592
- .os-scrollbar-vertical {
593
- padding: var(--os-padding-axis) var(--os-padding-perpendicular);
594
- bottom: var(--os-size);
595
- width: var(--os-size);
596
- }
597
- .os-scrollbar-vertical .os-scrollbar-track:before {
598
- left: calc(var(--os-padding-perpendicular) * -1);
599
- right: calc(var(--os-padding-perpendicular) * -1);
600
- }
601
- .os-scrollbar-vertical .os-scrollbar-handle {
602
- min-height: var(--os-handle-min-size);
603
- max-height: var(--os-handle-max-size);
604
- width: var(--os-handle-perpendicular-size);
605
- transition: opacity 0.15s, background-color 0.15s, border-color 0.15s, width 0.15s;
606
- }
607
- .os-scrollbar-vertical .os-scrollbar-handle:before {
608
- left: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
609
- right: calc(var(--os-padding-perpendicular) * -1);
610
- }
611
- .os-scrollbar-vertical.os-scrollbar-rtl .os-scrollbar-handle:before {
612
- right: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
613
- left: calc(var(--os-padding-perpendicular) * -1);
614
- }
615
- .os-scrollbar-vertical:hover .os-scrollbar-handle {
616
- width: var(--os-handle-perpendicular-size-hover);
617
- }
618
- .os-scrollbar-vertical:active .os-scrollbar-handle {
619
- width: var(--os-handle-perpendicular-size-active);
620
- }
621
-
622
- /* NONE THEME: */
623
- [data-overlayscrollbars-viewport~=measuring] > .os-scrollbar,
624
- .os-theme-none.os-scrollbar {
625
- display: none !important;
626
- }
627
-
628
- /* DARK & LIGHT THEME: */
629
- .os-theme-dark,
630
- .os-theme-light {
631
- box-sizing: border-box;
632
- --os-size: 10px;
633
- --os-padding-perpendicular: 2px;
634
- --os-padding-axis: 2px;
635
- --os-track-border-radius: 10px;
636
- --os-handle-interactive-area-offset: 4px;
637
- --os-handle-border-radius: 10px;
638
- }
639
-
640
- .os-theme-dark {
641
- --os-handle-bg: rgba(0, 0, 0, 0.44);
642
- --os-handle-bg-hover: rgba(0, 0, 0, 0.55);
643
- --os-handle-bg-active: rgba(0, 0, 0, 0.66);
644
- }
645
-
646
- .os-theme-light {
647
- --os-handle-bg: rgba(255, 255, 255, 0.44);
648
- --os-handle-bg-hover: rgba(255, 255, 255, 0.55);
649
- --os-handle-bg-active: rgba(255, 255, 255, 0.66);
650
- }
651
-
652
- [data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport]),
653
- [data-overlayscrollbars-viewport~=scrollbarHidden],
654
- html[data-overlayscrollbars-viewport~=scrollbarHidden] > body {
655
- scrollbar-width: none !important;
656
- }
657
-
658
- [data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport])::-webkit-scrollbar,
659
- [data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport])::-webkit-scrollbar-corner,
660
- [data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar,
661
- [data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar-corner,
662
- html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar,
663
- html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar-corner {
664
- -webkit-appearance: none !important;
665
- appearance: none !important;
666
- display: none !important;
667
- width: 0 !important;
668
- height: 0 !important;
669
- }
670
-
671
- [data-overlayscrollbars-initialize]:not([data-overlayscrollbars]):not(html):not(body) {
672
- overflow: auto;
673
- }