@syncfusion/ej2-react-gantt 20.1.58 → 20.2.36

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.
package/styles/fabric.css CHANGED
@@ -116,6 +116,9 @@
116
116
  .e-gantt .e-add::before {
117
117
  content: "\e7d5";
118
118
  }
119
+ .e-gantt .e-critical-path::before {
120
+ content: "\e931";
121
+ }
119
122
  .e-gantt .e-edit::before {
120
123
  content: "\e97c";
121
124
  }
@@ -196,26 +199,219 @@
196
199
  content: "\e903";
197
200
  }
198
201
 
202
+ .e-gantt-tooltip-arrow-left::before {
203
+ content: "\e85b";
204
+ }
205
+
206
+ .e-gantt-tooltip-arrow-right::before {
207
+ content: "\e85f";
208
+ }
209
+
199
210
  .e-bigger .e-gantt .e-gantt-chart .e-timeline-header-container {
200
211
  height: 64px;
201
212
  }
202
213
  .e-bigger .e-gantt .e-gantt-chart .e-timeline-top-header-cell {
203
214
  height: 32px;
204
215
  }
216
+ .e-bigger .e-gantt .e-gantt-chart .e-event-markers .e-span-label {
217
+ border-radius: 4px !important;
218
+ font-size: 12px !important;
219
+ height: 26px !important;
220
+ padding: 4px 11px 4px 9px !important;
221
+ top: 65px !important;
222
+ }
223
+ .e-bigger .e-gantt .e-gantt-chart .e-event-markers .e-gantt-right-arrow {
224
+ border-bottom: 6px solid transparent;
225
+ border-right: 6px solid transparent;
226
+ border-right-color: #deecf9;
227
+ border-top: 6px solid transparent;
228
+ top: 73px !important;
229
+ }
230
+ .e-bigger .e-gantt .e-gantt-chart .e-left-resize-gripper::before,
231
+ .e-bigger .e-gantt .e-gantt-chart .e-right-resize-gripper::before {
232
+ content: "\e92c";
233
+ }
234
+ .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-right,
235
+ .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-left,
236
+ .e-bigger .e-gantt .e-gantt-chart .e-right-connectorpoint-outer-div,
237
+ .e-bigger .e-gantt .e-gantt-chart .e-left-connectorpoint-outer-div {
238
+ border-radius: 50%;
239
+ display: inline-block;
240
+ position: absolute;
241
+ }
242
+ .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-left-hover,
243
+ .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-right-hover {
244
+ border-style: solid;
245
+ border-width: 1px;
246
+ box-sizing: content-box;
247
+ cursor: pointer;
248
+ display: inline-block;
249
+ }
250
+ .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-left-hover,
251
+ .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-right-hover {
252
+ background-color: #0d6efd;
253
+ border-color: #fff;
254
+ }
255
+ .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-left-hover:hover,
256
+ .e-bigger .e-gantt .e-gantt-chart .e-connectorpoint-right-hover:hover {
257
+ background-color: #0d6efd;
258
+ border-color: #fff;
259
+ outline: 2px solid #b7e0ff;
260
+ }
261
+ .e-bigger .e-gantt .e-tab .e-content {
262
+ height: 242px !important;
263
+ }
205
264
  .e-bigger .e-gantt .e-gantt-tree-grid-pane .e-columnheader .e-headercell {
206
265
  height: 63px !important;
207
266
  }
