@tabler/core 1.0.0-alpha.23 → 1.0.0-beta10

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 (121) hide show
  1. package/LICENSE +1 -1
  2. package/README.md +13 -2
  3. package/dist/.DS_Store +0 -0
  4. package/dist/css/demo.css +399 -238
  5. package/dist/css/demo.min.css +5 -5
  6. package/dist/css/demo.rtl.css +399 -238
  7. package/dist/css/demo.rtl.min.css +5 -5
  8. package/dist/css/tabler-flags.css +539 -272
  9. package/dist/css/tabler-flags.min.css +5 -5
  10. package/dist/css/tabler-flags.rtl.css +539 -272
  11. package/dist/css/tabler-flags.rtl.min.css +5 -5
  12. package/dist/css/tabler-payments.css +258 -129
  13. package/dist/css/tabler-payments.min.css +5 -5
  14. package/dist/css/tabler-payments.rtl.css +258 -129
  15. package/dist/css/tabler-payments.rtl.min.css +5 -5
  16. package/dist/css/tabler-vendors.css +1151 -114
  17. package/dist/css/tabler-vendors.min.css +5 -5
  18. package/dist/css/tabler-vendors.rtl.css +1151 -114
  19. package/dist/css/tabler-vendors.rtl.min.css +5 -5
  20. package/dist/css/tabler.css +13604 -7020
  21. package/dist/css/tabler.min.css +10 -5
  22. package/dist/css/tabler.rtl.css +13603 -7020
  23. package/dist/css/tabler.rtl.min.css +10 -5
  24. package/dist/js/demo.js +151 -0
  25. package/dist/js/demo.min.js +9 -0
  26. package/dist/js/tabler.esm.js +8114 -0
  27. package/dist/js/tabler.esm.min.js +9 -0
  28. package/dist/js/tabler.js +3502 -3475
  29. package/dist/js/tabler.min.js +5 -5
  30. package/dist/libs/apexcharts/dist/apexcharts.min.js +5 -5
  31. package/dist/libs/bootstrap/dist/js/bootstrap.bundle.min.js +3 -3
  32. package/dist/libs/countup.js/dist/countUp.js +36 -5
  33. package/dist/libs/jsvectormap/dist/js/jsvectormap.min.js +1 -0
  34. package/dist/libs/jsvectormap/dist/maps/world-merc.js +1 -0
  35. package/dist/libs/jsvectormap/dist/maps/world.js +1 -0
  36. package/dist/libs/list.js/dist/list.min.js +2 -0
  37. package/dist/libs/litepicker/dist/litepicker.js +3 -3
  38. package/dist/libs/nouislider/dist/nouislider.min.js +1 -0
  39. package/dist/libs/tom-select/dist/js/tom-select.base.min.js +303 -0
  40. package/package.json +94 -37
  41. package/src/js/demo.js +97 -0
  42. package/src/js/{autosize.js → src/autosize.js} +0 -0
  43. package/src/js/src/dropdown.js +9 -0
  44. package/src/js/{input-mask.js → src/input-mask.js} +0 -0
  45. package/src/js/{popover.js → src/popover.js} +0 -0
  46. package/src/js/{switch-icon.js → src/switch-icon.js} +0 -0
  47. package/src/js/src/tab.js +16 -0
  48. package/src/js/{toast.js → src/toast.js} +0 -0
  49. package/src/js/{tooltip.js → src/tooltip.js} +0 -0
  50. package/src/js/tabler.esm.js +10 -0
  51. package/src/js/tabler.js +10 -7
  52. package/src/scss/_bootstrap-components.scss +3 -0
  53. package/src/scss/_bootstrap-config.scss +1 -0
  54. package/src/scss/{_tabler-core.scss → _core.scss} +5 -2
  55. package/src/scss/_mixins-override.scss +3 -3
  56. package/src/scss/_utilities.scss +18 -23
  57. package/src/scss/_variables.scss +179 -96
  58. package/src/scss/demo/_examples.scss +11 -2
  59. package/src/scss/demo/_highlight.scss +0 -1
  60. package/src/scss/demo.scss +33 -4
  61. package/src/scss/fonts/_webfonts.scss +56 -6
  62. package/src/scss/layout/_core.scss +55 -5
  63. package/src/scss/layout/_dark.scss +195 -0
  64. package/src/scss/layout/_footer.scss +2 -5
  65. package/src/scss/layout/_navbar.scss +21 -10
  66. package/src/scss/layout/_page.scss +80 -15
  67. package/src/scss/mixins/_functions.scss +16 -6
  68. package/src/scss/mixins/_mixins.scss +23 -28
  69. package/src/scss/tabler-vendors.scss +4 -3
  70. package/src/scss/tabler.scss +1 -1
  71. package/src/scss/ui/_accordion.scss +1 -0
  72. package/src/scss/ui/_alerts.scss +8 -3
  73. package/src/scss/ui/_avatars.scss +16 -11
  74. package/src/scss/ui/_badges.scss +19 -6
  75. package/src/scss/ui/_breadcrumbs.scss +9 -17
  76. package/src/scss/ui/_buttons.scss +76 -49
  77. package/src/scss/ui/_calendars.scss +3 -3
  78. package/src/scss/ui/_cards.scss +180 -65
  79. package/src/scss/ui/_carousel.scss +68 -0
  80. package/src/scss/ui/_dropdowns.scss +13 -2
  81. package/src/scss/ui/_flags.scss +3 -3
  82. package/src/scss/ui/_forms.scss +18 -10
  83. package/src/scss/ui/_grid.scss +20 -6
  84. package/src/scss/ui/_icons.scss +10 -3
  85. package/src/scss/ui/_images.scss +1 -1
  86. package/src/scss/ui/_legend.scss +1 -1
  87. package/src/scss/ui/_lists.scss +28 -2
  88. package/src/scss/ui/_markdown.scss +14 -28
  89. package/src/scss/ui/_modals.scss +2 -2
  90. package/src/scss/ui/_nav.scss +26 -36
  91. package/src/scss/ui/_offcanvas.scss +21 -0
  92. package/src/scss/ui/_placeholder.scss +9 -0
  93. package/src/scss/ui/_progress.scss +2 -1
  94. package/src/scss/ui/_ribbons.scss +7 -2
  95. package/src/scss/ui/_status.scss +172 -0
  96. package/src/scss/ui/_steps.scss +2 -2
  97. package/src/scss/ui/_switch-icon.scss +6 -5
  98. package/src/scss/ui/_tables.scss +53 -6
  99. package/src/scss/ui/_toasts.scss +17 -4
  100. package/src/scss/ui/_type.scss +9 -9
  101. package/src/scss/ui/forms/_form-check.scss +11 -3
  102. package/src/scss/ui/forms/_form-colorinput.scss +1 -1
  103. package/src/scss/ui/forms/_form-custom.scss +12 -0
  104. package/src/scss/ui/forms/_form-icon.scss +4 -2
  105. package/src/scss/ui/forms/_form-imagecheck.scss +5 -5
  106. package/src/scss/ui/forms/_form-selectgroup.scss +9 -3
  107. package/src/scss/ui/forms/_validation.scss +1 -1
  108. package/src/scss/utils/_background.scss +2 -2
  109. package/src/scss/utils/_colors.scss +8 -23
  110. package/src/scss/utils/_opacity.scss +1 -1
  111. package/src/scss/vendor/_apexcharts.scss +1 -47
  112. package/src/scss/vendor/_jsvectormap.scss +48 -0
  113. package/src/scss/vendor/_litepicker.scss +8 -3
  114. package/src/scss/vendor/_nouislider.scss +4 -2
  115. package/src/scss/vendor/_tom-select.scss +14 -0
  116. package/dist/libs/nouislider/distribute/nouislider.min.css +0 -2
  117. package/dist/libs/nouislider/distribute/nouislider.min.js +0 -2
  118. package/src/js/dropdown.js +0 -40
  119. package/src/scss/_dark.scss +0 -105
  120. package/src/scss/ui/_skeleton.scss +0 -98
  121. package/src/scss/vendor/_fullcalendar.scss +0 -63
