react-core-ts 1.1.26 → 1.1.28

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.
@@ -1,501 +0,0 @@
1
- .tooltip-container {
2
- position: relative;
3
- transition: background-color 0.3s, width 0.3s, height 0.3s, color 0.3s;
4
- }
5
-
6
- .bottom {
7
- .tooltip {
8
- position: absolute;
9
- bottom: -40;
10
- right: 3px;
11
- transform: translateX(0%);
12
- padding: 0.3em 0.6em;
13
- opacity: 0;
14
- width: max-content;
15
- max-width: 100%;
16
- z-index: 999;
17
- font-size: 12px;
18
- color: #fff !important;
19
- pointer-events: none;
20
- transition: all 0.3s;
21
- border: 1px solid #e55353;
22
- background-color: #e55353;
23
- border-radius: 6px;
24
- color: rgb(34, 34, 34);
25
-
26
- &.info {
27
- color: #ffffff !important;
28
- border: 1px solid #ffffff;
29
- background-color: #000000;
30
- right: 1px;
31
- top: 5px;
32
- }
33
-
34
- &.card {
35
- color: #ffffff !important;
36
- border: 1px solid #ffffff;
37
- background-color: #000000;
38
- right: -8px;
39
- top: 5px;
40
- }
41
- }
42
-
43
- .tooltip::before {
44
- position: absolute;
45
- content: "";
46
- height: 0.6em;
47
- width: 0.6em;
48
- right: 20px;
49
- z-index: 999;
50
- top: -4px;
51
- border: 1px solid #e55353;
52
- border-right: none;
53
- border-bottom: none;
54
- transform: translate(50%) rotate(45deg);
55
- background-color: #e55353;
56
- }
57
-
58
- .info.tooltip::before {
59
- border: 1px solid #000000;
60
- background-color: #000000;
61
- right: 14px;
62
- position: absolute;
63
- content: "";
64
- height: 0.6em;
65
- width: 0.6em;
66
- z-index: 999;
67
- top: -4px;
68
- border-right: none;
69
- border-bottom: none;
70
- transform: translate(50%) rotate(45deg);
71
- }
72
-
73
- .card.tooltip::before {
74
- border: 1px solid #000000;
75
- background-color: #000000;
76
- right: 14px;
77
- position: absolute;
78
- content: "";
79
- height: 0.6em;
80
- width: 0.6em;
81
- z-index: 999;
82
- top: -3px;
83
- border-right: none;
84
- border-bottom: none;
85
- transform: translate(50%) rotate(45deg);
86
- }
87
-
88
- .tooltip-container:hover .tooltip {
89
- top: 46px;
90
- opacity: 1;
91
- visibility: visible;
92
- z-index: 999;
93
- pointer-events: auto;
94
-
95
- &.info {
96
- top: 30px;
97
- max-width: 500px;
98
- position: absolute;
99
- }
100
-
101
- &.card {
102
- top: 20px;
103
- max-width: 300px;
104
- position: absolute;
105
- }
106
- }
107
- }
108
- .top-tool {
109
- .tooltip-info {
110
- position: absolute;
111
- bottom: 45px !important;
112
- left: 0;
113
- top: auto !important;
114
- transform: translateX(0%);
115
- padding: 0.3em 0.6em;
116
- opacity: 0;
117
- width: max-content;
118
- white-space: normal;
119
- z-index: 999;
120
- font-size: 12px;
121
- max-width: 100%;
122
- color: white !important;
123
- pointer-events: none;
124
- transition: all 0.3s;
125
- border: 1px solid #475467;
126
- background-color: #475467;
127
- border-radius: 6px;
128
- color: rgb(34, 34, 34);
129
- }
130
-
131
- .tooltip-info::before {
132
- position: absolute;
133
- content: "";
134
- height: 0.6em;
135
- width: 0.6em;
136
- z-index: 999;
137
- bottom: -4px;
138
- border: 1px solid #475467;
139
- border-left: none;
140
- border-top: none;
141
- transform: translate(50%) rotate(45deg);
142
- background-color: #475467;
143
- }
144
-
145
- .tooltip-container:hover .tooltip-info {
146
- bottom: 45px !important;
147
- opacity: 1;
148
- top: auto !important;
149
- visibility: visible;
150
- z-index: 999;
151
- pointer-events: auto;
152
- }
153
- .tooltip {
154
- position: absolute;
155
- bottom: 45px !important;
156
- left: 0;
157
- top: auto !important;
158
- transform: translateX(0%);
159
- padding: 0.3em 0.6em;
160
- opacity: 0;
161
- width: max-content;
162
- white-space: normal;
163
- z-index: 999;
164
- font-size: 12px;
165
- max-width: 100%;
166
- color: #ff681d !important;
167
- pointer-events: none;
168
- transition: all 0.3s;
169
- border: 1px solid #ff681d;
170
- background-color: #fff;
171
- border-radius: 6px;
172
- color: rgb(34, 34, 34);
173
- }
174
-
175
- .tooltip::before {
176
- position: absolute;
177
- content: "";
178
- height: 0.6em;
179
- width: 0.6em;
180
- z-index: 999;
181
- bottom: -4px;
182
- border: 1px solid #ff681d;
183
- border-left: none;
184
- border-top: none;
185
- transform: translate(50%) rotate(45deg);
186
- background-color: #fff;
187
- }
188
-
189
- .tooltip-container:hover .tooltip {
190
- bottom: 45px !important;
191
- opacity: 1;
192
- top: auto !important;
193
- visibility: visible;
194
- z-index: 999;
195
- pointer-events: auto;
196
- }
197
- }
198
- .bottom-tool {
199
- .tooltip-info {
200
- position: absolute;
201
- bottom: -40;
202
- transform: translateX(0%);
203
- padding: 0.3em 0.6em;
204
- opacity: 0;
205
- width: max-content;
206
- max-width: 100%;
207
- z-index: 999;
208
- font-size: 12px;
209
- color: white !important;
210
- white-space: wrap;
211
- pointer-events: none;
212
- transition: background-color 0.3s, width 0.3s, height 0.3s, color 0.3s;
213
- border: 1px solid #475467;
214
- background-color: #475467;
215
- border-radius: 6px;
216
- color: rgb(34, 34, 34);
217
- }
218
-
219
- .tooltip-info::before {
220
- position: absolute;
221
- content: "";
222
- height: 0.6em;
223
- width: 0.6em;
224
- z-index: 999;
225
- top: -4px;
226
- border: 1px solid #475467;
227
- border-right: none;
228
- border-bottom: none;
229
- transform: translate(50%) rotate(45deg);
230
- background-color: #475467;
231
- }
232
-
233
- .tooltip-container:hover .tooltip-info {
234
- top: 46px;
235
- opacity: 1;
236
- visibility: visible;
237
- z-index: 999;
238
- pointer-events: auto;
239
- }
240
- .tooltip {
241
- position: absolute;
242
- bottom: -40;
243
- transform: translateX(0%);
244
- padding: 0.3em 0.6em;
245
- opacity: 0;
246
- width: max-content;
247
- max-width: 100%;
248
- z-index: 999;
249
- font-size: 12px;
250
- color: #ff681d !important;
251
- white-space: wrap;
252
- pointer-events: none;
253
- transition: background-color 0.3s, width 0.3s, height 0.3s, color 0.3s;
254
- border: 1px solid #ff681d;
255
- background-color: #fff;
256
- border-radius: 6px;
257
- color: rgb(34, 34, 34);
258
- }
259
-
260
- .tooltip::before {
261
- position: absolute;
262
- content: "";
263
- height: 0.6em;
264
- width: 0.6em;
265
- z-index: 999;
266
- top: -4px;
267
- border: 1px solid #ff681d;
268
- border-right: none;
269
- border-bottom: none;
270
- transform: translate(50%) rotate(45deg);
271
- background-color: #fff;
272
- }
273
-
274
- .tooltip-container:hover .tooltip {
275
- top: 46px;
276
- opacity: 1;
277
- visibility: visible;
278
- z-index: 999;
279
- pointer-events: auto;
280
- }
281
- }
282
-
283
- .right {
284
- .tooltip {
285
- position: absolute;
286
- top: 2.5px;
287
- left: calc(100% + 9px);
288
- transform: translateX(0%);
289
- padding: 8px;
290
- opacity: 0;
291
- min-width: 200px;
292
- max-width: 200px;
293
- min-height: calc(100% - 16px);
294
- height: auto;
295
- z-index: 999;
296
- font-size: 12px;
297
- color: #fff !important;
298
- pointer-events: none;
299
- transition: background-color 0.3s, width 0.3s, height 0.3s, color 0.3s;
300
- border: 1px solid #e55353;
301
- background-color: #e55353;
302
- border-radius: 6px;
303
- color: rgb(34, 34, 34);
304
- }
305
-
306
- .tooltip-card {
307
- padding: 3px 10px 4px;
308
- top: -4px;
309
- min-width: 175px;
310
- background-color: #3d414a;
311
- border: 1px solid #3d414a;
312
- }
313
-
314
- .tooltip::before {
315
- position: absolute;
316
- content: "";
317
- height: 0.6em;
318
- width: 0.6em;
319
- left: -8px;
320
- top: 14px;
321
- z-index: 999;
322
- transform: translateY(10px);
323
- border: 1px solid #e55353;
324
- border-top: none;
325
- border-right: none;
326
- transform: translate(50%) rotate(45deg);
327
- background-color: #e55353;
328
- }
329
-
330
- .tooltip-card::before {
331
- top: 8px;
332
- background-color: #3d414a;
333
- border: 1px solid #3d414a;
334
- }
335
-
336
- .tooltip-container:hover {
337
- .tooltip {
338
- top: 2.5px;
339
- opacity: 1;
340
- visibility: visible;
341
- z-index: 999;
342
- pointer-events: auto;
343
- }
344
-
345
- .tooltip-card {
346
- top: -4px;
347
- }
348
- }
349
- }
350
-
351
- .left {
352
- .tooltip {
353
- position: absolute;
354
- top: 2.5px;
355
- right: calc(100% + 9px);
356
- transform: translateX(0%);
357
- padding: 8px;
358
- opacity: 0;
359
- min-width: 200px;
360
- max-width: 200px;
361
- min-height: calc(100% - 16px);
362
- z-index: 999;
363
- font-size: 12px;
364
- color: #fff !important;
365
- pointer-events: none;
366
- transition: background-color 0.3s, width 0.3s, height 0.3s, color 0.3s;
367
- border: 1px solid #e55353;
368
- background-color: #e55353;
369
- border-radius: 6px;
370
- color: rgb(34, 34, 34);
371
- }
372
-
373
- .tooltip::before {
374
- position: absolute;
375
- content: "";
376
- height: 0.6em;
377
- width: 0.6em;
378
- right: 0px;
379
- top: 14px;
380
- z-index: 999;
381
- transform: translateY(10px);
382
- border: 1px solid #e55353;
383
- border-bottom: none;
384
- border-left: none;
385
- transform: translate(50%) rotate(45deg);
386
- background-color: #e55353;
387
- }
388
-
389
- .tooltip-container:hover .tooltip {
390
- top: 2.5px;
391
- opacity: 1;
392
- visibility: visible;
393
- z-index: 999;
394
- pointer-events: auto;
395
- }
396
- }
397
-
398
- .top {
399
- .tooltip {
400
- position: absolute;
401
- top: -40;
402
- left: 0;
403
- transform: translateX(0%);
404
- padding: 0.3em 0.6em;
405
- opacity: 0;
406
- width: 100%;
407
- z-index: 999;
408
- font-size: 12px;
409
- color: #fff !important;
410
- pointer-events: none;
411
- transition: background-color 0.3s, width 0.3s, height 0.3s, color 0.3s;
412
- border: 1px solid #e55353;
413
- background-color: #e55353;
414
- border-radius: 6px;
415
- color: rgb(34, 34, 34);
416
- }
417
-
418
- .tooltip::before {
419
- position: absolute;
420
- content: "";
421
- height: 0.6em;
422
- width: 0.6em;
423
- right: 20px;
424
- z-index: 999;
425
- bottom: -4px;
426
- border: 1px solid #e55353;
427
- border-left: none;
428
- border-top: none;
429
- transform: translate(50%) rotate(45deg);
430
- background-color: #e55353;
431
- }
432
-
433
- .tooltip-container:hover .tooltip {
434
- top: -40px;
435
- opacity: 1;
436
- visibility: visible;
437
- z-index: 999;
438
- pointer-events: auto;
439
- }
440
- }
441
-
442
- .custom-tooltip-container {
443
- position: relative;
444
- display: inline-block;
445
- }
446
-
447
- .custom-text {
448
- font-size: 18px;
449
- cursor: pointer;
450
- }
451
-
452
- .custom-tooltip {
453
- position: absolute;
454
- top: 100%;
455
- left: 20%;
456
- opacity: 0;
457
- visibility: hidden;
458
- font-size: 12px;
459
- background: #deefff;
460
- border-color: #bee0ff;
461
- padding: 5px;
462
- align-items: center;
463
- transition: opacity 0.3s, visibility 0.3s, top 0.3s, background 0.3s;
464
- z-index: 1;
465
- }
466
-
467
- .custom-tooltip::before {
468
- content: "";
469
- position: absolute;
470
- bottom: 100%;
471
- left: 20%;
472
- /* Center the arrow */
473
- border-width: 9px;
474
- /* Slightly larger to act as border */
475
- border-style: solid;
476
- border-color: transparent transparent #bee0ff transparent;
477
- /* Border color */
478
- transform: translateX(-20%);
479
- z-index: -1;
480
- /* Ensure it's behind the ::after pseudo-element */
481
- }
482
-
483
- .custom-tooltip::after {
484
- content: "";
485
- position: absolute;
486
- bottom: 100%;
487
- left: 20%;
488
- border-width: 8px;
489
- border-style: solid;
490
- border-color: transparent transparent #deefff transparent;
491
- transform: translateX(-20%);
492
- z-index: 1;
493
- }
494
-
495
- .custom-tooltip-container:hover .custom-tooltip {
496
- top: 100%;
497
- opacity: 1;
498
- visibility: visible;
499
- background: #deefff;
500
- transform: translate(-20%, 10px);
501
- }
@@ -1,63 +0,0 @@
1
- .qbs-tree-list-container {
2
- display: flex;
3
- flex-direction: column;
4
- }
5
- .qbs-tree-list-container-sub {
6
- display: flex;
7
- flex-direction: row;
8
- align-items: flex-start;
9
- gap: 1rem; /* Corresponds to gap-4 in Tailwind */
10
- }
11
-
12
- .qbs-tree-list-container-sub .no-children {
13
- margin-left: 1.75rem; /* Corresponds to ml-7 in Tailwind */
14
- }
15
- .qbs-tree-list-container-sub-icon {
16
- margin-top: 0.25rem; /* Corresponds to mt-1 in Tailwind */
17
- cursor: pointer;
18
- padding-top: 0.5rem; /* Corresponds to py-2 in Tailwind */
19
- padding-bottom: 0.5rem;
20
- transition: transform 0.3s ease; /* Smooth rotation transition */
21
- }
22
-
23
- .qbs-tree-list-container-sub-icon.expanded {
24
- transform: rotate(90deg); /* Corresponds to rotate-90 in Tailwind */
25
- }
26
- .qbs-tree-list-container-sub-container {
27
- display: flex;
28
- gap: 0.5rem; /* Corresponds to gap-2 in Tailwind */
29
- padding: 0.5rem; /* Corresponds to p-2 in Tailwind */
30
- flex-direction: row; /* Corresponds to flex-row in Tailwind */
31
- width: 100%; /* Corresponds to w-full in Tailwind */
32
- }
33
-
34
- .qbs-tree-list-container-sub-container.checked {
35
- background-color: rgba(
36
- 141,
37
- 194,
38
- 240,
39
- 0.15
40
- ) !important; /* Corresponds to bg-green-200 in Tailwind */
41
- }
42
- .qbs-tree-list-container-sub-container.marginLeft {
43
- margin-left: 28px; /* Corresponds to ml-2 in Tailwind */
44
- }
45
- .qbs-tree-list-container-sub- {
46
- line-height: 18px; /* Corresponds to leading-[18px] in Tailwind */
47
- font-size: 0.875rem; /* Corresponds to text-sm in Tailwind (14px) */
48
- }
49
- .qbs-tree-list-container-child {
50
- margin-left: 1rem; /* Corresponds to ml-4 in Tailwind */
51
- margin-top: 0.5rem; /* Corresponds to mt-2 in Tailwind */
52
- display: flex; /* Corresponds to flex in Tailwind */
53
- flex-direction: column; /* Corresponds to flex-col in Tailwind */
54
- gap: 0.5rem; /* Corresponds to gap-2 in Tailwind */
55
- }
56
- .qbs-tree-list-container-sub-text {
57
- line-height: 18px; /* Corresponds to leading-[18px] in Tailwind */
58
- font-size: 14px; /* Corresponds to text-sm in Tailwind (14px) */
59
- font-weight: 500;
60
- letter-spacing: 0.28px;
61
- font-family: 'Noto Sans';
62
- color: #3d414a;
63
- }
@@ -1,8 +0,0 @@
1
- @tailwind base;
2
- @tailwind components;
3
- @tailwind utilities;
4
-
5
- @import './components/autocomplete.css';
6
- @import './components/treedropdown.css';
7
- @import './components/selectedautocomplete.css';
8
- @import './components/tooltip.css';