267
+ .e-bigger .e-gantt .e-dialog .e-dlg-header-content {
268
+ padding: 16px 4px 16px 16px !important;
269
+ }
270
+ .e-bigger .e-gantt .e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
271
+ left: 0 !important;
272
+ }
273
+ .e-bigger .e-gantt .e-dialog .e-btn .e-btn-icon.e-icon-dlg-close {
274
+ font-size: 12px !important;
275
+ }
276
+ .e-bigger .e-gantt .e-dialog .e-footer-content {
277
+ height: 70px !important;
278
+ padding: 16px !important;
279
+ }
280
+ .e-bigger .e-gantt .e-dialog .e-footer-content .e-btn {
281
+ margin-left: 12px;
282
+ }
283
+ .e-bigger .e-gantt .e-dialog .e-dlg-header {
284
+ line-height: 28px;
285
+ }
286
+ .e-bigger .e-gantt .e-filter-popup {
287
+ width: 350px !important;
288
+ }
289
+ .e-bigger .e-gantt .e-grid .e-flmenu-valuediv {
290
+ padding: 16px 0 0 !important;
291
+ }
292
+ .e-bigger .e-gantt .e-filter-popup .e-dlg-content {
293
+ border-radius: 6px !important;
294
+ padding: 32px 16px 16px !important;
295
+ }
208
296
  .e-bigger .e-columnmenu {
209
297
  top: 45px;
210
298
  }
299
+ .e-bigger .e-gantt-dialog {
300
+ border-radius: 6px;
301
+ width: 556px !important;
302
+ }
303
+ .e-bigger .e-gantt-dialog .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
304
+ padding: 0 16px !important;
305
+ }
211
306
  .e-bigger .e-gantt-dialog .e-edit-form-column:nth-child(odd) {
212
- padding: 16px 18px 0 18px;
307
+ padding: 16px 12px 0 16px;
213
308
  }
214
309
  .e-bigger .e-gantt-dialog .e-edit-form-column:nth-child(even) {
215
- padding: 16px 18px 0 0;
310
+ padding: 16px 16px 0 12px;
216
311
  }