@@ -1,156 +1,1193 @@
1
1
  /*!
2
- * Tabler v1.0.0-alpha.23 (https://tabler.io)
3
- * @version 1.0.0-alpha.23
2
+ * Tabler v1.0.0-beta10 (https://tabler.io)
3
+ * @version 1.0.0-beta10
4
4
  * @link https://tabler.io
5
- * Copyright 2018-2021 The Tabler Authors
6
- * Copyright 2018-2021 codecalm.net Paweł Kuna
5
+ * Copyright 2018-2022 The Tabler Authors
6
+ * Copyright 2018-2022 codecalm.net Paweł Kuna
7
7
  * Licensed under MIT (https://github.com/tabler/tabler/blob/master/LICENSE)
8
8
  */
9
- .apexcharts-title-text {
10
- font-weight: 600 !important; }
9
+ /* Functional styling;
10
+ * These styles are required for noUiSlider to function.
11
+ * You don't need to change these rules to apply your design.
12
+ */
13
+ .noUi-target,
14
+ .noUi-target * {
15
+ -webkit-touch-callout: none;
16
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
17
+ -webkit-user-select: none;
18
+ touch-action: none;
19
+ -ms-user-select: none;
20
+ -moz-user-select: none;
21
+ user-select: none;
22
+ box-sizing: border-box;
23
+ }
11
24
 
12
- .apexcharts-tooltip-title {
13
- font-weight: 600 !important;
14
- padding-bottom: .25rem !important; }
25
+ .noUi-target {
26
+ position: relative;
27
+ }
15
28
 
