funda-ui 4.4.15 → 4.4.35

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 (50) hide show
  1. package/EventCalendar/index.css +114 -114
  2. package/EventCalendar/index.d.ts +1 -0
  3. package/EventCalendar/index.js +116 -84
  4. package/EventCalendarTimeline/index.css +274 -270
  5. package/EventCalendarTimeline/index.d.ts +3 -0
  6. package/EventCalendarTimeline/index.js +641 -224
  7. package/MultipleCheckboxes/index.js +11 -11
  8. package/MultipleSelect/index.js +11 -11
  9. package/NativeSelect/index.js +11 -11
  10. package/Radio/index.js +11 -11
  11. package/Select/index.js +11 -11
  12. package/Table/index.css +1 -0
  13. package/Table/index.js +36 -7
  14. package/TagInput/index.d.ts +1 -0
  15. package/TagInput/index.js +20 -2
  16. package/Tree/index.js +11 -11
  17. package/Utils/object.js +11 -11
  18. package/Utils/os.d.ts +2 -0
  19. package/Utils/os.js +104 -0
  20. package/lib/cjs/EventCalendar/index.d.ts +1 -0
  21. package/lib/cjs/EventCalendar/index.js +116 -84
  22. package/lib/cjs/EventCalendarTimeline/index.d.ts +3 -0
  23. package/lib/cjs/EventCalendarTimeline/index.js +641 -224
  24. package/lib/cjs/MultipleCheckboxes/index.js +11 -11
  25. package/lib/cjs/MultipleSelect/index.js +11 -11
  26. package/lib/cjs/NativeSelect/index.js +11 -11
  27. package/lib/cjs/Radio/index.js +11 -11
  28. package/lib/cjs/Select/index.js +11 -11
  29. package/lib/cjs/Table/index.js +36 -7
  30. package/lib/cjs/TagInput/index.d.ts +1 -0
  31. package/lib/cjs/TagInput/index.js +20 -2
  32. package/lib/cjs/Tree/index.js +11 -11
  33. package/lib/cjs/Utils/object.js +11 -11
  34. package/lib/cjs/Utils/os.d.ts +2 -0
  35. package/lib/cjs/Utils/os.js +104 -0
  36. package/lib/css/EventCalendar/index.css +114 -114
  37. package/lib/css/EventCalendarTimeline/index.css +274 -270
  38. package/lib/css/Table/index.css +1 -0
  39. package/lib/esm/EventCalendar/index.scss +81 -81
  40. package/lib/esm/EventCalendar/index.tsx +136 -98
  41. package/lib/esm/EventCalendarTimeline/index.scss +226 -221
  42. package/lib/esm/EventCalendarTimeline/index.tsx +445 -207
  43. package/lib/esm/ModalDialog/index.tsx +0 -1
  44. package/lib/esm/Table/Table.tsx +0 -1
  45. package/lib/esm/Table/index.scss +2 -0
  46. package/lib/esm/Table/utils/hooks/useTableDraggable.tsx +47 -6
  47. package/lib/esm/TagInput/index.tsx +23 -1
  48. package/lib/esm/Utils/libs/object.ts +67 -67
  49. package/lib/esm/Utils/libs/os.ts +63 -0
  50. package/package.json +1 -1
package/lib/esm/EventCalendarTimeline/index.scss CHANGED
@@ -16,59 +16,59 @@
16
16
  //////////////////// Calendar ////////////////////
17
17
  //////////////////////////////////////////////////
18
18
  */