217
312
  .e-bigger .e-gantt-dialog .e-edit-form-row.e-scroll .e-edit-form-column:nth-child(even) {
218
- padding: 16px 18px 0 0;
313
+ padding: 16px 18px 0 9px;
314
+ }
315
+ .e-bigger .e-gantt-dialog .e-edit-form-row {
316
+ height: 242px !important;
317
+ }
318
+ .e-bigger .e-gantt-dialog .e-edit-form-column {
319
+ height: 76px !important;
320
+ }
321
+ .e-bigger .e-gantt-dialog .e-dlg-header-content {
322
+ border-bottom: 0 !important;
323
+ }
324
+ .e-bigger .e-gantt-dialog > .e-dlg-content {
325
+ border-radius: 0 !important;
326
+ }
327
+ .e-bigger .e-gantt-dialog .e-dlg-header-content {
328
+ border-radius: 6px 6px 0px 0px;
329
+ padding-bottom: 4px;
330
+ }
331
+ .e-bigger .e-gantt-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
332
+ border-radius: 50%;
333
+ height: auto !important;
334
+ width: auto;
335
+ }
336
+ .e-bigger .e-gantt-dialog .e-tab .e-tab-header .e-toolbar-item.e-active {
337
+ margin-left: 5px !important;
338
+ }
339
+ .e-bigger .e-gantt-dialog .e-control-wrapper .e-input-group-icon.e-date-icon {
340
+ font-size: 16px !important;
341
+ }
342
+ .e-bigger .e-gantt-dialog .e-control-wrapper .e-input-group-icon.e-date-icon {
343
+ min-height: 35px !important;
344
+ min-width: 35.82px !important;
345
+ }
346
+ .e-bigger .e-gantt-dialog .e-btn.e-flat {
347
+ line-height: 24px;
348
+ padding: 6px 16px 6px 15px !important;
349
+ }
350
+ .e-bigger .e-gantt-dialog .e-btn.e-primary {
351
+ padding: 6px 21px 6px 23px !important;
352
+ }
353
+ .e-bigger .e-gantt-dialog .e-datetime-wrapper .e-time-icon.e-icons::before {
354
+ font-size: 16px !important;
355
+ }
356
+ .e-bigger .e-gantt-dialog .e-float-input.e-control-wrapper input ~ label.e-label-top.e-float-text {
357
+ font-size: 14px;
358
+ line-height: 22px;
359
+ }
360
+ .e-bigger .e-gantt-dialog .e-float-input.e-control-wrapper input[disabled] ~ label.e-label-top.e-float-text {
361
+ font-size: 14px;
362
+ line-height: 22px;
363
+ }
364
+ .e-bigger .e-gantt-dialog .e-float-input.e-control-wrapper input {
365
+ height: 34px !important;
366
+ }
367
+ .e-bigger .e-gantt-dialog .e-numeric.e-control-wrapper.e-input-group .e-input-group-icon {
368
+ min-height: 35px !important;
369
+ min-width: 35.82px !important;
370
+ }
371
+ .e-bigger .e-gantt-dialog .e-control-wrapper .e-input-group-icon.e-time-icon {
372
+ min-height: 35px !important;
373
+ min-width: 35.82px !important;
374
+ }
375
+ .e-bigger .e-gantt-dialog .e-input-group.e-control-wrapper {
376
+ height: 36px;
377
+ }
378
+ .e-bigger .e-gantt-dialog .e-input-group-icon.e-date-icon {
379
+ min-width: 36px !important;
380
+ }
381
+ .e-bigger .e-predecessor-tooltip {
382
+ background-color: #000;
383
+ }
384
+ .e-bigger .e-predecessor-tooltip .e-left-btn:disabled {
385
+ color: #a6a6a6 !important;
386
+ }
387
+ .e-bigger .e-predecessor-tooltip .e-right-btn:disabled {
388
+ color: #a6a6a6 !important;
389
+ }
390
+ .e-bigger .e-predecessor-tooltip .e-tip-content {
391
+ padding: 3px !important;
392
+ }
393
+ .e-bigger .e-predecessor-tooltip .e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:first-of-type {
394
+ background-color: #000;
395
+ border-color: #000;
396
+ color: #fff;
397
+ font-size: 12px;
398
+ line-height: 18px;
399
+ padding: 0 8px 0 0;
400
+ }
401
+ .e-bigger .e-predecessor-tooltip .e-btn-group:not(.e-rtl):not(.e-vertical) .e-btn:last-of-type {
402
+ background-color: #000;
403
+ border-color: #000;
404
+ color: #fff;
405
+ font-size: 12px;
406
+ line-height: 18px;
407
+ padding: 0 0 0 8px;
408
+ }
409
+ .e-bigger .e-predecessor-dialog {
410
+ background-color: #f8f8f8;
411
+ }
412
+ .e-bigger .e-predecessor-dialog .e-dlg-content {
413
+ background-color: #f8f8f8;
414
+ padding: 10px 9px 9px 14px !important;
219
415
  }
220
416
 
221
417
  .e-gantt {
@@ -370,9 +566,11 @@
370
566
  position: absolute;
371
567
  }
372
568
  .e-gantt .e-gantt-chart .e-chart-root-container .e-holiday-container {
569
+ height: 100%;
373
570
  position: absolute;
374
571
  }
375
572
  .e-gantt .e-gantt-chart .e-chart-root-container .e-weekend-container {
573
+ height: 100%;
376
574
  position: absolute;
377
575
  }
378
576
  .e-gantt .e-gantt-chart .e-timeline-header-container {
@@ -621,37 +819,35 @@
621
819
  cursor: col-resize;
622
820
  }
623
821
  .e-gantt .e-gantt-chart .e-progress-resize-gripper .e-progressbar-handler {
624
- border-style: solid;
625
822
  border-width: 1px;
626
823
  box-sizing: content-box;
627
824
  cursor: col-resize;
628
825
  height: 2px;
629
826
  position: absolute;
630
827
  top: 7px;
631
- width: 12px;
632
828
  }
