funda-ui 4.3.355 → 4.3.721

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 (49) hide show
  1. package/DynamicFields/index.d.ts +1 -0
  2. package/DynamicFields/index.js +23 -3
  3. package/EventCalendar/index.css +150 -106
  4. package/EventCalendar/index.d.ts +11 -2
  5. package/EventCalendar/index.js +835 -151
  6. package/EventCalendarTimeline/index.css +293 -251
  7. package/EventCalendarTimeline/index.d.ts +18 -9
  8. package/EventCalendarTimeline/index.js +1077 -505
  9. package/MultipleCheckboxes/index.d.ts +1 -0
  10. package/MultipleCheckboxes/index.js +17 -7
  11. package/MultipleSelect/index.d.ts +4 -0
  12. package/MultipleSelect/index.js +54 -8
  13. package/NativeSelect/index.js +1 -0
  14. package/Radio/index.d.ts +2 -1
  15. package/Radio/index.js +54 -24
  16. package/Select/index.js +115 -42
  17. package/Table/index.js +27 -3
  18. package/lib/cjs/DynamicFields/index.d.ts +1 -0
  19. package/lib/cjs/DynamicFields/index.js +23 -3
  20. package/lib/cjs/EventCalendar/index.d.ts +11 -2
  21. package/lib/cjs/EventCalendar/index.js +835 -151
  22. package/lib/cjs/EventCalendarTimeline/index.d.ts +18 -9
  23. package/lib/cjs/EventCalendarTimeline/index.js +1077 -505
  24. package/lib/cjs/MultipleCheckboxes/index.d.ts +1 -0
  25. package/lib/cjs/MultipleCheckboxes/index.js +17 -7
  26. package/lib/cjs/MultipleSelect/index.d.ts +4 -0
  27. package/lib/cjs/MultipleSelect/index.js +54 -8
  28. package/lib/cjs/NativeSelect/index.js +1 -0
  29. package/lib/cjs/Radio/index.d.ts +2 -1
  30. package/lib/cjs/Radio/index.js +54 -24
  31. package/lib/cjs/Select/index.js +115 -42
  32. package/lib/cjs/Table/index.js +27 -3
  33. package/lib/css/EventCalendar/index.css +150 -106
  34. package/lib/css/EventCalendarTimeline/index.css +293 -251
  35. package/lib/esm/DynamicFields/index.tsx +28 -3
  36. package/lib/esm/EventCalendar/index.scss +172 -104
  37. package/lib/esm/EventCalendar/index.tsx +272 -139
  38. package/lib/esm/EventCalendarTimeline/index.scss +275 -213
  39. package/lib/esm/EventCalendarTimeline/index.tsx +706 -708
  40. package/lib/esm/MultipleCheckboxes/index.tsx +18 -5
  41. package/lib/esm/MultipleSelect/ItemList.tsx +1 -0
  42. package/lib/esm/MultipleSelect/index.tsx +103 -52
  43. package/lib/esm/NativeSelect/index.tsx +2 -0
  44. package/lib/esm/Radio/index.tsx +68 -27
  45. package/lib/esm/Select/index.tsx +236 -65
  46. package/lib/esm/Table/Table.tsx +1 -0
  47. package/lib/esm/Table/TableCell.tsx +6 -0
  48. package/lib/esm/Table/table-utils/ToggleSelection.tsx +17 -2
  49. package/package.json +1 -1
package/lib/esm/EventCalendarTimeline/index.scss CHANGED
@@ -16,52 +16,52 @@
16
16
  //////////////////// Calendar ////////////////////
17
17
  //////////////////////////////////////////////////
18
18
  */