19
- .e-cal-timeline__wrapper {
20
-
21
- --e-cal-timeline-wrapper-min-width: 400px;
22
- --e-cal-timeline-border-color: #ddd;
23
- --e-cal-timeline-border-color-hover: #333;
24
- --e-cal-timeline-header-fs: 1.125rem;
25
- --e-cal-timeline-year-month-btn-border-color: #ddd;
26
- --e-cal-timeline-year-month-btn-hover-bg: rgba(0, 58, 166, .1);
27
- --e-cal-timeline-year-month-btn-selected-bg: rgba(0, 58, 166, 1);
28
- --e-cal-timeline-year-month-btn-selected-color: #fff;
29
- --e-cal-timeline-month-wrapper-w: 18.75rem;
30
- --e-cal-timeline-year-wrapper-w: 18.75rem;
31
- --e-cal-timeline-header-arrow-bg: #000;
32
- --e-cal-timeline-header-text-color: #000;
33
- --e-cal-timeline-header-prevnext-btn-bg: transparent;
34
- --e-cal-timeline-header-prevnext-btn-color: #000;
35
- --e-cal-timeline-header-prevnext-btn-radius: 0.25rem;
36
- --e-cal-timeline-footer-today-btn-bg: rgba(0, 58, 166, 1);
37
- --e-cal-timeline-footer-today-btn-color: #fff;
38
- --e-cal-timeline-appearance-btn-active-bg: rgb(239, 239, 239);
19
+ .custom-event-tl__wrapper {
20
+
21
+ --custom-event-tl-wrapper-min-width: 400px;
22
+ --custom-event-tl-border-color: #ddd;
23
+ --custom-event-tl-border-color-hover: #333;
24
+ --custom-event-tl-header-fs: 1.125rem;
25
+ --custom-event-tl-year-month-btn-border-color: #ddd;
26
+ --custom-event-tl-year-month-btn-hover-bg: rgba(0, 58, 166, .1);
27
+ --custom-event-tl-year-month-btn-selected-bg: rgba(0, 58, 166, 1);
28
+ --custom-event-tl-year-month-btn-selected-color: #fff;
29
+ --custom-event-tl-month-wrapper-w: 18.75rem;
30
+ --custom-event-tl-year-wrapper-w: 18.75rem;
31
+ --custom-event-tl-header-arrow-bg: #000;
32
+ --custom-event-tl-header-text-color: #000;
33
+ --custom-event-tl-header-prevnext-btn-bg: transparent;
34
+ --custom-event-tl-header-prevnext-btn-color: #000;
35
+ --custom-event-tl-header-prevnext-btn-radius: 0.25rem;
36
+ --custom-event-tl-footer-today-btn-bg: rgba(0, 58, 166, 1);
37
+ --custom-event-tl-footer-today-btn-color: #fff;
38
+ --custom-event-tl-appearance-btn-active-bg: rgb(239, 239, 239);
39
39
 
40
40
 
41
41
 
42
42
  position: relative;
43
43
  z-index: 3;
44
- min-width: var(--e-cal-timeline-wrapper-min-width);
45
- border: 1px solid var(--e-cal-timeline-border-color);
44
+ min-width: var(--custom-event-tl-wrapper-min-width);
45
+ border: 1px solid var(--custom-event-tl-border-color);
46
46
 
47
47
 
48
48
  /* --HEADER --*/
49
- .e-cal-timeline__header {
50
- font-size: var(--e-cal-timeline-header-fs);
49
+ .custom-event-tl__header {
50
+ font-size: var(--custom-event-tl-header-fs);
51
51
  font-weight: bold;
52
52
  padding: 10px 10px 5px 10px;
53
53
  display: flex;
54
54
  justify-content: space-between;
55
55
 
56
- .e-cal-timeline__header__info {
56
+ .custom-event-tl__header__info {
57
57
  font-weight: normal;
58
58
  font-size: 0.875em;
59
59
  margin-bottom: .2rem;
60
60
  }
61
61
 
62
- .e-cal-timeline__header__btns {
63
- .e-cal-timeline__btn {
62
+ .custom-event-tl__header__btns {
63
+ .custom-event-tl__btn {
64
64
  margin-right: 1rem;
65
- color: var(--e-cal-timeline-header-text-color);
65
+ color: var(--custom-event-tl-header-text-color);
66
66
 
67
67
  svg {
68
68
  margin-left: .3rem;
69
69
 
70
70
  path {
71
- fill: var(--e-cal-timeline-header-arrow-bg);
71
+ fill: var(--custom-event-tl-header-arrow-bg);
72
72
  }
73
73
  }
74
74
 
@@ -86,9 +86,9 @@
86
86
 
87
87
 
88
88
  /*-- SELECTION --*/
89
- .e-cal-timeline__month-wrapper {
89
+ .custom-event-tl__month-wrapper {
90
90
  position: absolute;
91
- width: var(--e-cal-timeline-month-wrapper-w);
91
+ width: var(--custom-event-tl-month-wrapper-w);
92
92
  height: auto;
93
93
  z-index: 1;
94
94
  top: calc(1rem + 22px);
@@ -101,7 +101,7 @@
101
101
  }
102
102
 
103
103
 
104
- .e-cal-timeline__month-container {
104
+ .custom-event-tl__month-container {
105
105
  display: grid;
106
106
  grid-template-columns: repeat(3, 1fr);
107
107
  grid-template-rows: repeat(4, 2.5em);
@@ -112,9 +112,9 @@
112
112
  }
113
113
 
114
114
 
115
- .e-cal-timeline__year-wrapper {
115
+ .custom-event-tl__year-wrapper {
116
116
  position: absolute;
117
- width: var(--e-cal-timeline-year-wrapper-w);
117
+ width: var(--custom-event-tl-year-wrapper-w);
118
118
  height: auto;
119
119
  z-index: 1;
120
120
  top: calc(1rem + 22px);
@@ -126,7 +126,7 @@
126
126
  display: block;
127
127
  }
128
128
 
129
- .e-cal-timeline__year-container {
129
+ .custom-event-tl__year-container {
130
130
  display: grid;
131
131
  grid-template-columns: repeat(4, 1fr);
132
132
  grid-template-rows: repeat(5, 2.5em);
@@ -134,7 +134,7 @@
134
134
  }
135
135
  }
136
136
 
137
- .e-cal-timeline__today-wrapper {
137
+ .custom-event-tl__today-wrapper {
138
138
  position: absolute;
139
139
  width: auto;
140
140
  height: auto;
@@ -145,24 +145,24 @@
145
145
  }
146
146
 
147
147
 
148
- .e-cal-timeline__year,
149
- .e-cal-timeline__month {
148
+ .custom-event-tl__year,
149
+ .custom-event-tl__month {
150
150
  display: flex;
151
151
  align-items: center;
152
152
  justify-content: center;
153
153
  padding: 5px;
154
154
  font-size: 0.875em;
155
- border: 1px solid var(--e-cal-timeline-year-month-btn-border-color);
155
+ border: 1px solid var(--custom-event-tl-year-month-btn-border-color);
156
156
  border-radius: 0.25rem;
157
157
  cursor: pointer;
158
158
 
159
159
  &:hover {
160
- background-color: var(--e-cal-timeline-year-month-btn-hover-bg);
160
+ background-color: var(--custom-event-tl-year-month-btn-hover-bg);
161
161
  }
162
162
 
163
163
  &.selected {
164
- background-color: var(--e-cal-timeline-year-month-btn-selected-bg);
165
- color: var(--e-cal-timeline-year-month-btn-selected-color);
164
+ background-color: var(--custom-event-tl-year-month-btn-selected-bg);
165
+ color: var(--custom-event-tl-year-month-btn-selected-color);
166
166
  }
167
167
 
168
168
  &.disabled {
@@ -175,7 +175,7 @@
175
175
 
176
176
 
177
177
  /* --BUTTON --*/
178
- .e-cal-timeline__btn {
178
+ .custom-event-tl__btn {
179
179
  border: none;
180
180
  outline: none;
181
181
  background: none;
@@ -191,7 +191,7 @@
191
191
 
192
192
  svg {
193
193
  path {
194
- fill: var(--e-cal-timeline-header-arrow-bg);
194
+ fill: var(--custom-event-tl-header-arrow-bg);
195
195
  }
196
196
  }
197
197
 
@@ -201,36 +201,36 @@
201
201
 
202
202
  &--prev,
203
203
  &--next {
204
- border-radius: var(--e-cal-timeline-header-prevnext-btn-radius);
205
- color: var(--e-cal-timeline-header-prevnext-btn-color);
206
- background-color: var(--e-cal-timeline-header-prevnext-btn-bg);
204
+ border-radius: var(--custom-event-tl-header-prevnext-btn-radius);
205
+ color: var(--custom-event-tl-header-prevnext-btn-color);
206
+ background-color: var(--custom-event-tl-header-prevnext-btn-bg);
207
207
 
208
208
  svg {
209
209
  path {
210
- fill: var(--e-cal-timeline-header-prevnext-btn-color);
210
+ fill: var(--custom-event-tl-header-prevnext-btn-color);
211
211
  }
212
212
  }
213
213
 
214
214
  }
215
215
 
216
216
  &--today {
217
- border: 1px solid var(--e-cal-timeline-border-color);
217
+ border: 1px solid var(--custom-event-tl-border-color);
218
218
  border-radius: 0.25rem;
219
219
  font-size: 0.875em;
220
220
  padding: .2rem 1rem;
221
- color: var(--e-cal-timeline-footer-today-btn-color);
222
- background-color: var(--e-cal-timeline-footer-today-btn-bg);
221
+ color: var(--custom-event-tl-footer-today-btn-color);
222
+ background-color: var(--custom-event-tl-footer-today-btn-bg);
223
223
  }
224
224
 
225
225
  &--appearance {
226
- border: 1px solid var(--e-cal-timeline-border-color);
226
+ border: 1px solid var(--custom-event-tl-border-color);
227
227
  border-radius: 0.25rem;
228
228
  font-size: 0.875em;
229
229
  padding: .2rem 1rem;
230
230
  }
231
231
 
232
232
  &--appearance.active {
233
- background-color: var(--e-cal-timeline-appearance-btn-active-bg);
233
+ background-color: var(--custom-event-tl-appearance-btn-active-bg);
234
234
  }
235
235
 
236
236
  }
@@ -238,8 +238,8 @@
238
238
 
239
239
 
240
240
  /* WEEK MODE --*/
241
- &.e-cal-timeline__wrapper--week {
242
- .e-cal-timeline__header__info {
241
+ &.custom-event-tl__wrapper--week {
242
+ .custom-event-tl__header__info {
243
243
  transform: translateX(-2.5rem);
244
244
  }
245
245
  }
@@ -248,7 +248,7 @@
248
248
  }
249
249
 
250
250
  /* WEEK MODE*/
251
- .e-cal-timeline__wrapper.e-cal-timeline__wrapper--week {
251
+ .custom-event-tl__wrapper.custom-event-tl__wrapper--week {
252
252
 
253
253
  }
254
254
 
@@ -258,40 +258,41 @@
258
258
  //////////////////////////////////////////////////
259
259
  */
260
260
 
261
- .e-cal-timeline-table__timeline-table__wrapper {
262
-
263
- --e-cal-timeline-table-scrollbar-color: rgba(0, 0, 0, 0.2);
264
- --e-cal-timeline-table-scrollbar-track: rgba(0, 0, 0, 0);
265
- --e-cal-timeline-table-scrollbar-h: 3px;
266
- --e-cal-timeline-table-scrollbar-w: 3px;
267
- --e-cal-timeline-table-header-bg: #fff;
268
- --e-cal-timeline-table-body-bg: #fff;
269
- --e-cal-timeline-table-divider-bg: #eee;
270
- --e-cal-timeline-table-divider-border: 1px solid #ddd;
271
- --e-cal-timeline-table-divider-w: 3px;
272
- --e-cal-timeline-table-header-w: 150px;
273
- --e-cal-timeline-table-cell-padding: 0.5rem 0.75rem;
274
- --e-cal-timeline-table-cell-h: 2.5rem;
275
- --e-cal-timeline-table-cell-max-w: 300px;
276
- --e-cal-timeline-table-cell-line-height: 1.7;
277
- --e-cal-timeline-table-primary-border: 1px solid #ddd;
278
- --e-cal-timeline-table-bodycell-border: 1px solid #eee;
279
- --e-cal-timeline-table-header-border: 1px solid #ddd;
280
- --e-cal-timeline-table-bodycell-font-size: 0.875rem;
281
- --e-cal-timeline-table-headercell-font-size: 0.875rem;
282
-
283
- --e-cal-timeline-table-dayselected-bg: #0b5ed7;
284
- --e-cal-timeline-table-dayselected-text-color: #fff;
285
- --e-cal-timeline-table-delete-btn-color: #ee4949;
286
- --e-cal-timeline-table-add-btn-color: #0b5ed7;
287
- --e-cal-timeline-table-event-font-size: 0.75rem;
288
- --e-cal-timeline-table-event-hover-bg: rgba(255, 240, 227, 0);
289
- --e-cal-timeline-table-event-hover-shadow: inset 0px 0px 0px 1px rgba(21, 21, 240, 0.45);
261
+ .custom-event-tl-table__timeline-table__wrapper {
262
+
263
+ --custom-event-tl-table-scrollbar-color: rgba(0, 0, 0, 0.2);
264
+ --custom-event-tl-table-scrollbar-track: rgba(0, 0, 0, 0);
265
+ --custom-event-tl-table-scrollbar-h: 12px;
266
+ --custom-event-tl-table-scrollbar-w: 12px;
267
+ --custom-event-tl-table-header-bg: #fff;
268
+ --custom-event-tl-table-body-bg: #fff;
269
+ --custom-event-tl-table-divider-bg: #eee;
270
+ --custom-event-tl-table-divider-border: 1px solid #ddd;
271
+ --custom-event-tl-table-divider-w: 3px;
272
+ --custom-event-tl-table-header-w: 150px;
273
+ --custom-event-tl-table-cell-padding: 0.5rem 0.75rem;
274
+ --custom-event-tl-table-cell-h: 2.5rem;
275
+ --custom-event-tl-table-cell-max-w: 300px;
276
+ --custom-event-tl-table-cell-line-height: 1.7;
277
+ --custom-event-tl-table-primary-border: 1px solid #ddd;
278
+ --custom-event-tl-table-bodycell-border: 1px solid #eee;
279
+ --custom-event-tl-table-header-border: 1px solid #ddd;
280
+ --custom-event-tl-table-bodycell-font-size: 0.875rem;
281
+ --custom-event-tl-table-headercell-font-size: 0.875rem;
282
+
283
+ --custom-event-tl-table-dayselected-bg: #0b5ed7;
284
+ --custom-event-tl-table-dayselected-text-color: #fff;
285
+ --custom-event-tl-table-delete-btn-color: #ee4949;
286
+ --custom-event-tl-table-add-btn-color: #0b5ed7;
287
+ --custom-event-tl-table-event-font-size: 0.75rem;
288
+ --custom-event-tl-table-event-hover-bg: rgba(21, 21, 240, 0.05);
289
+ --custom-event-tl-table-event-hover-shadow: inset 0px 0px 0px 1px rgba(21, 21, 240, 0.45);
290
+ --custom-event-tl-table-event-selected-bg: rgba(21, 21, 240, 0.45);
290
291
 
291
292
 
292
293
 
293
294
  height: 100%; /* Required */
294
- font-size: var(--e-cal-timeline-table-bodycell-font-size);
295
+ font-size: var(--custom-event-tl-table-bodycell-font-size);
295
296
  margin-top: -1px;
296
297
  position: relative;
297
298
  z-index: 2;
@@ -302,8 +303,8 @@
302
303
  outline: none;
303
304
  }
304
305
 
305
- .e-cal-timeline-table__timeline-table {
306
- border: var(--e-cal-timeline-table-primary-border);
306
+ .custom-event-tl-table__timeline-table {
307
+ border: var(--custom-event-tl-table-primary-border);
307
308
  text-align: left;
308
309
  width: 100%;
309
310
  margin: 0;
@@ -322,17 +323,17 @@
322
323
  margin: 0;
323
324
  padding: 0;
324
325
  vertical-align: top;
325
- line-height: var(--e-cal-timeline-table-cell-line-height);
326
+ line-height: var(--custom-event-tl-table-cell-line-height);
326
327
  }
327
328
  }
328
329
 
329
330
  /* list section */
330
- .e-cal-timeline-table__list-section {
331
- background: var(--e-cal-timeline-table-body-bg);
331
+ .custom-event-tl-table__list-section {
332
+ background: var(--custom-event-tl-table-body-bg);
332
333
  }
333
334
 
334
335
  /* datagrid title */
335
- .e-cal-timeline-table__datagrid-body__title {
336
+ .custom-event-tl-table__datagrid-body__title {
336
337
  text-align: left;
337
338
  width: 100%;
338
339
  margin: 0;
@@ -351,11 +352,11 @@
351
352
  margin: 0;
352
353
  padding: 0;
353
354
  vertical-align: top;
354
- line-height: var(--e-cal-timeline-table-cell-line-height);
355
+ line-height: var(--custom-event-tl-table-cell-line-height);
355
356
  }
356
357
 
357
358
  > tbody > tr {
358
- border-bottom: var(--e-cal-timeline-table-bodycell-border);
359
+ border-bottom: var(--custom-event-tl-table-bodycell-border);
359
360
 
360
361
  &:last-child {
361
362
  border-bottom: 0;
@@ -364,7 +365,7 @@
364
365
  }
365
366
 
366
367
  /* datagrid content */
367
- .e-cal-timeline-table__datagrid-body__content {
368
+ .custom-event-tl-table__datagrid-body__content {
368
369
  text-align: left;
369
370
  border-collapse: collapse;
370
371
  margin: 0;
@@ -383,65 +384,65 @@
383
384
  margin: 0;
384
385
  padding: 0;
385
386
  vertical-align: top;
386
- line-height: var(--e-cal-timeline-table-cell-line-height);
387
+ line-height: var(--custom-event-tl-table-cell-line-height);
387
388
 
388
389
  }
389
390
 
390
391
  > tbody > tr {
391
- border-bottom: var(--e-cal-timeline-table-bodycell-border);
392
+ border-bottom: var(--custom-event-tl-table-bodycell-border);
392
393
 
393
394
  &:last-child {
394
395
  border-bottom: 0;
395
396
  }
396
397
 
397
398
  >td {
398
- border-right: var(--e-cal-timeline-table-bodycell-border);
399
+ border-right: var(--custom-event-tl-table-bodycell-border);
399
400
  }
400
401
  }
401
402
  }
402
403
 
403
404
  /* header */
404
- .e-cal-timeline-table__timeline-headertitle {
405
- background: var(--e-cal-timeline-table-header-bg);
406
- border-bottom: var(--e-cal-timeline-table-header-border);
405
+ .custom-event-tl-table__timeline-headertitle {
406
+ background: var(--custom-event-tl-table-header-bg);
407
+ border-bottom: var(--custom-event-tl-table-header-border);
407
408
  overflow: hidden;
408
409
  }
409
410
 
410
- .e-cal-timeline-table__timeline-header {
411
- background: var(--e-cal-timeline-table-header-bg);
411
+ .custom-event-tl-table__timeline-header {
412
+ background: var(--custom-event-tl-table-header-bg);
412
413
  }
413
414
 
414
415
 
415
416
  /* header title */
416
- .e-cal-timeline-table__datagrid-header__title {
417
+ .custom-event-tl-table__datagrid-header__title {
417
418
  border-spacing: 0;
418
419
  }
419
420
 
420
421
  /* header content */
421
- .e-cal-timeline-table__datagrid-header__content {
422
+ .custom-event-tl-table__datagrid-header__content {
422
423
  border-spacing: 0;
423
- border-bottom: var(--e-cal-timeline-table-header-border);
424
+ border-bottom: var(--custom-event-tl-table-header-border);
424
425
 
425
426
  > tbody > tr > th {
426
- border-right: var(--e-cal-timeline-table-primary-border);
427
+ border-right: var(--custom-event-tl-table-primary-border);
427
428
  }
428
429
  }
429
430
 
430
431
  /* content min-width， or using JavaScript */
431
432
  /*
432
- .e-cal-timeline-table__datagrid-body__content > colgroup > col,
433
- .e-cal-timeline-table__datagrid-header__content > tbody th {
433
+ .custom-event-tl-table__datagrid-body__content > colgroup > col,
434
+ .custom-event-tl-table__datagrid-header__content > tbody th {
434
435
  width: 100px;
435
436
  }
436
437
  */
437
438
 
438
439
 
439
440
  /* cell */
440
- .e-cal-timeline-table__cell-cushion-title,
441
- .e-cal-timeline-table__cell-cushion-content { // DO NOT USE "position:relative"
441
+ .custom-event-tl-table__cell-cushion-title,
442
+ .custom-event-tl-table__cell-cushion-content { // DO NOT USE "position:relative"
442
443
  word-wrap: break-word;
443
444
  word-break: break-word;
444
- max-width: var(--e-cal-timeline-table-cell-max-w);
445
+ max-width: var(--custom-event-tl-table-cell-max-w);
445
446
 
446
447
  /* ITEMS */
447
448
  > div {
@@ -449,53 +450,57 @@
449
450
  }
450
451
 
451
452
  /* If the maximum width is not increased and the screen becomes smaller,
452
- the cell width of ".e-cal-timeline-table__datagrid-header__content" may be
453
- slightly inconsistent with the cell width of ".e-cal-timeline-table__datagrid-body__content" */
453
+ the cell width of ".custom-event-tl-table__datagrid-header__content" may be
454
+ slightly inconsistent with the cell width of ".custom-event-tl-table__datagrid-body__content" */
454
455
  }
455
456
 
456
457
 
457
- .e-cal-timeline-table__cell-cushion-headercontent {
458
+ .custom-event-tl-table__cell-cushion-headercontent {
458
459
  white-space: nowrap;
459
460
  }
460
461
 
461
- .e-cal-timeline-table__cell-cushion-headercontent,
462
- .e-cal-timeline-table__cell-cushion-headertitle {
463
- font-size: var(--e-cal-timeline-table-headercell-font-size);
462
+ .custom-event-tl-table__cell-cushion-headercontent,
463
+ .custom-event-tl-table__cell-cushion-headertitle {
464
+ font-size: var(--custom-event-tl-table-headercell-font-size);
464
465
  }
465
466
 
466
- .e-cal-timeline-table__cell-cushion-headertitle,
467
- .e-cal-timeline-table__cell-cushion-title {
467
+ .custom-event-tl-table__cell-cushion-headertitle,
468
+ .custom-event-tl-table__cell-cushion-title {
468
469
  word-wrap: break-word;
469
470
  word-break: break-word;
470
471
  }
471
472
 
472
473
  /* header */
473
- .e-cal-timeline-table__cell-cushion-headertitle {
474
- width: var(--e-cal-timeline-table-header-w);
474
+ .custom-event-tl-table__cell-cushion-headertitle {
475
+ width: var(--custom-event-tl-table-header-w);
475
476
  }
476
477
 
477
478
 
478
479
  /* event container */
479
- .e-cal-timeline-table__cell-cushion-content__container {
480
+ .custom-event-tl-table__cell-cushion-content__container {
480
481
  position: relative;
481
482
 
482
- &.selected,
483
483
  &:hover {
484
- background-color: var(--e-cal-timeline-table-event-hover-bg);
485
- box-shadow: var(--e-cal-timeline-table-event-hover-shadow);
484
+ background-color: var(--custom-event-tl-table-event-hover-bg);
486
485
  }
487
486
 
487
+ &.selected {
488
+ background-color: var(--custom-event-tl-table-event-selected-bg);
489
+ box-shadow: var(--custom-event-tl-table-event-hover-shadow);
490
+ }
491
+
492
+
488
493
 
489
494
  &.has-event {
490
- .e-cal-timeline-table__cell-cushion {
495
+ .custom-event-tl-table__cell-cushion {
491
496
  padding: 0;
492
497
  }
493
498
  }
494
499
 
495
500
 
496
- .e-cal-timeline__day__event {
501
+ .custom-event-tl__day__event {
497
502
  margin-bottom: 1px;
498
- font-size: var(--e-cal-timeline-table-event-font-size);
503
+ font-size: var(--custom-event-tl-table-event-font-size);
499
504
 
500
505
  &:hover {
501
506
  cursor: pointer;
@@ -505,20 +510,20 @@
505
510
 
506
511
 
507
512
  /* Delete button */
508
- .e-cal-timeline__day__eventdel {
513
+ .custom-event-tl__day__eventdel {
509
514
  position: absolute;
510
515
  z-index: 1;
511
516
  right: -5px;
512
517
  top: 0;
513
518
  display: none;
514
- color: var(--e-cal-timeline-table-delete-btn-color);
519
+ color: var(--custom-event-tl-table-delete-btn-color);
515
520
 
516
521
  svg {
517
522
  width: 10px;
518
- fill: var(--e-cal-timeline-table-delete-btn-color);
523
+ fill: var(--custom-event-tl-table-delete-btn-color);
519
524
 
520
525
  path {
521
- fill: var(--e-cal-timeline-table-delete-btn-color);
526
+ fill: var(--custom-event-tl-table-delete-btn-color);
522
527
  }
523
528
  }
524
529
 
@@ -529,22 +534,22 @@
529
534
  }
530
535
  }
531
536
 
532
- &:not(.empty) .e-cal-timeline-table__cell-cushion-content__item:hover {
533
- .e-cal-timeline__day__eventdel {
537
+ &:not(.empty) .custom-event-tl-table__cell-cushion-content__item:hover {
538
+ .custom-event-tl__day__eventdel {
534
539
  display: block;
535
540
  }
536
541
 
537
542
  }
538
543
 
539
544
  /* Add button */
540
- .e-cal-timeline__day__eventadd {
545
+ .custom-event-tl__day__eventadd {
541
546
  position: absolute;
542
547
  z-index: 1;
543
548
  left: 0;
544
549
  bottom: -8.5px;
545
550
  display: none;
546
551
  width: 20px;
547
- color: var(--e-cal-timeline-table-add-btn-color);
552
+ color: var(--custom-event-tl-table-add-btn-color);
548
553
  text-align: left;
549
554
  pointer-events: none;
550
555
 
@@ -554,10 +559,10 @@
554
559
 
555
560
  svg {
556
561
  width: 15px;
557
- fill: var(--e-cal-timeline-table-add-btn-color);
562
+ fill: var(--custom-event-tl-table-add-btn-color);
558
563
 
559
564
  path {
560
- fill: var(--e-cal-timeline-table-add-btn-color);
565
+ fill: var(--custom-event-tl-table-add-btn-color);
561
566
  }
562
567
  }
563
568
 
@@ -569,7 +574,7 @@
569
574
  }
570
575
 
571
576
  &:hover {
572
- .e-cal-timeline__day__eventadd {
577
+ .custom-event-tl__day__eventadd {
573
578
  display: block;
574
579
  }
575
580
 
@@ -580,12 +585,12 @@
580
585
  }
581
586
 
582
587
  /* days container */
583
- .e-cal-timeline-table__cell-cushion-headercontent__container {
588
+ .custom-event-tl-table__cell-cushion-headercontent__container {
584
589
  text-align: center;
585
590
 
586
591
  &.selected {
587
- background-color: var(--e-cal-timeline-table-dayselected-bg);
588
- color: var(--e-cal-timeline-table-dayselected-text-color);
592
+ background-color: var(--custom-event-tl-table-dayselected-bg);
593
+ color: var(--custom-event-tl-table-dayselected-text-color);
589
594
  }
590
595
 
591
596
  &.disabled {
@@ -594,34 +599,34 @@
594
599
  }
595
600
 
596
601
  /* remove empty cells */
597
- .e-cal-timeline-table__datagrid-body__content colgroup > col.empty,
598
- .e-cal-timeline-table__cell-cushion-headercontent__container.empty,
599
- .e-cal-timeline-table__cell-cushion-content__container.empty {
602
+ .custom-event-tl-table__datagrid-body__content colgroup > col.empty,
603
+ .custom-event-tl-table__cell-cushion-headercontent__container.empty,
604
+ .custom-event-tl-table__cell-cushion-content__container.empty {
600
605
  opacity: .2;
601
606
  }
602
607
 
603
608
 
604
609
  /* divider */
605
- .e-cal-timeline-table__timeline-divider {
610
+ .custom-event-tl-table__timeline-divider {
606
611
  padding: 0;
607
612
  margin: 0;
608
613
  border-color: transparent;
609
- background-color: var(--e-cal-timeline-table-divider-bg);
610
- border-left: var(--e-cal-timeline-table-divider-border);
611
- border-right: var(--e-cal-timeline-table-divider-border);
614
+ background-color: var(--custom-event-tl-table-divider-bg);
615
+ border-left: var(--custom-event-tl-table-divider-border);
616
+ border-right: var(--custom-event-tl-table-divider-border);
612
617
 
613
618
  > div {
614
- width: var(--e-cal-timeline-table-divider-w);
619
+ width: var(--custom-event-tl-table-divider-w);
615
620
  }
616
621
  }
617
622
 
618
623
  /* cell */
619
- .e-cal-timeline-table__cell-cushion {
620
- padding: var(--e-cal-timeline-table-cell-padding);
624
+ .custom-event-tl-table__cell-cushion {
625
+ padding: var(--custom-event-tl-table-cell-padding);
621
626
  }
622
627
 
623
628
  /* scroller */
624
- .e-cal-timeline-table__scroller-harness {
629
+ .custom-event-tl-table__scroller-harness {
625
630
  position: relative;
626
631
  width: 100%;
627
632
  overflow-x: scroll;
@@ -633,29 +638,29 @@
633
638
  }
634
639
 
635
640
  &::-webkit-scrollbar {
636
- height: var(--e-cal-timeline-table-scrollbar-h);
637
- width: var(--e-cal-timeline-table-scrollbar-w);
641
+ height: var(--custom-event-tl-table-scrollbar-h);
642
+ width: var(--custom-event-tl-table-scrollbar-w);
638
643
  }
639
644
 
640
645
  &::-webkit-scrollbar-thumb {
641
- background: var(--e-cal-timeline-table-scrollbar-color);
646
+ background: var(--custom-event-tl-table-scrollbar-color);
642
647
  }
643
648
 
644
649
  &::-webkit-scrollbar-track {
645
- background: var(--e-cal-timeline-table-scrollbar-track);
650
+ background: var(--custom-event-tl-table-scrollbar-track);
646
651
  }
647
652
  }
648
653
 
649
- .e-cal-timeline-table__scroller-harness--hide {
654
+ .custom-event-tl-table__scroller-harness--hide {
650
655
  overflow: hidden;
651
656
  height: auto;
652
657
  }
653
658
 
654
- .e-cal-timeline-table__scroller-harness--hideX {
659
+ .custom-event-tl-table__scroller-harness--hideX {
655
660
  overflow-x: hidden !important;
656
661
  }
657
662
 
658
- .e-cal-timeline-table__scroller-harness[data-scroll="body"].dragging {
663
+ .custom-event-tl-table__scroller-harness[data-scroll="body"].dragging {
659
664
  cursor: grab;
660
665
  }
661
666
 
@@ -667,22 +672,22 @@
667
672
  //////////////////// Table Grid Tooltip //////////////////
668
673
  ///////////////////////////////////////////////////////////
669
674
  */
670
- .e-cal-timeline-table__cell-tooltipwrapper {
671
-
672
- --e-cal-timeline-table-tooltip-box-shadow: 0 5px 15px 0 rgba(0,0,0,.07), 0 15px 35px 0 rgba(50,50,93,.1);
673
- --e-cal-timeline-table-tooltip-content-bg: rgba(17, 17, 17, 0.9);
674
- --e-cal-timeline-table-tooltip-content-color: #fff;
675
- --e-cal-timeline-table-tooltip-content-font-size: 0.75em;
676
- --e-cal-timeline-table-tooltip-content-padding-x: 1em;
677
- --e-cal-timeline-table-tooltip-content-padding-y: .5em;
678
- --e-cal-timeline-table-tooltip-content-line-height: 1.5;
679
- --e-cal-timeline-table-tooltip-arrow-bg-top: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%280%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
680
- --e-cal-timeline-table-tooltip-arrow-bg-bottom: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%28180%2018%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
681
- --e-cal-timeline-table-tooltip-arrow-bg-left: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%28-90%2018%2018%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
682
- --e-cal-timeline-table-tooltip-arrow-bg-right: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%2890%206%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
683
-
684
- --e-cal-timeline-table-tooltip-arrow-width: 18px;
685
- --e-cal-timeline-table-tooltip-arrow-height: 6px;
675
+ .custom-event-tl-table__cell-tooltipwrapper {
676
+
677
+ --custom-event-tl-table-tooltip-box-shadow: 0 5px 15px 0 rgba(0,0,0,.07), 0 15px 35px 0 rgba(50,50,93,.1);
678
+ --custom-event-tl-table-tooltip-content-bg: rgba(17, 17, 17, 0.9);
679
+ --custom-event-tl-table-tooltip-content-color: #fff;
680
+ --custom-event-tl-table-tooltip-content-font-size: 0.75em;
681
+ --custom-event-tl-table-tooltip-content-padding-x: 1em;
682
+ --custom-event-tl-table-tooltip-content-padding-y: .5em;
683
+ --custom-event-tl-table-tooltip-content-line-height: 1.5;
684
+ --custom-event-tl-table-tooltip-arrow-bg-top: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%280%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
685
+ --custom-event-tl-table-tooltip-arrow-bg-bottom: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2236px%22%20height%3D%2212px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%28180%2018%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
686
+ --custom-event-tl-table-tooltip-arrow-bg-left: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%28-90%2018%2018%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
687
+ --custom-event-tl-table-tooltip-arrow-bg-right: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2212px%22%20height%3D%2236px%22%3E%3Cpath%20fill%3D%22rgba%2817,%2017,%2017,%200.9%29%22%20transform%3D%22rotate%2890%206%206%29%22%20d%3D%22M2.658,0.000%20C-13.615,0.000%2050.938,0.000%2034.662,0.000%20C28.662,0.000%2023.035,12.002%2018.660,12.002%20C14.285,12.002%208.594,0.000%202.658,0.000%20Z%22/%3E%3C/svg%3E") no-repeat;
688
+
689
+ --custom-event-tl-table-tooltip-arrow-width: 18px;
690
+ --custom-event-tl-table-tooltip-arrow-height: 6px;
686
691
 
687
692
 
688
693
  position: absolute;
@@ -703,7 +708,7 @@
703
708
  display: block !important;
704
709
 
705
710
  &::before,
706
- > .e-cal-timeline-table__cell-tooltipcontent {
711
+ > .custom-event-tl-table__cell-tooltipcontent {
707
712
  opacity: 1;
708
713
  }
709
714
  }
@@ -711,21 +716,21 @@
711
716
  &:focus {
712
717
 
713
718
  &::before,
714
- > .e-cal-timeline-table__cell-tooltipcontent {
719
+ > .custom-event-tl-table__cell-tooltipcontent {
715
720
  opacity: 1;
716
721
  }
717
722
  }
718
723
 
719
724
 
720
725
  &::before,
721
- > .e-cal-timeline-table__cell-tooltipcontent {
726
+ > .custom-event-tl-table__cell-tooltipcontent {
722
727
  backface-visibility: hidden;
723
728
  will-change: transform;
724
729
  opacity: 0;
725
730
  box-sizing: border-box;
726
731
  z-index: 10;
727
732
  transform-origin: top;
728
- box-shadow: var(--e-cal-timeline-table-tooltip-box-shadow);
733
+ box-shadow: var(--custom-event-tl-table-tooltip-box-shadow);
729
734
  transition: .1s ease-in-out;
730
735
  }
731
736
 
@@ -737,18 +742,18 @@
737
742
  ---------------------------
738
743
  */
739
744
 
740
- > .e-cal-timeline-table__cell-tooltipcontent {
741
- background: var(--e-cal-timeline-table-tooltip-content-bg);
745
+ > .custom-event-tl-table__cell-tooltipcontent {
746
+ background: var(--custom-event-tl-table-tooltip-content-bg);
742
747
  border-radius: 4px;
743
- color: var(--e-cal-timeline-table-tooltip-content-color);
748
+ color: var(--custom-event-tl-table-tooltip-content-color);
744
749
  content: attr(aria-label);
745
- font-size: var(--e-cal-timeline-table-tooltip-content-font-size);
750
+ font-size: var(--custom-event-tl-table-tooltip-content-font-size);
746
751
  font-weight: normal;
747
752
  text-transform: none;
748
- padding: var(--e-cal-timeline-table-tooltip-content-padding-y) var(--e-cal-timeline-table-tooltip-content-padding-x);
753
+ padding: var(--custom-event-tl-table-tooltip-content-padding-y) var(--custom-event-tl-table-tooltip-content-padding-x);
749
754
  white-space: nowrap;
750
755
  box-sizing: content-box;
751
- line-height: var(--e-cal-timeline-table-tooltip-content-line-height);
756
+ line-height: var(--custom-event-tl-table-tooltip-content-line-height);
752
757
 
753
758
  img {
754
759
  height: auto !important;
@@ -767,22 +772,22 @@
767
772
 
768
773
  &[data-microtip-position|="top"] {
769
774
  &::before {
770
- background: var(--e-cal-timeline-table-tooltip-arrow-bg-top);
771
- height: var(--e-cal-timeline-table-tooltip-arrow-height);
772
- width: var(--e-cal-timeline-table-tooltip-arrow-width);
775
+ background: var(--custom-event-tl-table-tooltip-arrow-bg-top);
776
+ height: var(--custom-event-tl-table-tooltip-arrow-height);
777
+ width: var(--custom-event-tl-table-tooltip-arrow-width);
773
778
  }
774
779
 
775
- > .e-cal-timeline-table__cell-tooltipcontent {
776
- margin-bottom: var(--e-cal-timeline-table-tooltip-arrow-height);
780
+ > .custom-event-tl-table__cell-tooltipcontent {
781
+ margin-bottom: var(--custom-event-tl-table-tooltip-arrow-height);
777
782
  }
778
783
 
779
784
  &::before {
780
- top: calc(100% - var(--e-cal-timeline-table-tooltip-arrow-height));
781
- left: calc(var(--e-cal-timeline-table-tooltip-arrow-width)/2 * -1);
785
+ top: calc(100% - var(--custom-event-tl-table-tooltip-arrow-height));
786
+ left: calc(var(--custom-event-tl-table-tooltip-arrow-width)/2 * -1);
782
787
  }
783
788
 
784
- > .e-cal-timeline-table__cell-tooltipcontent {
785
- bottom: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
789
+ > .custom-event-tl-table__cell-tooltipcontent {
790
+ bottom: calc(100% + var(--custom-event-tl-table-tooltip-arrow-height));
786
791
  left: 50%;
787
792
  transform: translateX(-50%);
788
793
  }
@@ -796,10 +801,10 @@
796
801
  */
797
802
 
798
803
  &[data-microtip-position="top-left"] {
799
- > .e-cal-timeline-table__cell-tooltipcontent {
800
- bottom: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
804
+ > .custom-event-tl-table__cell-tooltipcontent {
805
+ bottom: calc(100% + var(--custom-event-tl-table-tooltip-arrow-height));
801
806
  left: 50%;
802
- transform: translateX(calc(-100% + var(--e-cal-timeline-table-tooltip-arrow-width)));
807
+ transform: translateX(calc(-100% + var(--custom-event-tl-table-tooltip-arrow-width)));
803
808
  }
804
809
 
805
810
  }
@@ -813,10 +818,10 @@
813
818
  */
814
819
 
815
820
  &[data-microtip-position="top-right"] {
816
- > .e-cal-timeline-table__cell-tooltipcontent {
817
- bottom: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
821
+ > .custom-event-tl-table__cell-tooltipcontent {
822
+ bottom: calc(100% + var(--custom-event-tl-table-tooltip-arrow-height));
818
823
  left: 50%;
819
- transform: translateX(calc(0% - var(--e-cal-timeline-table-tooltip-arrow-width)));
824
+ transform: translateX(calc(0% - var(--custom-event-tl-table-tooltip-arrow-width)));
820
825
  }
821
826
  }
822
827
 
@@ -829,25 +834,25 @@
829
834
 
830
835
  &[data-microtip-position|="bottom"] {
831
836
  &::before {
832
- background: var(--e-cal-timeline-table-tooltip-arrow-bg-bottom);
833
- height: var(--e-cal-timeline-table-tooltip-arrow-height);
834
- width: var(--e-cal-timeline-table-tooltip-arrow-width);
837
+ background: var(--custom-event-tl-table-tooltip-arrow-bg-bottom);
838
+ height: var(--custom-event-tl-table-tooltip-arrow-height);
839
+ width: var(--custom-event-tl-table-tooltip-arrow-width);
835
840
  margin-top: 5px;
836
841
  margin-bottom: 0;
837
842
  }
838
843
 
839
- > .e-cal-timeline-table__cell-tooltipcontent {
840
- margin-top: var(--e-cal-timeline-table-tooltip-arrow-height);
844
+ > .custom-event-tl-table__cell-tooltipcontent {
845
+ margin-top: var(--custom-event-tl-table-tooltip-arrow-height);
841
846
  }
842
847
 
843
848
  &::before {
844
- bottom: calc(100% - var(--e-cal-timeline-table-tooltip-arrow-height));
845
- left: calc(var(--e-cal-timeline-table-tooltip-arrow-width)/2 * -1);
849
+ bottom: calc(100% - var(--custom-event-tl-table-tooltip-arrow-height));
850
+ left: calc(var(--custom-event-tl-table-tooltip-arrow-width)/2 * -1);
846
851
  }
847
852
 
848
- > .e-cal-timeline-table__cell-tooltipcontent {
853
+ > .custom-event-tl-table__cell-tooltipcontent {
849
854
  bottom: auto;
850
- top: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
855
+ top: calc(100% + var(--custom-event-tl-table-tooltip-arrow-height));
851
856
  left: 50%;
852
857
  transform: translateX(-50%);
853
858
  }
@@ -862,11 +867,11 @@
862
867
 
863
868
 
864
869
  &[data-microtip-position="bottom-left"] {
865
- > .e-cal-timeline-table__cell-tooltipcontent {
870
+ > .custom-event-tl-table__cell-tooltipcontent {
866
871
  bottom: auto;
867
- top: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
872
+ top: calc(100% + var(--custom-event-tl-table-tooltip-arrow-height));
868
873
  left: 50%;
869
- transform: translateX(calc(-100% + var(--e-cal-timeline-table-tooltip-arrow-width)));
874
+ transform: translateX(calc(-100% + var(--custom-event-tl-table-tooltip-arrow-width)));
870
875
  }
871
876
  }
872
877
 
@@ -878,11 +883,11 @@
878
883
 
879
884
 
880
885
  &[data-microtip-position="bottom-right"] {
881
- > .e-cal-timeline-table__cell-tooltipcontent {
886
+ > .custom-event-tl-table__cell-tooltipcontent {
882
887
  bottom: auto;
883
- top: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
888
+ top: calc(100% + var(--custom-event-tl-table-tooltip-arrow-height));
884
889
  left: 50%;
885
- transform: translateX(calc(0% - var(--e-cal-timeline-table-tooltip-arrow-width)));
890
+ transform: translateX(calc(0% - var(--custom-event-tl-table-tooltip-arrow-width)));
886
891
  }
887
892
  }
888
893
 
@@ -894,7 +899,7 @@
894
899
  10. Size
895
900
  ---------------------------
896
901
  */
897
- &[data-microtip-size="auto"].e-cal-timeline-table__cell-tooltipcontent {
902
+ &[data-microtip-size="auto"].custom-event-tl-table__cell-tooltipcontent {
898
903
  white-space: nowrap;
899
904
  width: auto;
900
905
  max-width: 530px;
@@ -902,17 +907,17 @@
902
907
  text-overflow: ellipsis;
903
908
  }
904
909
 
905
- &[data-microtip-size="small"].e-cal-timeline-table__cell-tooltipcontent {
910
+ &[data-microtip-size="small"].custom-event-tl-table__cell-tooltipcontent {
906
911
  white-space: initial;
907
912
  width: 80px;
908
913
  }
909
914
 
910
- &[data-microtip-size="medium"].e-cal-timeline-table__cell-tooltipcontent {
915
+ &[data-microtip-size="medium"].custom-event-tl-table__cell-tooltipcontent {
911
916
  white-space: initial;
912
917
  width: 150px;
913
918
  }
914
919
 
915
- &[data-microtip-size="large"].e-cal-timeline-table__cell-tooltipcontent {
920
+ &[data-microtip-size="large"].custom-event-tl-table__cell-tooltipcontent {
916
921
  white-space: initial;
917
922
  width: 260px;
918
923
  }