633
829
  .e-gantt .e-gantt-chart .e-progress-resize-gripper .e-progressbar-handler-element {
634
830
  border-bottom-style: solid;
635
- border-bottom-width: 6px;
831
+ border-bottom-width: 8px;
636
832
  border-left: 7px solid transparent;
637
833
  border-right: 7px solid transparent;
638
834
  cursor: col-resize;
639
835
  height: 0;
640
- left: -1px;
836
+ left: 0;
641
837
  position: absolute;
642
838
  top: -7px;
643
839
  width: 0;
644
840
  }
645
841
  .e-gantt .e-gantt-chart .e-progress-resize-gripper .e-progressbar-handler-after {
646
842
  border-bottom-style: solid;
647
- border-bottom-width: 6px;
843
+ border-bottom-width: 8px;
648
844
  border-left: 6px solid transparent;
649
845
  border-right: 6px solid transparent;
650
846
  cursor: col-resize;
651
847
  height: 0;
652
- left: -1px;
848
+ left: 1px;
653
849
  position: absolute;
654
- top: -6px;
850
+ top: -7px;
655
851
  width: 0;
656
852
  }
657
853
  .e-gantt .e-gantt-chart .e-baseline-bar {
@@ -786,6 +982,9 @@
786
982
  .e-gantt .e-gantt-chart .e-connector-line-hover {
787
983
  outline: 1px solid;
788
984
  }
985
+ .e-gantt .e-gantt-chart .e-critical-connector-line-hover {
986
+ outline: 1px solid;
987
+ }
789
988
  .e-gantt .e-gantt-chart .e-connector-line-hover-z-index {
790
989
  z-index: 100;
791
990
  }
@@ -1078,6 +1277,10 @@
1078
1277
  height: 100%;
1079
1278
  }
1080
1279
 
1280
+ .e-predecessor-tooltip {
1281
+ visibility: hidden;
1282
+ }
1283
+
1081
1284
  /*! Gantt theme */
1082
1285
  .e-gantt .e-gantt-splitter {
1083
1286
  border-color: #eaeaea;
@@ -1158,13 +1361,13 @@
1158
1361
  border-spacing: 0;
1159
1362
  }
1160
1363
  .e-gantt .e-gantt-chart .e-chart-row-border {
1161
- border-top-color: #e0e0e0;
1364
+ border-top-color: #eaeaea;
1162
1365
  }
1163
1366
  .e-gantt .e-gantt-chart .e-chart-row-cell {
1164
- color: rgb(0, 0, 0);
1367
+ color: #000;
1165
1368
  }
1166
1369
  .e-gantt .e-gantt-chart .e-chart-row-border.e-lastrow {
1167
- border-bottom-color: #e0e0e0;
1370
+ border-bottom-color: #eaeaea;
1168
1371
  }
1169
1372
  .e-gantt .e-gantt-chart .e-line-container-cell {
1170
1373
  border-color: #e0e0e0;
@@ -1220,6 +1423,10 @@
1220
1423
  background-color: #6D1888;
1221
1424
  border: 0px;
1222
1425
  }
1426
+ .e-gantt .e-gantt-chart .e-gantt-critical-child-manualprogressbar {
1427
+ background-color: #6D1888;
1428
+ border: 0px;
1429
+ }
1223
1430
  .e-gantt .e-gantt-chart .e-holiday {
1224
1431
  background: #f4f4f4;
1225
1432
  }
@@ -1251,7 +1458,6 @@
1251
1458
  }
1252
1459
  .e-gantt .e-gantt-chart .e-gantt-unscheduled-taskbar {
1253
1460
  background: linear-gradient(to right, rgba(0, 91, 163, 0.2), #005ba3 30%, #005ba3 70%, #005ba3 70%, rgba(0, 91, 163, 0.2) 100%);
1254
- background-color: rgba(0, 91, 163, 0.2);
1255
1461
  border: 0px;
1256
1462
  border-radius: 0px;
1257
1463
  }
@@ -1295,7 +1501,7 @@
1295
1501
  }