16
- .apexcharts-gridline,
17
- .apexcharts-ycrosshairs,
18
- .apexcharts-xaxis-tick {
19
- stroke: #e6e8e9 !important; }
29
+ .noUi-base,
30
+ .noUi-connects {
31
+ width: 100%;
32
+ height: 100%;
33
+ position: relative;
34
+ z-index: 1;
35
+ }
20
36
 
21
- .apexcharts-tooltip {
22
- line-height: 1;
23
- color: #ffffff;
24
- background: #232e3c !important;
25
- border: 0 !important;
26
- border-radius: 3px !important; }
37
+ /* Wrapper for all connect elements.
38
+ */
39
+ .noUi-connects {
40
+ overflow: hidden;
41
+ z-index: 0;
42
+ }
27
43
 
28
- .apexcharts-tooltip-title {
29
- margin: 0 !important;
30
- background: transparent !important;
31
- border: 0 !important; }
32
-
33
- .apexcharts-tooltip-series-group {
34
- padding: 0 8px !important; }
35
-
36
- .apexcharts-tooltip-marker {
37
- width: .5rem;
38
- height: .5rem; }
39
-
40
- .apexcharts-gridline,
41
- .apexcharts-ycrosshairs,
42
- .apexcharts-xaxis-tick {
43
- stroke: #e7eaef; }
44
-
45
- .apexcharts-yaxis-label,
46
- .apexcharts-xaxis-label {
47
- fill: #656d77; }
48
-
49
- .fc-unthemed .fc-content,
50
- .fc-unthemed .fc-divider,
51
- .fc-unthemed .fc-list-heading td,
52
- .fc-unthemed .fc-list-view,
53
- .fc-unthemed .fc-popover,
54
- .fc-unthemed .fc-row,
55
- .fc-unthemed tbody,
56
- .fc-unthemed td,
57
- .fc-unthemed th,
58
- .fc-unthemed thead {
59
- border-color: #e6e8e9; }
60
-
61
- .fc-unthemed .fc-toolbar h2 {
62
- font-size: 1.125rem;
63
- margin: 0; }
64
-
65
- .fc-unthemed .fc-widget-header {
66
- border: 0; }
67
-
68
- .fc-unthemed .fc-day-header {
69
- padding-bottom: .25rem;
70
- font-weight: 600; }
71
-
72
- .fc-unthemed.card-calendar .fc-day-grid-container {
73
- border-bottom: 0;
74
- border-left: 0; }
44
+ .noUi-connect,
45
+ .noUi-origin {
46
+ will-change: transform;
47
+ position: absolute;
48
+ z-index: 1;
49
+ top: 0;
50
+ right: 0;
51
+ height: 100%;
52
+ width: 100%;
53
+ -ms-transform-origin: 0 0;
54
+ -webkit-transform-origin: 0 0;
55
+ -webkit-transform-style: preserve-3d;
56
+ transform-origin: 0 0;
57
+ transform-style: flat;
58
+ }
75
59
 
76
- .fc-unthemed .fc-time {
77
- font-weight: 600; }
60
+ /* Offset direction
61
+ */
62
+ .noUi-txt-dir-rtl.noUi-horizontal .noUi-origin {
63
+ left: 0;
64
+ right: auto;
65
+ }
78
66
 
79
- .fc-unthemed .fc-event {
80
- border-color: rgba(0, 0, 0, 0.05);
81
- color: #206bc4;
82
- background-color: #edf3fa;
83
- padding: 0 .25rem; }
67
+ /* Give origins 0 height/width so they don't interfere with clicking the
68
+ * connect elements.
69
+ */
70
+ .noUi-vertical .noUi-origin {
71
+ top: -100%;
72
+ width: 0;
73
+ }
74
+
75
+ .noUi-horizontal .noUi-origin {
76
+ height: 0;
77
+ }
78
+
79
+ .noUi-handle {
80
+ -webkit-backface-visibility: hidden;
81
+ backface-visibility: hidden;
82
+ position: absolute;
83
+ }
84
+
85
+ .noUi-touch-area {
86
+ height: 100%;
87
+ width: 100%;
88
+ }
89
+
90
+ .noUi-state-tap .noUi-connect,
91
+ .noUi-state-tap .noUi-origin {
92
+ transition: transform 0.3s;
93
+ }
94
+
95
+ .noUi-state-drag * {
96
+ cursor: inherit !important;
97
+ }
98
+
99
+ /* Slider size and handle placement;
100
+ */
101
+ .noUi-horizontal {
102
+ height: 18px;
103
+ }
104
+
105
+ .noUi-horizontal .noUi-handle {
106
+ width: 34px;
107
+ height: 28px;
108
+ right: -17px;
109
+ top: -6px;
110
+ }
111
+
112
+ .noUi-vertical {
113
+ width: 18px;
114
+ }
115
+
116
+ .noUi-vertical .noUi-handle {
117
+ width: 28px;
118
+ height: 34px;
119
+ right: -6px;
120
+ bottom: -17px;
121
+ }
122
+
123
+ .noUi-txt-dir-rtl.noUi-horizontal .noUi-handle {
124
+ left: -17px;
125
+ right: auto;
126
+ }
127
+
128
+ /* Styling;
129
+ * Giving the connect element a border radius causes issues with using transform: scale
130
+ */
131
+ .noUi-target {
132
+ background: #FAFAFA;
133
+ border-radius: 4px;
134
+ border: 1px solid #D3D3D3;
135
+ box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB;
136
+ }
137
+
138
+ .noUi-connects {
139
+ border-radius: 3px;
140
+ }
141
+
142
+ .noUi-connect {
143
+ background: #3FB8AF;
144
+ }
145
+
146
+ /* Handles and cursors;
147
+ */
148
+ .noUi-draggable {
149
+ cursor: ew-resize;
150
+ }
151
+
152
+ .noUi-vertical .noUi-draggable {
153
+ cursor: ns-resize;
154
+ }
155
+
156
+ .noUi-handle {
157
+ border: 1px solid #D9D9D9;
158
+ border-radius: 3px;
159
+ background: #FFF;
160
+ cursor: default;
161
+ box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB;
162
+ }
163
+
164
+ .noUi-active {
165
+ box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB;
166
+ }
167
+
168
+ /* Handle stripes;
169
+ */
170
+ .noUi-handle:before,
171
+ .noUi-handle:after {
172
+ content: "";
173
+ display: block;
174
+ position: absolute;
175
+ height: 14px;
176
+ width: 1px;
177
+ background: #E8E7E6;
178
+ left: 14px;
179
+ top: 6px;
180
+ }
181
+
182
+ .noUi-handle:after {
183
+ left: 17px;
184
+ }
185
+
186
+ .noUi-vertical .noUi-handle:before,
187
+ .noUi-vertical .noUi-handle:after {
188
+ width: 14px;
189
+ height: 1px;
190
+ left: 6px;
191
+ top: 14px;
192
+ }
193
+
194
+ .noUi-vertical .noUi-handle:after {
195
+ top: 17px;
196
+ }
197
+
198
+ /* Disabled state;
199
+ */
200
+ [disabled] .noUi-connect {
201
+ background: #B8B8B8;
202
+ }
203
+
204
+ [disabled].noUi-target,
205
+ [disabled].noUi-handle,
206
+ [disabled] .noUi-handle {
207
+ cursor: not-allowed;
208
+ }
209
+
210
+ /* Base;
211
+ *
212
+ */
213
+ .noUi-pips,
214
+ .noUi-pips * {
215
+ box-sizing: border-box;
216
+ }
217
+
218
+ .noUi-pips {
219
+ position: absolute;
220
+ color: #999;
221
+ }
222
+
223
+ /* Values;
224
+ *
225
+ */
226
+ .noUi-value {
227
+ position: absolute;
228
+ white-space: nowrap;
229
+ text-align: center;
230
+ }
231
+
232
+ .noUi-value-sub {
233
+ color: #ccc;
234
+ font-size: 10px;
235
+ }
236
+
237
+ /* Markings;
238
+ *
239
+ */
240
+ .noUi-marker {
241
+ position: absolute;
242
+ background: #CCC;
243
+ }
244
+
245
+ .noUi-marker-sub {
246
+ background: #AAA;
247
+ }
248
+
249
+ .noUi-marker-large {
250
+ background: #AAA;
251
+ }
252
+
253
+ /* Horizontal layout;
254
+ *
255
+ */
256
+ .noUi-pips-horizontal {
257
+ padding: 10px 0;
258
+ height: 80px;
259
+ top: 100%;
260
+ left: 0;
261
+ width: 100%;
262
+ }
263
+
264
+ .noUi-value-horizontal {
265
+ transform: translate(-50%, 50%);
266
+ }
267
+
268
+ .noUi-rtl .noUi-value-horizontal {
269
+ transform: translate(50%, 50%);
270
+ }
271
+
272
+ .noUi-marker-horizontal.noUi-marker {
273
+ margin-left: -1px;
274
+ width: 2px;
275
+ height: 5px;
276
+ }
277
+
278
+ .noUi-marker-horizontal.noUi-marker-sub {
279
+ height: 10px;
280
+ }
281
+
282
+ .noUi-marker-horizontal.noUi-marker-large {
283
+ height: 15px;
284
+ }
285
+
286
+ /* Vertical layout;
287
+ *
288
+ */
289
+ .noUi-pips-vertical {
290
+ padding: 0 10px;
291
+ height: 100%;
292
+ top: 0;
293
+ left: 100%;
294
+ }
295
+
296
+ .noUi-value-vertical {
297
+ transform: translate(0, -50%);
298
+ padding-left: 25px;
299
+ }
300
+
301
+ .noUi-rtl .noUi-value-vertical {
302
+ transform: translate(0, 50%);
303
+ }
304
+
305
+ .noUi-marker-vertical.noUi-marker {
306
+ width: 5px;
307
+ height: 2px;
308
+ margin-top: -1px;
309
+ }
310
+
311
+ .noUi-marker-vertical.noUi-marker-sub {
312
+ width: 10px;
313
+ }
314
+
315
+ .noUi-marker-vertical.noUi-marker-large {
316
+ width: 15px;
317
+ }
318
+
319
+ .noUi-tooltip {
320
+ display: block;
321
+ position: absolute;
322
+ border: 1px solid #D9D9D9;
323
+ border-radius: 3px;
324
+ background: #fff;
325
+ color: #000;
326
+ padding: 5px;
327
+ text-align: center;
328
+ white-space: nowrap;
329
+ }
330
+
331
+ .noUi-horizontal .noUi-tooltip {
332
+ transform: translate(-50%, 0);
333
+ left: 50%;
334
+ bottom: 120%;
335
+ }
336
+
337
+ .noUi-vertical .noUi-tooltip {
338
+ transform: translate(0, -50%);
339
+ top: 50%;
340
+ right: 120%;
341
+ }
342
+
343
+ .noUi-horizontal .noUi-origin > .noUi-tooltip {
344
+ transform: translate(50%, 0);
345
+ left: auto;
346
+ bottom: 10px;
347
+ }
348
+
349
+ .noUi-vertical .noUi-origin > .noUi-tooltip {
350
+ transform: translate(0, -18px);
351
+ top: auto;
352
+ right: 28px;
353
+ }
84
354
 
85
355
  .noUi-target {
86
356
  border: 0;
87
357
  box-shadow: none;
88
358
  background: none;
89
359
  border-radius: 0;
90
- color: #206bc4; }
360
+ color: #206bc4;
361
+ }
91
362
 
92
363
  .noUi-horizontal {
93
364
  height: 1.25rem;
94
- padding: .5rem 0; }
365
+ padding: 0.5rem 0;
366
+ }
95
367
 
96
368
  .noUi-base {
97
- background: rgba(169, 174, 182, 0.24);
98
- border-radius: 1rem; }
369
+ background: var(--tblr-border-color-light);
370
+ border-radius: 1rem;
371
+ }
99
372
 
100
373
  .noUi-handle {
101
374
  width: 1rem;
102
375
  height: 1rem;
103
- border: 2px solid #ffffff;
376
+ border: 2px solid var(--tblr-border-color-light);
104
377
  box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
105
378
  border-radius: 1rem;
106
379
  background: currentColor;
107
- outline: 0; }
108
- .noUi-handle:before, .noUi-handle:after {
109
- content: none; }
110
- .noUi-horizontal .noUi-handle {
111
- width: 1rem;
112
- height: 1rem;
113
- top: -0.5rem;
114
- right: -0.5rem;
115
- margin: 1px 1px 0 0; }
116
- .noUi-handle.noUi-active, .noUi-handle:focus {
117
- box-shadow: 0 0 0 1px #f4f6fa, 0 0 0 0.25rem rgba(32, 107, 196, 0.25); }
380
+ outline: 0;
381
+ }
382
+ .noUi-handle:before, .noUi-handle:after {
383
+ content: none;
384
+ }
385
+ .noUi-horizontal .noUi-handle {
386
+ width: 1rem;
387
+ height: 1rem;
388
+ top: -0.5rem;
389
+ right: -0.5rem;
390
+ margin: 1px 1px 0 0;
391
+ }
392
+ .noUi-handle.noUi-active, .noUi-handle:focus {
393
+ box-shadow: 0 0 0 1px #f5f7fb, 0 0 0 0.25rem rgba(32, 107, 196, 0.25);
394
+ }
118
395
 
119
396
  .noUi-connect {
120
- background: currentColor; }
397
+ background: currentColor;
398
+ }
121
399
 
122
400
  .litepicker {
123
- --litepicker-month-weekday-color: #656d77;
124
- --litepicker-button-prev-month-color: #656d77;
125
- --litepicker-button-next-month-color: #656d77;
401
+ --litepicker-month-weekday-color: #626976;
402
+ --litepicker-button-prev-month-color: #626976;
403
+ --litepicker-button-next-month-color: #626976;
126
404
  --litepicker-button-prev-month-color-hover: #206bc4;
127
405
  --litepicker-button-next-month-color-hover: #206bc4;
406
+ --litepicker-day-color: var(--tblr-body-color);
128
407
  --litepicker-day-color-hover: #206bc4;
129
408
  --litepicker-is-end-color-bg: #206bc4;
130
409
  --litepicker-is-today-color: #206bc4;
410
+ --litepicker-month-header-color: var(--tblr-body-color);
411
+ --litepicker-container-months-color-bg: var(--tblr-card-bg);
131
412
  font: inherit;
132
413
  -webkit-user-select: none;
133
414
  -moz-user-select: none;
134
415
  -ms-user-select: none;
135
- user-select: none; }
136
- .litepicker svg {
137
- fill: none !important; }
138
- .litepicker .container__months {
139
- border: 1px solid rgba(101, 109, 119, 0.16);
140
- border-radius: 4px;
141
- box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); }
142
- .litepicker .container__months .month-item-name,
143
- .litepicker .container__months .month-item-year {
144
- font-weight: 500 !important; }
145
- .litepicker .container__months .button-next-month,
146
- .litepicker .container__months .button-prev-month {
147
- cursor: pointer !important; }
148
- .litepicker .container__months .month-item-weekdays-row > div {
149
- padding: .5rem 0 !important;
150
- font-size: 0.75rem; }
416
+ user-select: none;
417
+ }
418
+ .litepicker svg {
419
+ fill: none !important;
420
+ }
421
+ .litepicker .container__main {
422
+ border: 1px solid var(--tblr-border-color);
423
+ border-radius: 4px;
424
+ box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
425
+ }
426
+ .litepicker .container__months .month-item-name,
427
+ .litepicker .container__months .month-item-year {
428
+ font-weight: 500 !important;
429
+ }
430
+ .litepicker .container__months .button-next-month,
431
+ .litepicker .container__months .button-prev-month {
432
+ cursor: pointer !important;
433
+ }
434
+ .litepicker .container__months .month-item-weekdays-row > div {
435
+ padding: 0.5rem 0 !important;
436
+ font-size: 0.75rem;
437
+ }
438
+ .litepicker .container__days .day-item {
439
+ cursor: pointer !important;
440
+ padding: 0.5rem 0 !important;
441
+ transition: color 0.3s, background-color 0.3s, border-color 0.3s;
442
+ }
443
+ @media (prefers-reduced-motion: reduce) {
151
444
  .litepicker .container__days .day-item {
152
- cursor: pointer !important;
153
- padding: .5rem 0 !important;
154
- transition: .3s color, .3s background-color, .3s border-color; }
155
- .datepicker-inline .litepicker .container__months {
156
- box-shadow: none; }
445
+ transition: none;
446
+ }
447
+ }
448
+ .datepicker-inline .litepicker .container__months {
449
+ box-shadow: none;
450
+ }
451
+
452
+ /**
453
+ * Tom Select bootstrap 5
454
+ */
455
+ /**
456
+ * tom-select.css (v//@@version)
457
+ * Copyright (c) contributors
458
+ *
459
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
460
+ * file except in compliance with the License. You may obtain a copy of the License at:
461
+ * http://www.apache.org/licenses/LICENSE-2.0
462
+ *
463
+ * Unless required by applicable law or agreed to in writing, software distributed under
464
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
465
+ * ANY KIND, either express or implied. See the License for the specific language
466
+ * governing permissions and limitations under the License.
467
+ *
468
+ */
469
+ .ts-wrapper.single .ts-control, .ts-wrapper.single .ts-control input {
470
+ cursor: pointer;
471
+ }
472
+
473
+ .ts-wrapper.plugin-drag_drop.multi > .ts-control > div.ui-sortable-placeholder {
474
+ visibility: visible !important;
475
+ background: #f2f2f2 !important;
476
+ background: rgba(0, 0, 0, 0.06) !important;
477
+ border: 0 none !important;
478
+ box-shadow: inset 0 0 12px 4px #fff;
479
+ }
480
+ .ts-wrapper.plugin-drag_drop .ui-sortable-placeholder::after {
481
+ content: "!";
482
+ visibility: hidden;
483
+ }
484
+ .ts-wrapper.plugin-drag_drop .ui-sortable-helper {
485
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
486
+ }
487
+
488
+ .plugin-checkbox_options .option input {
489
+ margin-right: 0.5rem;
490
+ }
491
+
492
+ .plugin-clear_button .ts-control {
493
+ padding-right: calc(1em + (3 * 5px)) !important;
494
+ }
495
+ .plugin-clear_button .clear-button {
496
+ opacity: 0;
497
+ position: absolute;
498
+ top: 0.4375rem;
499
+ right: calc(0.75rem - 5px);
500
+ margin-right: 0 !important;
501
+ background: transparent !important;
502
+ transition: opacity 0.5s;
503
+ cursor: pointer;
504
+ }
505
+ .plugin-clear_button.single .clear-button {
506
+ right: calc(0.75rem - 5px + 2rem);
507
+ }
508
+ .plugin-clear_button.focus.has-items .clear-button, .plugin-clear_button:not(.disabled):hover.has-items .clear-button {
509
+ opacity: 1;
510
+ }
511
+
512
+ .ts-wrapper .dropdown-header {
513
+ position: relative;
514
+ padding: 6px 0.75rem;
515
+ border-bottom: 1px solid #d0d0d0;
516
+ background: #f8f8f8;
517
+ border-radius: 4px 4px 0 0;
518
+ }
519
+ .ts-wrapper .dropdown-header-close {
520
+ position: absolute;
521
+ right: 0.75rem;
522
+ top: 50%;
523
+ color: #1e293b;
524
+ opacity: 0.4;
525
+ margin-top: -12px;
526
+ line-height: 20px;
527
+ font-size: 20px !important;
528
+ }
529
+ .ts-wrapper .dropdown-header-close:hover {
530
+ color: black;
531
+ }
532
+
533
+ .plugin-dropdown_input.focus.dropdown-active .ts-control {
534
+ box-shadow: none;
535
+ border: 1px solid #d9dbde;
536
+ box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
537
+ }
538
+ .plugin-dropdown_input .dropdown-input {
539
+ border: 1px solid #d0d0d0;
540
+ border-width: 0 0 1px 0;
541
+ display: block;
542
+ padding: 0.4375rem 0.75rem;
543
+ box-shadow: none;
544
+ width: 100%;
545
+ background: transparent;
546
+ }
547
+ .plugin-dropdown_input.focus ~ .ts-dropdown .dropdown-input {
548
+ border-color: #90b5e2;
549
+ outline: 0;
550
+ box-shadow: 0 0 0 0.25rem rgba(32, 107, 196, 0.25);
551
+ }
552
+
553
+ .ts-wrapper.plugin-input_autogrow.has-items .ts-control > input {
554
+ min-width: 0;
555
+ }
556
+ .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input {
557
+ flex: none;
558
+ min-width: 4px;
559
+ }
560
+ .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::-webkit-input-placeholder {
561
+ color: transparent;
562
+ }
563
+ .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::-moz-placeholder {
564
+ color: transparent;
565
+ }
566
+ .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input:-ms-input-placeholder {
567
+ color: transparent;
568
+ }
569
+ .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::-ms-input-placeholder {
570
+ color: transparent;
571
+ }
572
+ .ts-wrapper.plugin-input_autogrow.has-items.focus .ts-control > input::placeholder {
573
+ color: transparent;
574
+ }
575
+
576
+ .ts-dropdown.plugin-optgroup_columns .ts-dropdown-content {
577
+ display: flex;
578
+ }
579
+ .ts-dropdown.plugin-optgroup_columns .optgroup {
580
+ border-right: 1px solid #f2f2f2;
581
+ border-top: 0 none;
582
+ flex-grow: 1;
583
+ flex-basis: 0;
584
+ min-width: 0;
585
+ }
586
+ .ts-dropdown.plugin-optgroup_columns .optgroup:last-child {
587
+ border-right: 0 none;
588
+ }
589
+ .ts-dropdown.plugin-optgroup_columns .optgroup:before {
590
+ display: none;
591
+ }
592
+ .ts-dropdown.plugin-optgroup_columns .optgroup-header {
593
+ border-top: 0 none;
594
+ }
595
+
596
+ .ts-wrapper.plugin-remove_button .item {
597
+ display: inline-flex;
598
+ align-items: center;
599
+ padding-right: 0 !important;
600
+ }
601
+ .ts-wrapper.plugin-remove_button .item .remove {
602
+ color: inherit;
603
+ text-decoration: none;
604
+ vertical-align: middle;
605
+ display: inline-block;
606
+ padding: 0 5px;
607
+ border-left: 1px solid #e6e7e9;
608
+ border-radius: 0 2px 2px 0;
609
+ box-sizing: border-box;
610
+ margin-left: 5px;
611
+ }
612
+ .ts-wrapper.plugin-remove_button .item .remove:hover {
613
+ background: rgba(0, 0, 0, 0.05);
614
+ }
615
+ .ts-wrapper.plugin-remove_button .item.active .remove {
616
+ border-left-color: rgba(0, 0, 0, 0);
617
+ }
618
+ .ts-wrapper.plugin-remove_button.disabled .item .remove:hover {
619
+ background: none;
620
+ }
621
+ .ts-wrapper.plugin-remove_button.disabled .item .remove {
622
+ border-left-color: white;
623
+ }
624
+ .ts-wrapper.plugin-remove_button .remove-single {
625
+ position: absolute;
626
+ right: 0;
627
+ top: 0;
628
+ font-size: 23px;
629
+ }
630
+
631
+ .ts-wrapper {
632
+ position: relative;
633
+ }
634
+
635
+ .ts-dropdown,
636
+ .ts-control,
637
+ .ts-control input {
638
+ color: #1e293b;
639
+ font-family: inherit;
640
+ font-size: inherit;
641
+ line-height: 1.4285714286;
642
+ font-smoothing: inherit;
643
+ }
644
+
645
+ .ts-control,
646
+ .ts-wrapper.single.input-active .ts-control {
647
+ background: #ffffff;
648
+ cursor: text;
649
+ }
650
+
651
+ .ts-control {
652
+ border: 1px solid #d9dbde;
653
+ padding: 0.4375rem 0.75rem;
654
+ width: 100%;
655
+ overflow: hidden;
656
+ position: relative;
657
+ z-index: 1;
658
+ box-sizing: border-box;
659
+ box-shadow: none;
660
+ border-radius: 4px;
661
+ display: flex;
662
+ flex-wrap: wrap;
663
+ }
664
+ .ts-wrapper.multi.has-items .ts-control {
665
+ padding: calc( 0.4375rem - 1px - 0px) 0.75rem calc( 0.4375rem - 1px - 3px - 0px);
666
+ }
667
+ .full .ts-control {
668
+ background-color: #ffffff;
669
+ }
670
+ .disabled .ts-control, .disabled .ts-control * {
671
+ cursor: default !important;
672
+ }
673
+ .focus .ts-control {
674
+ box-shadow: none;
675
+ }
676
+ .ts-control > * {
677
+ vertical-align: baseline;
678
+ display: inline-block;
679
+ }
680
+ .ts-wrapper.multi .ts-control > div {
681
+ cursor: pointer;
682
+ margin: 0 3px 3px 0;
683
+ padding: 1px 5px;
684
+ background: #efefef;
685
+ color: #1e293b;
686
+ border: 0px solid #e6e7e9;
687
+ }
688
+ .ts-wrapper.multi .ts-control > div.active {
689
+ background: #206bc4;
690
+ color: #fff;
691
+ border: 0px solid rgba(0, 0, 0, 0);
692
+ }
693
+ .ts-wrapper.multi.disabled .ts-control > div, .ts-wrapper.multi.disabled .ts-control > div.active {
694
+ color: #797979;
695
+ background: white;
696
+ border: 0px solid white;
697
+ }
698
+ .ts-control > input {
699
+ flex: 1 1 auto;
700
+ min-width: 7rem;
701
+ display: inline-block !important;
702
+ padding: 0 !important;
703
+ min-height: 0 !important;
704
+ max-height: none !important;
705
+ max-width: 100% !important;
706
+ margin: 0 !important;
707
+ text-indent: 0 !important;
708
+ border: 0 none !important;
709
+ background: none !important;
710
+ line-height: inherit !important;
711
+ -webkit-user-select: auto !important;
712
+ -moz-user-select: auto !important;
713
+ -ms-user-select: auto !important;
714
+ user-select: auto !important;
715
+ box-shadow: none !important;
716
+ }
717
+ .ts-control > input::-ms-clear {
718
+ display: none;
719
+ }
720
+ .ts-control > input:focus {
721
+ outline: none !important;
722
+ }
723
+ .has-items .ts-control > input {
724
+ margin: 0 4px !important;
725
+ }
726
+ .ts-control.rtl {
727
+ text-align: right;
728
+ }
729
+ .ts-control.rtl.single .ts-control:after {
730
+ left: calc(0.75rem + 5px);
731
+ right: auto;
732
+ }
733
+ .ts-control.rtl .ts-control > input {
734
+ margin: 0 4px 0 -2px !important;
735
+ }
736
+ .disabled .ts-control {
737
+ opacity: 0.5;
738
+ background-color: #fafbfc;
739
+ }
740
+ .input-hidden .ts-control > input {
741
+ opacity: 0;
742
+ position: absolute;
743
+ left: -10000px;
744
+ }
745
+
746
+ .ts-dropdown {
747
+ position: absolute;
748
+ top: 100%;
749
+ left: 0;
750
+ width: 100%;
751
+ z-index: 10;
752
+ border: 1px solid #d0d0d0;
753
+ background: #ffffff;
754
+ margin: 0.25rem 0 0 0;
755
+ border-top: 0 none;
756
+ box-sizing: border-box;
757
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
758
+ border-radius: 0 0 4px 4px;
759
+ }
760
+ .ts-dropdown [data-selectable] {
761
+ cursor: pointer;
762
+ overflow: hidden;
763
+ }
764
+ .ts-dropdown [data-selectable] .highlight {
765
+ background: rgba(255, 237, 40, 0.4);
766
+ border-radius: 1px;
767
+ }
768
+ .ts-dropdown .option,
769
+ .ts-dropdown .optgroup-header,
770
+ .ts-dropdown .no-results,
771
+ .ts-dropdown .create {
772
+ padding: 3px 0.75rem;
773
+ }
774
+ .ts-dropdown .option, .ts-dropdown [data-disabled], .ts-dropdown [data-disabled] [data-selectable].option {
775
+ cursor: inherit;
776
+ opacity: 0.5;
777
+ }
778
+ .ts-dropdown [data-selectable].option {
779
+ opacity: 1;
780
+ cursor: pointer;
781
+ }
782
+ .ts-dropdown .optgroup:first-child .optgroup-header {
783
+ border-top: 0 none;
784
+ }
785
+ .ts-dropdown .optgroup-header {
786
+ color: #475569;
787
+ background: #ffffff;
788
+ cursor: default;
789
+ }
790
+ .ts-dropdown .create:hover,
791
+ .ts-dropdown .option:hover,
792
+ .ts-dropdown .active {
793
+ background-color: rgba(98, 105, 118, 0.04);
794
+ color: inherit;
795
+ }
796
+ .ts-dropdown .create:hover.create,
797
+ .ts-dropdown .option:hover.create,
798
+ .ts-dropdown .active.create {
799
+ color: inherit;
800
+ }
801
+ .ts-dropdown .create {
802
+ color: rgba(30, 41, 59, 0.5);
803
+ }
804
+ .ts-dropdown .spinner {
805
+ display: inline-block;
806
+ width: 30px;
807
+ height: 30px;
808
+ margin: 3px 0.75rem;
809
+ }
810
+ .ts-dropdown .spinner:after {
811
+ content: " ";
812
+ display: block;
813
+ width: 24px;
814
+ height: 24px;
815
+ margin: 3px;
816
+ border-radius: 50%;
817
+ border: 5px solid #d0d0d0;
818
+ border-color: #d0d0d0 transparent #d0d0d0 transparent;
819
+ -webkit-animation: lds-dual-ring 1.2s linear infinite;
820
+ animation: lds-dual-ring 1.2s linear infinite;
821
+ }
822
+ @-webkit-keyframes lds-dual-ring {
823
+ 0% {
824
+ transform: rotate(0deg);
825
+ }
826
+ 100% {
827
+ transform: rotate(360deg);
828
+ }
829
+ }
830
+ @keyframes lds-dual-ring {
831
+ 0% {
832
+ transform: rotate(0deg);
833
+ }
834
+ 100% {
835
+ transform: rotate(360deg);
836
+ }
837
+ }
838
+
839
+ .ts-dropdown-content {
840
+ overflow-y: auto;
841
+ overflow-x: hidden;
842
+ max-height: 200px;
843
+ overflow-scrolling: touch;
844
+ scroll-behavior: smooth;
845
+ }
846
+
847
+ .ts-hidden-accessible {
848
+ border: 0 !important;
849
+ clip: rect(0 0 0 0) !important;
850
+ -webkit-clip-path: inset(50%) !important;
851
+ clip-path: inset(50%) !important;
852
+ overflow: hidden !important;
853
+ padding: 0 !important;
854
+ position: absolute !important;
855
+ width: 1px !important;
856
+ white-space: nowrap !important;
857
+ }
858
+
859
+ .ts-wrapper.form-control,
860
+ .ts-wrapper.form-select {
861
+ padding: 0 !important;
862
+ }
863
+
864
+ .ts-dropdown,
865
+ .ts-dropdown.form-control,
866
+ .ts-dropdown.form-select {
867
+ height: auto;
868
+ padding: 0;
869
+ z-index: 1000;
870
+ background: #ffffff;
871
+ border: 1px solid rgba(98, 105, 118, 0.16);
872
+ border-radius: 4px;
873
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
874
+ }
875
+
876
+ .ts-dropdown .optgroup-header {
877
+ font-size: 0.765625rem;
878
+ line-height: 1.4285714286;
879
+ }
880
+ .ts-dropdown .optgroup:first-child:before {
881
+ display: none;
882
+ }
883
+ .ts-dropdown .optgroup:before {
884
+ content: " ";
885
+ display: block;
886
+ height: 0;
887
+ margin: 0.5rem 0;
888
+ overflow: hidden;
889
+ border-top: 1px solid rgba(98, 105, 118, 0.16);
890
+ margin-left: -0.75rem;
891
+ margin-right: -0.75rem;
892
+ }
893
+ .ts-dropdown .create {
894
+ padding-left: 0.75rem;
895
+ }
896
+
897
+ .ts-dropdown-content {
898
+ padding: 5px 0;
899
+ }
900
+
901
+ .ts-control {
902
+ min-height: calc(1.4285714286em + 0.875rem + 2px);
903
+ transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
904
+ display: flex;
905
+ align-items: center;
906
+ }
907
+ @media (prefers-reduced-motion: reduce) {
908
+ .ts-control {
909
+ transition: none;
910
+ }
911
+ }
912
+ .ts-control.dropdown -active {
913
+ border-radius: 4px;
914
+ }
915
+ .focus .ts-control {
916
+ border-color: #90b5e2;
917
+ outline: 0;
918
+ box-shadow: 0 0 0 0.25rem rgba(32, 107, 196, 0.25);
919
+ }
920
+ .ts-control .item {
921
+ display: flex;
922
+ align-items: center;
923
+ }
924
+
925
+ .is-invalid .ts-control,
926
+ .was-validated .invalid .ts-control {
927
+ border-color: #d63939;
928
+ }
929
+ .focus .is-invalid .ts-control,
930
+ .focus .was-validated .invalid .ts-control {
931
+ border-color: #b62626;
932
+ box-shadow: 0 0 0 0.25rem rgba(214, 57, 57, 0.25);
933
+ }
934
+
935
+ .is-valid .ts-control {
936
+ border-color: #2fb344;
937
+ }
938
+ .focus .is-valid .ts-control {
939
+ border-color: #2fb344;
940
+ box-shadow: 0 0 0 0.25rem rgba(47, 179, 68, 0.25);
941
+ }
942
+
943
+ .input-group-sm > .ts-wrapper .ts-control, .ts-wrapper.form-select-sm .ts-control, .ts-wrapper.form-control-sm .ts-control {
944
+ min-height: calc(1.4285714286em + 0.25rem + 2px);
945
+ padding: 0 0.75rem;
946
+ border-radius: 2px;
947
+ font-size: 0.75rem;
948
+ }
949
+ .input-group-sm > .ts-wrapper.has-items .ts-control, .ts-wrapper.form-select-sm.has-items .ts-control, .ts-wrapper.form-control-sm.has-items .ts-control {
950
+ min-height: calc(1.4285714286em + 0.25rem + 2px) !important;
951
+ font-size: 0.75rem;
952
+ padding-bottom: 0;
953
+ }
954
+ .input-group-sm > .ts-wrapper.multi.has-items .ts-control, .ts-wrapper.form-select-sm.multi.has-items .ts-control, .ts-wrapper.form-control-sm.multi.has-items .ts-control {
955
+ padding-top: calc((calc(1.4285714286em + 0.25rem + 2px) - (1.4285714286 * 0.75rem) - 4px) / 2) !important;
956
+ }
957
+ .ts-wrapper.multi.has-items .ts-control {
958
+ padding-left: calc(0.75rem - 5px);
959
+ padding-right: calc(0.75rem - 5px);
960
+ }
961
+ .ts-wrapper.multi .ts-control > div {
962
+ border-radius: calc(4px - 1px);
963
+ }
964
+ .input-group-lg > .ts-wrapper > .ts-control, .ts-wrapper.form-control-lg .ts-control, .ts-wrapper.form-select-lg .ts-control {
965
+ min-height: calc(1.4285714286em + 1rem + 2px);
966
+ border-radius: 8px;
967
+ font-size: 1.25rem;
968
+ }
969
+
970
+ .ts-wrapper:not(.form-select) {
971
+ padding: 0;
972
+ border: none;
973
+ height: auto;
974
+ box-shadow: none;
975
+ background: none;
976
+ }
977
+ .ts-wrapper:not(.form-select).single .ts-control {
978
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23a5a9b1' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
979
+ background-repeat: no-repeat;
980
+ background-position: right 0.75rem center;
981
+ background-size: 16px 12px;
982
+ padding-right: 2rem;
983
+ }
984
+
985
+ .ts-wrapper.form-select {
986
+ padding: 0;
987
+ height: auto;
988
+ box-shadow: none;
989
+ }
990
+ .ts-wrapper.form-select .ts-control, .ts-wrapper.form-select.single.input-active .ts-control {
991
+ border: none !important;
992
+ background: transparent !important;
993
+ }
994
+
995
+ .input-group > .ts-wrapper {
996
+ flex-grow: 1;
997
+ }
998
+ .input-group > .ts-wrapper:not(:nth-child(2)) > .ts-control {
999
+ border-top-left-radius: 0;
1000
+ border-bottom-left-radius: 0;
1001
+ }
1002
+ .input-group > .ts-wrapper:not(:last-child) > .ts-control {
1003
+ border-top-right-radius: 0;
1004
+ border-bottom-right-radius: 0;
1005
+ }
1006
+
1007
+ .ts-input {
1008
+ color: inherit;
1009
+ }
1010
+
1011
+ .ts-control {
1012
+ color: inherit;
1013
+ }
1014
+ .ts-control .dropdown-menu {
1015
+ width: 100%;
1016
+ height: auto;
1017
+ }
1018
+
1019
+ svg {
1020
+ touch-action: none;
1021
+ }
1022
+
1023
+ image, text, .jvm-zoomin, .jvm-zoomout {
1024
+ -webkit-user-select: none;
1025
+ -moz-user-select: none;
1026
+ -ms-user-select: none;
1027
+ user-select: none;
1028
+ }
1029
+
1030
+ .jvm-container {
1031
+ touch-action: none;
1032
+ position: relative;
1033
+ overflow: hidden;
1034
+ height: 100%;
1035
+ width: 100%;
1036
+ }
1037
+
1038
+ .jvm-tooltip {
1039
+ border-radius: 3px;
1040
+ background-color: #5c5cff;
1041
+ font-family: sans-serif, Verdana;
1042
+ font-size: smaller;
1043
+ box-shadow: 1px 2px 12px rgba(0, 0, 0, 0.2);
1044
+ padding: 3px 5px;
1045
+ white-space: nowrap;
1046
+ position: absolute;
1047
+ display: none;
1048
+ color: #FFF;
1049
+ }
1050
+
1051
+ .jvm-tooltip.active {
1052
+ display: block;
1053
+ }
1054
+
1055
+ .jvm-zoom-btn {
1056
+ border-radius: 3px;
1057
+ background-color: #292929;
1058
+ padding: 3px;
1059
+ box-sizing: border-box;
1060
+ position: absolute;
1061
+ line-height: 10px;
1062
+ cursor: pointer;
1063
+ color: #FFF;
1064
+ height: 15px;
1065
+ width: 15px;
1066
+ left: 10px;
1067
+ }
1068
+
1069
+ .jvm-zoom-btn.jvm-zoomout {
1070
+ top: 30px;
1071
+ }
1072
+
1073
+ .jvm-zoom-btn.jvm-zoomin {
1074
+ top: 10px;
1075
+ }
1076
+
1077
+ .jvm-series-container {
1078
+ right: 15px;
1079
+ position: absolute;
1080
+ }
1081
+
1082
+ .jvm-series-container.jvm-series-h {
1083
+ bottom: 15px;
1084
+ }
1085
+
1086
+ .jvm-series-container.jvm-series-v {
1087
+ top: 15px;
1088
+ }
1089
+
1090
+ .jvm-series-container .jvm-legend {
1091
+ background-color: #FFF;
1092
+ border: 1px solid #e5e7eb;
1093
+ margin-left: 0.75rem;
1094
+ border-radius: 0.25rem;
1095
+ border-color: #e5e7eb;
1096
+ padding: 0.6rem;
1097
+ box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
1098
+ float: left;
1099
+ }
1100
+
1101
+ .jvm-series-container .jvm-legend .jvm-legend-title {
1102
+ line-height: 1;
1103
+ border-bottom: 1px solid #e5e7eb;
1104
+ padding-bottom: 0.5rem;
1105
+ margin-bottom: 0.575rem;
1106
+ text-align: left;
1107
+ }
1108
+
1109
+ .jvm-series-container .jvm-legend .jvm-legend-inner {
1110
+ overflow: hidden;
1111
+ }
1112
+
1113
+ .jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick {
1114
+ overflow: hidden;
1115
+ min-width: 40px;
1116
+ }
1117
+
1118
+ .jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick:not(:first-child) {
1119
+ margin-top: 0.575rem;
1120
+ }
1121
+
1122
+ .jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick .jvm-legend-tick-sample {
1123
+ border-radius: 4px;
1124
+ margin-right: 0.65rem;
1125
+ height: 16px;
1126
+ width: 16px;
1127
+ float: left;
1128
+ }
1129
+
1130
+ .jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick .jvm-legend-tick-text {
1131
+ font-size: 12px;
1132
+ text-align: center;
1133
+ float: left;
1134
+ }
1135
+
1136
+ .jvm-line[animation=true] {
1137
+ -webkit-animation: jvm-line-animation 10s linear forwards infinite;
1138
+ animation: jvm-line-animation 10s linear forwards infinite;
1139
+ }
1140
+
1141
+ @-webkit-keyframes jvm-line-animation {
1142
+ from {
1143
+ stroke-dashoffset: 250;
1144
+ }
1145
+ }
1146
+ @keyframes jvm-line-animation {
1147
+ from {
1148
+ stroke-dashoffset: 250;
1149
+ }
1150
+ }
1151
+ .jvm-tooltip {
1152
+ background: #1e293b;
1153
+ font-family: inherit;
1154
+ font-size: 0.75rem;
1155
+ box-shadow: rgba(30, 41, 59, 0.04) 0 2px 4px 0;
1156
+ }
1157
+
1158
+ .jvm-series-container .jvm-legend .jvm-legend-title {
1159
+ border-bottom: 0;
1160
+ font-weight: 500;
1161
+ }
1162
+
1163
+ .jvm-series-container .jvm-legend {
1164
+ background-color: var(--tblr-card-bg);
1165
+ border: 1px solid var(--tblr-border-color);
1166
+ min-width: 8rem;
1167
+ }
1168
+ .jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick {
1169
+ display: flex;
1170
+ align-items: center;
1171
+ }
1172
+ .jvm-series-container .jvm-legend .jvm-legend-inner .jvm-legend-tick .jvm-legend-tick-sample {
1173
+ width: 0.75rem;
1174
+ height: 0.75rem;
1175
+ }
1176
+
1177
+ .jvm-zoom-btn {
1178
+ border: 1px solid var(--tblr-border-color);
1179
+ background: var(--tblr-card-bg);
1180
+ color: var(--tblr-body-color);
1181
+ padding: 0;
1182
+ display: flex;
1183
+ align-items: center;
1184
+ justify-content: center;
1185
+ line-height: 1;
1186
+ width: 1.5rem;
1187
+ height: 1.5rem;
1188
+ font-size: 1rem;
1189
+ box-shadow: rgba(30, 41, 59, 0.04) 0 2px 4px 0;
1190
+ }
1191
+ .jvm-zoom-btn.jvm-zoomout {
1192
+ top: 2.5rem;
1193
+ }