19
- .e-cal-tl__wrapper {
20
-
21
- --e-cal-tl-wrapper-min-width: 400px;
22
- --e-cal-tl-border-color: #ddd;
23
- --e-cal-tl-border-color-hover: #333;
24
- --e-cal-tl-header-fs: 1.125rem;
25
- --e-cal-tl-year-month-btn-border-color: #ddd;
26
- --e-cal-tl-year-month-btn-hover-bg: rgba(0, 58, 166, .1);
27
- --e-cal-tl-year-month-btn-selected-bg: rgba(0, 58, 166, 1);
28
- --e-cal-tl-year-month-btn-selected-color: #fff;
29
- --e-cal-tl-month-wrapper-w: 18.75rem;
30
- --e-cal-tl-year-wrapper-w: 18.75rem;
31
- --e-cal-tl-header-arrow-bg: #000;
32
- --e-cal-tl-header-text-color: #000;
33
- --e-cal-tl-header-prevnext-btn-bg: transparent;
34
- --e-cal-tl-header-prevnext-btn-color: #000;
35
- --e-cal-tl-header-prevnext-btn-radius: 0.25rem;
36
- --e-cal-tl-footer-today-btn-bg: rgba(0, 58, 166, 1);
37
- --e-cal-tl-footer-today-btn-color: #fff;
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
38
 
39
39
 
40
40
 
41
41
  position: relative;
42
42
  z-index: 3;
43
- min-width: var(--e-cal-tl-wrapper-min-width);
44
- border: 1px solid var(--e-cal-tl-border-color);
43
+ min-width: var(--e-cal-timeline-wrapper-min-width);
44
+ border: 1px solid var(--e-cal-timeline-border-color);
45
45
 
46
46
 
47
47
  /* --HEADER --*/
48
- .e-cal-tl__header {
49
- font-size: var(--e-cal-tl-header-fs);
48
+ .e-cal-timeline__header {
49
+ font-size: var(--e-cal-timeline-header-fs);
50
50
  font-weight: bold;
51
51
  padding: 10px 10px 5px 10px;
52
52
  display: flex;
53
53
  justify-content: space-between;
54
54
 
55
- .e-cal-tl__header__btns {
56
- .e-cal-tl__btn {
55
+ .e-cal-timeline__header__btns {
56
+ .e-cal-timeline__btn {
57
57
  margin-right: 1rem;
58
- color: var(--e-cal-tl-header-text-color);
58
+ color: var(--e-cal-timeline-header-text-color);
59
59
 
60
60
  svg {
61
61
  margin-left: .3rem;
62
62
 
63
63
  path {
64
- fill: var(--e-cal-tl-header-arrow-bg);
64
+ fill: var(--e-cal-timeline-header-arrow-bg);
65
65
  }
66
66
  }
67
67
 
@@ -79,9 +79,9 @@
79
79
 
80
80
 
81
81
  /*-- SELECTION --*/
82
- .e-cal-tl__month-wrapper {
82
+ .e-cal-timeline__month-wrapper {
83
83
  position: absolute;
84
- width: var(--e-cal-tl-month-wrapper-w);
84
+ width: var(--e-cal-timeline-month-wrapper-w);
85
85
  height: auto;
86
86
  z-index: 1;
87
87
  top: calc(1rem + 22px);
@@ -94,7 +94,7 @@
94
94
  }
95
95
 
96
96
 
97
- .e-cal-tl__month-container {
97
+ .e-cal-timeline__month-container {
98
98
  display: grid;
99
99
  grid-template-columns: repeat(3, 1fr);
100
100
  grid-template-rows: repeat(4, 2.5em);
@@ -105,9 +105,9 @@
105
105
  }
106
106
 
107
107
 
108
- .e-cal-tl__year-wrapper {
108
+ .e-cal-timeline__year-wrapper {
109
109
  position: absolute;
110
- width: var(--e-cal-tl-year-wrapper-w);
110
+ width: var(--e-cal-timeline-year-wrapper-w);
111
111
  height: auto;
112
112
  z-index: 1;
113
113
  top: calc(1rem + 22px);
@@ -119,7 +119,7 @@
119
119
  display: block;
120
120
  }
121
121
 
122
- .e-cal-tl__year-container {
122
+ .e-cal-timeline__year-container {
123
123
  display: grid;
124
124
  grid-template-columns: repeat(4, 1fr);
125
125
  grid-template-rows: repeat(5, 2.5em);
@@ -127,7 +127,7 @@
127
127
  }
128
128
  }
129
129
 
130
- .e-cal-tl__today-wrapper {
130
+ .e-cal-timeline__today-wrapper {
131
131
  position: absolute;
132
132
  width: auto;
133
133
  height: auto;
@@ -138,24 +138,24 @@
138
138
  }
139
139
 
140
140
 
141
- .e-cal-tl__year,
142
- .e-cal-tl__month {
141
+ .e-cal-timeline__year,
142
+ .e-cal-timeline__month {
143
143
  display: flex;
144
144
  align-items: center;
145
145
  justify-content: center;
146
146
  padding: 5px;
147
147
  font-size: 0.875em;
148
- border: 1px solid var(--e-cal-tl-year-month-btn-border-color);
148
+ border: 1px solid var(--e-cal-timeline-year-month-btn-border-color);
149
149
  border-radius: 0.25rem;
150
150
  cursor: pointer;
151
151
 
152
152
  &:hover {
153
- background-color: var(--e-cal-tl-year-month-btn-hover-bg);
153
+ background-color: var(--e-cal-timeline-year-month-btn-hover-bg);
154
154
  }
155
155
 
156
156
  &.selected {
157
- background-color: var(--e-cal-tl-year-month-btn-selected-bg);
158
- color: var(--e-cal-tl-year-month-btn-selected-color);
157
+ background-color: var(--e-cal-timeline-year-month-btn-selected-bg);
158
+ color: var(--e-cal-timeline-year-month-btn-selected-color);
159
159
  }
160
160
 
161
161
  &.disabled {
@@ -168,7 +168,7 @@
168
168
 
169
169
 
170
170
  /* --BUTTON --*/
171
- .e-cal-tl__btn {
171
+ .e-cal-timeline__btn {
172
172
  border: none;
173
173
  outline: none;
174
174
  background: none;
@@ -183,7 +183,7 @@
183
183
 
184
184
  svg {
185
185
  path {
186
- fill: var(--e-cal-tl-header-arrow-bg);
186
+ fill: var(--e-cal-timeline-header-arrow-bg);
187
187
  }
188
188
  }
189
189
 
@@ -193,25 +193,25 @@
193
193
 
194
194
  &--prev,
195
195
  &--next {
196
- border-radius: var(--e-cal-tl-header-prevnext-btn-radius);
197
- color: var(--e-cal-tl-header-prevnext-btn-color);
198
- background-color: var(--e-cal-tl-header-prevnext-btn-bg);
196
+ border-radius: var(--e-cal-timeline-header-prevnext-btn-radius);
197
+ color: var(--e-cal-timeline-header-prevnext-btn-color);
198
+ background-color: var(--e-cal-timeline-header-prevnext-btn-bg);
199
199
 
200
200
  svg {
201
201
  path {
202
- fill: var(--e-cal-tl-header-prevnext-btn-color);
202
+ fill: var(--e-cal-timeline-header-prevnext-btn-color);
203
203
  }
204
204
  }
205
205
 
206
206
  }
207
207
 
208
208
  &--today {
209
- border: 1px solid var(--e-cal-tl-border-color);
209
+ border: 1px solid var(--e-cal-timeline-border-color);
210
210
  border-radius: 0.25rem;
211
211
  font-size: 0.875em;
212
212
  padding: .2rem 1rem;
213
- color: var(--e-cal-tl-footer-today-btn-color);
214
- background-color: var(--e-cal-tl-footer-today-btn-bg);
213
+ color: var(--e-cal-timeline-footer-today-btn-color);
214
+ background-color: var(--e-cal-timeline-footer-today-btn-bg);
215
215
  }
216
216
  }
217
217
 
@@ -224,45 +224,46 @@
224
224
  //////////////////////////////////////////////////
225
225
  */
226
226
 
227
- .e-cal-tl-table__timeline-table__wrapper {
228
-
229
- --e-cal-tl-table-scrollbar-color: rgba(0, 0, 0, 0.2);
230
- --e-cal-tl-table-scrollbar-track: rgba(0, 0, 0, 0);
231
- --e-cal-tl-table-scrollbar-h: 3px;
232
- --e-cal-tl-table-scrollbar-w: 3px;
233
- --e-cal-tl-table-header-bg: #fff;
234
- --e-cal-tl-table-body-bg: #fff;
235
- --e-cal-tl-table-divider-bg: #eee;
236
- --e-cal-tl-table-divider-border: 1px solid #ddd;
237
- --e-cal-tl-table-divider-w: 3px;
238
- --e-cal-tl-table-header-w: 150px;
239
- --e-cal-tl-table-cell-padding: 0.5rem 0.75rem;
240
- --e-cal-tl-table-cell-h: 2.5rem;
241
- --e-cal-tl-table-cell-max-w: 300px;
242
- --e-cal-tl-table-cell-line-height: 1.7;
243
- --e-cal-tl-table-primary-border: 1px solid #ddd;
244
- --e-cal-tl-table-bodycell-border: 1px solid #eee;
245
- --e-cal-tl-table-header-border: 1px solid #ddd;
246
- --e-cal-tl-table-bodycell-font-size: 0.875rem;
247
- --e-cal-tl-table-headercell-font-size: 0.875rem;
248
-
249
- --e-cal-tl-table-dayselected-bg: #0b5ed7;
250
- --e-cal-tl-table-dayselected-text-color: #fff;
251
- --e-cal-tl-table-delete-btn-color: #ee4949;
252
- --e-cal-tl-table-event-font-size: 0.75rem;
253
- --e-cal-tl-table-event-hover-bg: rgba(255, 240, 227, 0);
254
- --e-cal-tl-table-event-hover-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.15);
227
+ .e-cal-timeline-table__timeline-table__wrapper {
228
+
229
+ --e-cal-timeline-table-scrollbar-color: rgba(0, 0, 0, 0.2);
230
+ --e-cal-timeline-table-scrollbar-track: rgba(0, 0, 0, 0);
231
+ --e-cal-timeline-table-scrollbar-h: 3px;
232
+ --e-cal-timeline-table-scrollbar-w: 3px;
233
+ --e-cal-timeline-table-header-bg: #fff;
234
+ --e-cal-timeline-table-body-bg: #fff;
235
+ --e-cal-timeline-table-divider-bg: #eee;
236
+ --e-cal-timeline-table-divider-border: 1px solid #ddd;
237
+ --e-cal-timeline-table-divider-w: 3px;
238
+ --e-cal-timeline-table-header-w: 150px;
239
+ --e-cal-timeline-table-cell-padding: 0.5rem 0.75rem;
240
+ --e-cal-timeline-table-cell-h: 2.5rem;
241
+ --e-cal-timeline-table-cell-max-w: 300px;
242
+ --e-cal-timeline-table-cell-line-height: 1.7;
243
+ --e-cal-timeline-table-primary-border: 1px solid #ddd;
244
+ --e-cal-timeline-table-bodycell-border: 1px solid #eee;
245
+ --e-cal-timeline-table-header-border: 1px solid #ddd;
246
+ --e-cal-timeline-table-bodycell-font-size: 0.875rem;
247
+ --e-cal-timeline-table-headercell-font-size: 0.875rem;
248
+
249
+ --e-cal-timeline-table-dayselected-bg: #0b5ed7;
250
+ --e-cal-timeline-table-dayselected-text-color: #fff;
251
+ --e-cal-timeline-table-delete-btn-color: #ee4949;
252
+ --e-cal-timeline-table-add-btn-color: #0b5ed7;
253
+ --e-cal-timeline-table-event-font-size: 0.75rem;
254
+ --e-cal-timeline-table-event-hover-bg: rgba(255, 240, 227, 0);
255
+ --e-cal-timeline-table-event-hover-shadow: inset 0px 0px 0px 1px rgba(0,0,0,0.15);
255
256
 
256
257
 
257
258
 
258
259
  height: 100%; /* Required */
259
- font-size: var(--e-cal-tl-table-bodycell-font-size);
260
+ font-size: var(--e-cal-timeline-table-bodycell-font-size);
260
261
  margin-top: -1px;
261
262
  position: relative;
262
263
  z-index: 2;
263
264
 
264
- .e-cal-tl-table__timeline-table {
265
- border: var(--e-cal-tl-table-primary-border);
265
+ .e-cal-timeline-table__timeline-table {
266
+ border: var(--e-cal-timeline-table-primary-border);
266
267
  text-align: left;
267
268
  width: 100%;
268
269
  margin: 0;
@@ -281,17 +282,17 @@
281
282
  margin: 0;
282
283
  padding: 0;
283
284
  vertical-align: top;
284
- line-height: var(--e-cal-tl-table-cell-line-height);
285
+ line-height: var(--e-cal-timeline-table-cell-line-height);
285
286
  }
286
287
  }
287
288
 
288
289
  /* list section */
289
- .e-cal-tl-table__list-section {
290
- background: var(--e-cal-tl-table-body-bg);
290
+ .e-cal-timeline-table__list-section {
291
+ background: var(--e-cal-timeline-table-body-bg);
291
292
  }
292
293
 
293
294
  /* datagrid title */
294
- .e-cal-tl-table__datagrid-body__title {
295
+ .e-cal-timeline-table__datagrid-body__title {
295
296
  text-align: left;
296
297
  width: 100%;
297
298
  margin: 0;
@@ -310,11 +311,11 @@
310
311
  margin: 0;
311
312
  padding: 0;
312
313
  vertical-align: top;
313
- line-height: var(--e-cal-tl-table-cell-line-height);
314
+ line-height: var(--e-cal-timeline-table-cell-line-height);
314
315
  }
315
316
 
316
317
  > tbody > tr {
317
- border-bottom: var(--e-cal-tl-table-bodycell-border);
318
+ border-bottom: var(--e-cal-timeline-table-bodycell-border);
318
319
 
319
320
  &:last-child {
320
321
  border-bottom: 0;
@@ -323,7 +324,7 @@
323
324
  }
324
325
 
325
326
  /* datagrid content */
326
- .e-cal-tl-table__datagrid-body__content {
327
+ .e-cal-timeline-table__datagrid-body__content {
327
328
  text-align: left;
328
329
  border-collapse: collapse;
329
330
  margin: 0;
@@ -342,147 +343,208 @@
342
343
  margin: 0;
343
344
  padding: 0;
344
345
  vertical-align: top;
345
- line-height: var(--e-cal-tl-table-cell-line-height);
346
+ line-height: var(--e-cal-timeline-table-cell-line-height);
346
347
  }
347
348
 
348
349
  > tbody > tr {
349
- border-bottom: var(--e-cal-tl-table-bodycell-border);
350
+ border-bottom: var(--e-cal-timeline-table-bodycell-border);
350
351
 
351
352
  &:last-child {
352
353
  border-bottom: 0;
353
354
  }
354
355
 
355
356
  >td {
356
- border-right: var(--e-cal-tl-table-bodycell-border);
357
+ border-right: var(--e-cal-timeline-table-bodycell-border);
357
358
  }
358
359
  }
359
360
  }
360
361
 
361
362
  /* header */
362
- .e-cal-tl-table__timeline-headertitle {
363
- background: var(--e-cal-tl-table-header-bg);
364
- border-bottom: var(--e-cal-tl-table-header-border);
363
+ .e-cal-timeline-table__timeline-headertitle {
364
+ background: var(--e-cal-timeline-table-header-bg);
365
+ border-bottom: var(--e-cal-timeline-table-header-border);
365
366
  overflow: hidden;
366
367
  }
367
368
 
368
- .e-cal-tl-table__timeline-header {
369
- background: var(--e-cal-tl-table-header-bg);
369
+ .e-cal-timeline-table__timeline-header {
370
+ background: var(--e-cal-timeline-table-header-bg);
370
371
  }
371
372
 
372
373
 
373
374
  /* header title */
374
- .e-cal-tl-table__datagrid-header__title {
375
+ .e-cal-timeline-table__datagrid-header__title {
375
376
  border-spacing: 0;
376
377
  }
377
378
 
378
379
  /* header content */
379
- .e-cal-tl-table__datagrid-header__content {
380
+ .e-cal-timeline-table__datagrid-header__content {
380
381
  border-spacing: 0;
381
- border-bottom: var(--e-cal-tl-table-header-border);
382
+ border-bottom: var(--e-cal-timeline-table-header-border);
382
383
 
383
384
  > tbody > tr > th {
384
- border-right: var(--e-cal-tl-table-primary-border);
385
+ border-right: var(--e-cal-timeline-table-primary-border);
385
386
  }
386
387
  }
387
388
 
388
389
  /* content min-width， or using JavaScript */
389
390
  /*
390
- .e-cal-tl-table__datagrid-body__content > colgroup > col,
391
- .e-cal-tl-table__datagrid-header__content > tbody th {
391
+ .e-cal-timeline-table__datagrid-body__content > colgroup > col,
392
+ .e-cal-timeline-table__datagrid-header__content > tbody th {
392
393
  width: 100px;
393
394
  }
394
395
  */
395
396
 
396
397
 
397
398
  /* cell */
398
- .e-cal-tl-table__cell-cushion-title,
399
- .e-cal-tl-table__cell-cushion-content {
399
+ .e-cal-timeline-table__cell-cushion-title,
400
+ .e-cal-timeline-table__cell-cushion-content { // DO NOT USE "position:relative"
400
401
  word-wrap: break-word;
401
402
  word-break: break-word;
402
- max-width: var(--e-cal-tl-table-cell-max-w);
403
+ max-width: var(--e-cal-timeline-table-cell-max-w);
404
+
405
+ /* ITEMS */
406
+ > div {
407
+ position: relative;
408
+ }
403
409
 
404
410
  /* If the maximum width is not increased and the screen becomes smaller,
405
- the cell width of ".e-cal-tl-table__datagrid-header__content" may be
406
- slightly inconsistent with the cell width of ".e-cal-tl-table__datagrid-body__content" */
411
+ the cell width of ".e-cal-timeline-table__datagrid-header__content" may be
412
+ slightly inconsistent with the cell width of ".e-cal-timeline-table__datagrid-body__content" */
407
413
  }
408
414
 
409
- .e-cal-tl-table__cell-cushion-headercontent {
415
+
416
+ .e-cal-timeline-table__cell-cushion-headercontent {
410
417
  white-space: nowrap;
411
418
  }
412
419
 
413
- .e-cal-tl-table__cell-cushion-headercontent,
414
- .e-cal-tl-table__cell-cushion-headertitle {
415
- font-size: var(--e-cal-tl-table-headercell-font-size);
420
+ .e-cal-timeline-table__cell-cushion-headercontent,
421
+ .e-cal-timeline-table__cell-cushion-headertitle {
422
+ font-size: var(--e-cal-timeline-table-headercell-font-size);
416
423
  }
417
424
 
418
- .e-cal-tl-table__cell-cushion-headertitle,
419
- .e-cal-tl-table__cell-cushion-title {
425
+ .e-cal-timeline-table__cell-cushion-headertitle,
426
+ .e-cal-timeline-table__cell-cushion-title {
420
427
  word-wrap: break-word;
421
428
  word-break: break-word;
422
429
  }
423
430
 
424
431
  /* header */
425
- .e-cal-tl-table__cell-cushion-headertitle {
426
- width: var(--e-cal-tl-table-header-w);
432
+ .e-cal-timeline-table__cell-cushion-headertitle {
433
+ width: var(--e-cal-timeline-table-header-w);
427
434
  }
428
435
 
429
436
 
430
437
  /* event container */
431
- .e-cal-tl-table__cell-cushion-content__container {
438
+ .e-cal-timeline-table__cell-cushion-content__container {
432
439
  position: relative;
433
440
 
434
441
  &.selected,
435
442
  &:hover {
436
- background-color: var(--e-cal-tl-table-event-hover-bg);
437
- box-shadow: var(--e-cal-tl-table-event-hover-shadow);
443
+ background-color: var(--e-cal-timeline-table-event-hover-bg);
444
+ box-shadow: var(--e-cal-timeline-table-event-hover-shadow);
438
445
  }
439
446
 
440
447
 
441
- &:not(.empty):hover {
442
- .e-cal-tl__day__eventdel {
443
- display: block;
448
+ &.has-event {
449
+ .e-cal-timeline-table__cell-cushion {
450
+ padding: 0;
444
451
  }
445
- }
452
+ }
446
453
 
447
454
 
448
- &.has-event {
449
- .e-cal-tl-table__cell-cushion {
450
- padding: 0;
455
+ .e-cal-timeline__day__event {
456
+ margin-bottom: 1px;
457
+ font-size: var(--e-cal-timeline-table-event-font-size);
458
+
459
+ &:hover {
460
+ cursor: pointer;
461
+ opacity: .8;
451
462
  }
452
463
  }
453
464
 
454
- .e-cal-tl__day__event {
465
+
466
+ /* Delete button */
467
+ .e-cal-timeline__day__eventdel {
455
468
  position: absolute;
456
- width: 100%;
457
- font-size: var(--e-cal-tl-table-event-font-size);
469
+ z-index: 1;
470
+ right: -5px;
471
+ top: 0;
472
+ display: none;
473
+ color: var(--e-cal-timeline-table-delete-btn-color);
474
+
475
+ svg {
476
+ width: 10px;
477
+ fill: var(--e-cal-timeline-table-delete-btn-color);
478
+
479
+ path {
480
+ fill: var(--e-cal-timeline-table-delete-btn-color);
481
+ }
482
+ }
483
+
484
+ &:hover {
485
+ svg {
486
+ transform: scale(1.2);
487
+ }
488
+ }
458
489
  }
459
490
 
460
- .e-cal-tl__day__eventdel {
491
+ &:not(.empty) .e-cal-timeline-table__cell-cushion-content__item:hover {
492
+ .e-cal-timeline__day__eventdel {
493
+ display: block;
494
+ }
495
+
496
+ }
497
+
498
+ /* Add button */
499
+ .e-cal-timeline__day__eventadd {
461
500
  position: absolute;
462
501
  z-index: 1;
463
502
  left: 0;
464
- top: 0;
503
+ bottom: -8.5px;
465
504
  display: none;
466
- color: var(--e-cal-tl-table-delete-btn-color);
467
-
505
+ width: 20px;
506
+ color: var(--e-cal-timeline-table-add-btn-color);
507
+ text-align: left;
508
+ pointer-events: none;
509
+
510
+ > a {
511
+ pointer-events: auto;
512
+ }
513
+
468
514
  svg {
469
- fill: var(--e-cal-tl-table-delete-btn-color);
515
+ width: 15px;
516
+ fill: var(--e-cal-timeline-table-add-btn-color);
470
517
 
471
518
  path {
472
- fill: var(--e-cal-tl-table-delete-btn-color);
519
+ fill: var(--e-cal-timeline-table-add-btn-color);
520
+ }
521
+ }
522
+
523
+ &:hover {
524
+ svg {
525
+ transform: scale(1.2);
473
526
  }
474
527
  }
475
528
  }
476
529
 
530
+ &:hover {
531
+ .e-cal-timeline__day__eventadd {
532
+ display: block;
533
+ }
534
+
535
+ }
536
+
537
+
538
+
477
539
  }
478
540
 
479
541
  /* days container */
480
- .e-cal-tl-table__cell-cushion-headercontent__container {
542
+ .e-cal-timeline-table__cell-cushion-headercontent__container {
481
543
  text-align: center;
482
544
 
483
545
  &.selected {
484
- background-color: var(--e-cal-tl-table-dayselected-bg);
485
- color: var(--e-cal-tl-table-dayselected-text-color);
546
+ background-color: var(--e-cal-timeline-table-dayselected-bg);
547
+ color: var(--e-cal-timeline-table-dayselected-text-color);
486
548
  }
487
549
 
488
550
  &.disabled {
@@ -491,34 +553,34 @@
491
553
  }
492
554
 
493
555
  /* remove empty cells */
494
- .e-cal-tl-table__datagrid-body__content colgroup > col.empty,
495
- .e-cal-tl-table__cell-cushion-headercontent__container.empty,
496
- .e-cal-tl-table__cell-cushion-content__container.empty {
556
+ .e-cal-timeline-table__datagrid-body__content colgroup > col.empty,
557
+ .e-cal-timeline-table__cell-cushion-headercontent__container.empty,
558
+ .e-cal-timeline-table__cell-cushion-content__container.empty {
497
559
  opacity: .2;
498
560
  }
499
561
 
500
562
 
501
563
  /* divider */
502
- .e-cal-tl-table__timeline-divider {
564
+ .e-cal-timeline-table__timeline-divider {
503
565
  padding: 0;
504
566
  margin: 0;
505
567
  border-color: transparent;
506
- background-color: var(--e-cal-tl-table-divider-bg);
507
- border-left: var(--e-cal-tl-table-divider-border);
508
- border-right: var(--e-cal-tl-table-divider-border);
568
+ background-color: var(--e-cal-timeline-table-divider-bg);
569
+ border-left: var(--e-cal-timeline-table-divider-border);
570
+ border-right: var(--e-cal-timeline-table-divider-border);
509
571
 
510
572
  > div {
511
- width: var(--e-cal-tl-table-divider-w);
573
+ width: var(--e-cal-timeline-table-divider-w);
512
574
  }
513
575
  }
514
576
 
515
577
  /* cell */
516
- .e-cal-tl-table__cell-cushion {
517
- padding: var(--e-cal-tl-table-cell-padding);
578
+ .e-cal-timeline-table__cell-cushion {
579
+ padding: var(--e-cal-timeline-table-cell-padding);
518
580
  }
519
581
 
520
582
  /* scroller */
521
- .e-cal-tl-table__scroller-harness {
583
+ .e-cal-timeline-table__scroller-harness {
522
584
  position: relative;
523
585
  width: 100%;
524
586
  overflow-x: scroll;
@@ -530,25 +592,25 @@
530
592
  }
531
593
 
532
594
  &::-webkit-scrollbar {
533
- height: var(--e-cal-tl-table-scrollbar-h);
534
- width: var(--e-cal-tl-table-scrollbar-w);
595
+ height: var(--e-cal-timeline-table-scrollbar-h);
596
+ width: var(--e-cal-timeline-table-scrollbar-w);
535
597
  }
536
598
 
537
599
  &::-webkit-scrollbar-thumb {
538
- background: var(--e-cal-tl-table-scrollbar-color);
600
+ background: var(--e-cal-timeline-table-scrollbar-color);
539
601
  }
540
602
 
541
603
  &::-webkit-scrollbar-track {
542
- background: var(--e-cal-tl-table-scrollbar-track);
604
+ background: var(--e-cal-timeline-table-scrollbar-track);
543
605
  }
544
606
  }
545
607
 
546
- .e-cal-tl-table__scroller-harness--hide {
608
+ .e-cal-timeline-table__scroller-harness--hide {
547
609
  overflow: hidden;
548
610
  height: auto;
549
611
  }
550
612
 
551
- .e-cal-tl-table__scroller-harness[data-scroll="body"].dragging {
613
+ .e-cal-timeline-table__scroller-harness[data-scroll="body"].dragging {
552
614
  cursor: grab;
553
615
  }
554
616
 
@@ -560,22 +622,22 @@
560
622
  //////////////////// Table Grid Tooltip //////////////////
561
623
  ///////////////////////////////////////////////////////////
562
624
  */
563
- .e-cal-tl-table__cell-tooltipwrapper {
564
-
565
- --e-cal-tl-table-tooltip-box-shadow: 0 5px 15px 0 rgba(0,0,0,.07), 0 15px 35px 0 rgba(50,50,93,.1);
566
- --e-cal-tl-table-tooltip-content-bg: rgba(17, 17, 17, 0.9);
567
- --e-cal-tl-table-tooltip-content-color: #fff;
568
- --e-cal-tl-table-tooltip-content-font-size: 0.75em;
569
- --e-cal-tl-table-tooltip-content-padding-x: 1em;
570
- --e-cal-tl-table-tooltip-content-padding-y: .5em;
571
- --e-cal-tl-table-tooltip-content-line-height: 1.5;
572
- --e-cal-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;
573
- --e-cal-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;
574
- --e-cal-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;
575
- --e-cal-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;
576
-
577
- --e-cal-tl-table-tooltip-arrow-width: 18px;
578
- --e-cal-tl-table-tooltip-arrow-height: 6px;
625
+ .e-cal-timeline-table__cell-tooltipwrapper {
626
+
627
+ --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);
628
+ --e-cal-timeline-table-tooltip-content-bg: rgba(17, 17, 17, 0.9);
629
+ --e-cal-timeline-table-tooltip-content-color: #fff;
630
+ --e-cal-timeline-table-tooltip-content-font-size: 0.75em;
631
+ --e-cal-timeline-table-tooltip-content-padding-x: 1em;
632
+ --e-cal-timeline-table-tooltip-content-padding-y: .5em;
633
+ --e-cal-timeline-table-tooltip-content-line-height: 1.5;
634
+ --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;
635
+ --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;
636
+ --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;
637
+ --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;
638
+
639
+ --e-cal-timeline-table-tooltip-arrow-width: 18px;
640
+ --e-cal-timeline-table-tooltip-arrow-height: 6px;
579
641
 
580
642
 
581
643
  position: absolute;
@@ -596,7 +658,7 @@
596
658
  display: block !important;
597
659
 
598
660
  &::before,
599
- > .e-cal-tl-table__cell-tooltipcontent {
661
+ > .e-cal-timeline-table__cell-tooltipcontent {
600
662
  opacity: 1;
601
663
  }
602
664
  }
@@ -604,21 +666,21 @@
604
666
  &:focus {
605
667
 
606
668
  &::before,
607
- > .e-cal-tl-table__cell-tooltipcontent {
669
+ > .e-cal-timeline-table__cell-tooltipcontent {
608
670
  opacity: 1;
609
671
  }
610
672
  }
611
673
 
612
674
 
613
675
  &::before,
614
- > .e-cal-tl-table__cell-tooltipcontent {
676
+ > .e-cal-timeline-table__cell-tooltipcontent {
615
677
  backface-visibility: hidden;
616
678
  will-change: transform;
617
679
  opacity: 0;
618
680
  box-sizing: border-box;
619
681
  z-index: 10;
620
682
  transform-origin: top;
621
- box-shadow: var(--e-cal-tl-table-tooltip-box-shadow);
683
+ box-shadow: var(--e-cal-timeline-table-tooltip-box-shadow);
622
684
  transition: .1s ease-in-out;
623
685
  }
624
686
 
@@ -630,18 +692,18 @@
630
692
  ---------------------------
631
693
  */
632
694
 
633
- > .e-cal-tl-table__cell-tooltipcontent {
634
- background: var(--e-cal-tl-table-tooltip-content-bg);
695
+ > .e-cal-timeline-table__cell-tooltipcontent {
696
+ background: var(--e-cal-timeline-table-tooltip-content-bg);
635
697
  border-radius: 4px;
636
- color: var(--e-cal-tl-table-tooltip-content-color);
698
+ color: var(--e-cal-timeline-table-tooltip-content-color);
637
699
  content: attr(aria-label);
638
- font-size: var(--e-cal-tl-table-tooltip-content-font-size);
700
+ font-size: var(--e-cal-timeline-table-tooltip-content-font-size);
639
701
  font-weight: normal;
640
702
  text-transform: none;
641
- padding: var(--e-cal-tl-table-tooltip-content-padding-y) var(--e-cal-tl-table-tooltip-content-padding-x);
703
+ padding: var(--e-cal-timeline-table-tooltip-content-padding-y) var(--e-cal-timeline-table-tooltip-content-padding-x);
642
704
  white-space: nowrap;
643
705
  box-sizing: content-box;
644
- line-height: var(--e-cal-tl-table-tooltip-content-line-height);
706
+ line-height: var(--e-cal-timeline-table-tooltip-content-line-height);
645
707
 
646
708
  img {
647
709
  height: auto !important;
@@ -660,22 +722,22 @@
660
722
 
661
723
  &[data-microtip-position|="top"] {
662
724
  &::before {
663
- background: var(--e-cal-tl-table-tooltip-arrow-bg-top);
664
- height: var(--e-cal-tl-table-tooltip-arrow-height);
665
- width: var(--e-cal-tl-table-tooltip-arrow-width);
725
+ background: var(--e-cal-timeline-table-tooltip-arrow-bg-top);
726
+ height: var(--e-cal-timeline-table-tooltip-arrow-height);
727
+ width: var(--e-cal-timeline-table-tooltip-arrow-width);
666
728
  }
667
729
 
668
- > .e-cal-tl-table__cell-tooltipcontent {
669
- margin-bottom: var(--e-cal-tl-table-tooltip-arrow-height);
730
+ > .e-cal-timeline-table__cell-tooltipcontent {
731
+ margin-bottom: var(--e-cal-timeline-table-tooltip-arrow-height);
670
732
  }
671
733
 
672
734
  &::before {
673
- top: calc(100% - var(--e-cal-tl-table-tooltip-arrow-height));
674
- left: calc(var(--e-cal-tl-table-tooltip-arrow-width)/2 * -1);
735
+ top: calc(100% - var(--e-cal-timeline-table-tooltip-arrow-height));
736
+ left: calc(var(--e-cal-timeline-table-tooltip-arrow-width)/2 * -1);
675
737
  }
676
738
 
677
- > .e-cal-tl-table__cell-tooltipcontent {
678
- bottom: calc(100% + var(--e-cal-tl-table-tooltip-arrow-height));
739
+ > .e-cal-timeline-table__cell-tooltipcontent {
740
+ bottom: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
679
741
  left: 50%;
680
742
  transform: translateX(-50%);
681
743
  }
@@ -689,10 +751,10 @@
689
751
  */
690
752
 
691
753
  &[data-microtip-position="top-left"] {
692
- > .e-cal-tl-table__cell-tooltipcontent {
693
- bottom: calc(100% + var(--e-cal-tl-table-tooltip-arrow-height));
754
+ > .e-cal-timeline-table__cell-tooltipcontent {
755
+ bottom: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
694
756
  left: 50%;
695
- transform: translateX(calc(-100% + var(--e-cal-tl-table-tooltip-arrow-width)));
757
+ transform: translateX(calc(-100% + var(--e-cal-timeline-table-tooltip-arrow-width)));
696
758
  }
697
759
 
698
760
  }
@@ -706,10 +768,10 @@
706
768
  */
707
769
 
708
770
  &[data-microtip-position="top-right"] {
709
- > .e-cal-tl-table__cell-tooltipcontent {
710
- bottom: calc(100% + var(--e-cal-tl-table-tooltip-arrow-height));
771
+ > .e-cal-timeline-table__cell-tooltipcontent {
772
+ bottom: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
711
773
  left: 50%;
712
- transform: translateX(calc(0% - var(--e-cal-tl-table-tooltip-arrow-width)));
774
+ transform: translateX(calc(0% - var(--e-cal-timeline-table-tooltip-arrow-width)));
713
775
  }
714
776
  }
715
777
 
@@ -722,25 +784,25 @@
722
784
 
723
785
  &[data-microtip-position|="bottom"] {
724
786
  &::before {
725
- background: var(--e-cal-tl-table-tooltip-arrow-bg-bottom);
726
- height: var(--e-cal-tl-table-tooltip-arrow-height);
727
- width: var(--e-cal-tl-table-tooltip-arrow-width);
787
+ background: var(--e-cal-timeline-table-tooltip-arrow-bg-bottom);
788
+ height: var(--e-cal-timeline-table-tooltip-arrow-height);
789
+ width: var(--e-cal-timeline-table-tooltip-arrow-width);
728
790
  margin-top: 5px;
729
791
  margin-bottom: 0;
730
792
  }
731
793
 
732
- > .e-cal-tl-table__cell-tooltipcontent {
733
- margin-top: var(--e-cal-tl-table-tooltip-arrow-height);
794
+ > .e-cal-timeline-table__cell-tooltipcontent {
795
+ margin-top: var(--e-cal-timeline-table-tooltip-arrow-height);
734
796
  }
735
797
 
736
798
  &::before {
737
- bottom: calc(100% - var(--e-cal-tl-table-tooltip-arrow-height));
738
- left: calc(var(--e-cal-tl-table-tooltip-arrow-width)/2 * -1);
799
+ bottom: calc(100% - var(--e-cal-timeline-table-tooltip-arrow-height));
800
+ left: calc(var(--e-cal-timeline-table-tooltip-arrow-width)/2 * -1);
739
801
  }
740
802
 
741
- > .e-cal-tl-table__cell-tooltipcontent {
803
+ > .e-cal-timeline-table__cell-tooltipcontent {
742
804
  bottom: auto;
743
- top: calc(100% + var(--e-cal-tl-table-tooltip-arrow-height));
805
+ top: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
744
806
  left: 50%;
745
807
  transform: translateX(-50%);
746
808
  }
@@ -755,11 +817,11 @@
755
817
 
756
818
 
757
819
  &[data-microtip-position="bottom-left"] {
758
- > .e-cal-tl-table__cell-tooltipcontent {
820
+ > .e-cal-timeline-table__cell-tooltipcontent {
759
821
  bottom: auto;
760
- top: calc(100% + var(--e-cal-tl-table-tooltip-arrow-height));
822
+ top: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
761
823
  left: 50%;
762
- transform: translateX(calc(-100% + var(--e-cal-tl-table-tooltip-arrow-width)));
824
+ transform: translateX(calc(-100% + var(--e-cal-timeline-table-tooltip-arrow-width)));
763
825
  }
764
826
  }
765
827
 
@@ -771,11 +833,11 @@
771
833
 
772
834
 
773
835
  &[data-microtip-position="bottom-right"] {
774
- > .e-cal-tl-table__cell-tooltipcontent {
836
+ > .e-cal-timeline-table__cell-tooltipcontent {
775
837
  bottom: auto;
776
- top: calc(100% + var(--e-cal-tl-table-tooltip-arrow-height));
838
+ top: calc(100% + var(--e-cal-timeline-table-tooltip-arrow-height));
777
839
  left: 50%;
778
- transform: translateX(calc(0% - var(--e-cal-tl-table-tooltip-arrow-width)));
840
+ transform: translateX(calc(0% - var(--e-cal-timeline-table-tooltip-arrow-width)));
779
841
  }
780
842
  }
781
843
 
@@ -787,7 +849,7 @@
787
849
  10. Size
788
850
  ---------------------------
789
851
  */
790
- &[data-microtip-size="auto"].e-cal-tl-table__cell-tooltipcontent {
852
+ &[data-microtip-size="auto"].e-cal-timeline-table__cell-tooltipcontent {
791
853
  white-space: nowrap;
792
854
  width: auto;
793
855
  max-width: 530px;
@@ -795,17 +857,17 @@
795
857
  text-overflow: ellipsis;
796
858
  }
797
859
 
798
- &[data-microtip-size="small"].e-cal-tl-table__cell-tooltipcontent {
860
+ &[data-microtip-size="small"].e-cal-timeline-table__cell-tooltipcontent {
799
861
  white-space: initial;
800
862
  width: 80px;
801
863
  }
802
864
 
803
- &[data-microtip-size="medium"].e-cal-tl-table__cell-tooltipcontent {
865
+ &[data-microtip-size="medium"].e-cal-timeline-table__cell-tooltipcontent {
804
866
  white-space: initial;
805
867
  width: 150px;
806
868
  }
807
869
 
808
- &[data-microtip-size="large"].e-cal-tl-table__cell-tooltipcontent {
870
+ &[data-microtip-size="large"].e-cal-timeline-table__cell-tooltipcontent {
809
871
  white-space: initial;
810
872
  width: 260px;
811
873
  }