1296
1502
  .e-gantt .e-gantt-chart .e-connectorpoint-left-hover,
1297
1503
  .e-gantt .e-gantt-chart .e-connectorpoint-right-hover {
1298
- background-color: #666;
1504
+ background-color: #0d6efd;
1299
1505
  border-color: #fff;
1300
1506
  }
1301
1507
  .e-gantt .e-gantt-chart .e-connectorpoint-left-hover:hover,
@@ -1391,13 +1597,13 @@
1391
1597
  color: #333;
1392
1598
  }
1393
1599
  .e-gantt .e-gantt-chart .e-baseline-bar {
1394
- background-color: #D83B01;
1600
+ background-color: #d83b01;
1395
1601
  }
1396
1602
  .e-gantt .e-gantt-chart .e-baseline-milestone-top {
1397
- border-bottom-color: #D83B01;
1603
+ border-bottom-color: #d83b01;
1398
1604
  }
1399
1605
  .e-gantt .e-gantt-chart .e-baseline-milestone-bottom {
1400
- border-top-color: #D83B01;
1606
+ border-top-color: #d83b01;
1401
1607
  }
1402
1608
  .e-gantt .e-gantt-chart .e-uptail::before {
1403
1609
  border-bottom-color: #e0e0e0;
@@ -1552,4 +1758,56 @@
1552
1758
  }
1553
1759
  .e-gantt.e-device .e-backarrowspan {
1554
1760
  color: #000;
1761
+ }
1762
+
1763
+ .e-gantt .e-gantt-chart .e-criticalconnector-line {
1764
+ border-color: #d13438;
1765
+ }
1766
+
1767
+ .e-gantt .e-gantt-chart .e-criticalconnector-line-right-arrow {
1768
+ border-left-color: #d13438;
1769
+ }
1770
+
1771
+ .e-gantt .e-gantt-chart .e-criticalconnector-line-left-arrow {
1772
+ border-right-color: #d13438;
1773
+ }
1774
+
1775
+ .e-gantt .e-gantt-chart .e-critical-connector-line-hover {
1776
+ border-color: #f3d8da;
1777
+ outline-color: #f3d8da;
1778
+ }
1779
+
1780
+ .e-gantt .e-gantt-chart .e-critical-connector-line-right-arrow-hover {
1781
+ border-left-color: #f3d8da;
1782
+ }
1783
+
1784
+ .e-gantt .e-gantt-chart .e-critical-connector-line-left-arrow-hover {
1785
+ border-right-color: #f3d8da;
1786
+ }
1787
+
1788
+ .e-gantt .e-gantt-chart .e-gantt-child-critical-taskbar-inner-div {
1789
+ background-color: #f3d8da;
1790
+ border: 1px solid #f3d8da;
1791
+ border-radius: 0px;
1792
+ }
1793
+
1794
+ .e-gantt .e-gantt-chart .e-gantt-child-critical-progressbar-inner-div {
1795
+ background-color: #d13438;
1796
+ border: 0px;
1797
+ border-radius: 4px;
1798
+ }
1799
+
1800
+ .e-gantt .e-gantt-chart .e-gantt-critical-unscheduled-taskbar {
1801
+ background: linear-gradient(to right, rgba(255, 85, 85, 0.2), #d13438 30%, #d13438 70%, #d13438 70%, rgba(255, 85, 85, 0.2) 100%);
1802
+ background-color: rgba(255, 85, 85, 0.2);
1803
+ border: 0px;
1804
+ border-radius: 0px;
1805
+ }
1806
+
1807
+ .e-gantt .e-gantt-chart .e-critical-milestone-top {
1808
+ border-bottom-color: #D13438;
1809
+ }
1810
+
1811
+ .e-gantt .e-gantt-chart .e-critical-milestone-bottom {
1812
+ border-top-color: #D13438;
1555
1813
  }