@syncfusion/ej2-angular-gantt 23.2.7 → 24.1.41

package/styles/gantt/_bootstrap4-definition.scss

@@ -85,6 +85,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 16px 18px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 16px 16px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 16px 16px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-predecessor-dialog-padding: 10px 9px 9px 14px !important;
 $gantt-bigger-predecessor-dialog-font-size: 12px;
 $gantt-bigger-predecessor-dialog-font-weight: 400 !default;
@@ -97,7 +98,6 @@ $gantt-bigger-tooltip-disabled-button-color: $gray-500 !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 12px 0 16px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 16px 0 12px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 9px !default;
-$gantt-bigger-dialog-close-button-left: 1px !important;
 $gantt-bigger-dialog-close-button-size: 14px !important;
 $gantt-bigger-dialog-header-padding: 16px 4px 16px 16px !important;
 $gantt-bigger-add-dialog-content-height: 250px !important;
@@ -129,6 +129,7 @@ $gantt-dialog-bigger-border-radius: 6px !important;
 $gantt-bigger-dialog-tab-padding-left: 5px !important;
 $gantt-bigger-dialog-icon-color: $primary-font !default;
 $gantt-bigger-dialog-border-radius: 6px 6px 0px 0px !default;
+$gantt-dialog-close-button-top: 2px !important;
 $gantt-dialog-dependent-height: 161px !default;
 $gantt-dialog-resource-height: 202px !default;
 $gantt-dialog-rte-height: 241px !default;
@@ -158,6 +159,7 @@ $gantt-parent-progress-bar-border-radius: 4px !default;
 $gantt-timeline-top-headercell-font-size: 14px !default;
 $gantt-timeline-top-headercell-font-weight: bold !default;
 $gantt-active-background: rgba($primary, .16) !default;
+$gantt-active-frozen-background: #d6eaff !default;
 $gantt-active-color: #333 !default;
 $gantt-active-color-opacity: 1 !default;
 $gantt-table-background: $primary-font !default;
@@ -214,4 +216,7 @@ $gantt-collapse-progress-width: 0px !important;
 $rangecontainer-border-color: #FC7A05;
 $gantt-range-container-arc-radius: 2px !default;
 $bigger-column-menu-size: 38px !default;
-$gantt-masked-table-background-color: #e1dfdd;
+$gantt-masked-table-background-color: #e1dfdd;
+$gantt-rowdd-topbottom-border: 1px solid #e3165b !default;
+$gantt-rowdd-boxshadow: #e3165b !default;
+$gantt-rowdd-childborder-width: 1px 0 0 !default;

package/styles/gantt/_bootstrap5-definition.scss

@@ -69,6 +69,7 @@ $gantt-tab-selection-indicator-color: $primary !default;
 $gantt-tab-header-hover-color: $transparent !default;
 $gantt-tab-header-hover-font-color: $content-text-color-alt2 !default;
 $gantt-active-background: $table-bg-color-selected;
+$gantt-active-frozen-background: $table-bg-color-selected;
 $gantt-active-color: $table-text-color-selected !default;
 $gantt-table-background: $content-bg-color !default;
 $gantt-baseline-color: $warning !default;
@@ -123,6 +124,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 12px 18px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 12px 18px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 12px 18px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-tooltip-button-color: $warning-text;
 $gantt-bigger-tooltip-dialog-color: $content-bg-color;
 $gantt-bigger-tooltip-button-text-color: $white;
@@ -130,7 +132,6 @@ $gantt-bigger-tooltip-dialog-text-color: $content-text-color;
 $gantt-bigger-tooltip-disabled-button-color: $content-bg-color-alt5 !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 12px 0 16px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 16px 0 12px !default;
-$gantt-bigger-dialog-close-button-left: 2px !important;
 $gantt-bigger-dialog-close-button-size: 14px !important;
 $gantt-bigger-dialog-header-padding: 16px 4px 16px 16px !important;
 $gantt-bigger-add-dialog-content-height: 250px !important;
@@ -166,6 +167,7 @@ $gantt-dialog-bigger-border-radius: 6px !important;
 $gantt-bigger-dialog-tab-padding-left: 5px !important;
 $gantt-bigger-dialog-border-radius: 6px 6px 0px 0px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 9px !default;
+$gantt-dialog-close-button-top: 0 !important;
 $gantt-dialog-dependent-height: 161px !default;
 $gantt-dialog-resource-height: 202px !default;
 $gantt-dialog-rte-height: 241px !default;
@@ -216,4 +218,7 @@ $grid-active-container-border: 0 0 0 1px $border inset !default;
 $gantt-collapse-progress-width: 0px !important;
 $gantt-range-container-arc-radius: 2px !default;
 $bigger-column-menu-size: 35px !default;
-$gantt-masked-table-background-color: rgb(225,223,221);
+$gantt-masked-table-background-color: rgb(225,223,221);
+$gantt-rowdd-topbottom-border: 2px solid #4f46e5 !default;
+$gantt-rowdd-boxshadow: $primary !default;
+$gantt-rowdd-childborder-width: 2px 0 0 !default;

package/styles/gantt/_fabric-dark-definition.scss

@@ -83,6 +83,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 15px 20px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 16px 16px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 16px 16px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-predecessor-dialog-padding: 10px 9px 9px 14px !important;
 $gantt-bigger-predecessor-dialog-font-size: 12px;
 $gantt-bigger-predecessor-dialog-font-weight: 400 !default;
@@ -94,7 +95,6 @@ $gantt-bigger-tooltip-dialog-text-color: $grey-dark-font;
 $gantt-bigger-tooltip-disabled-button-color: #A6A6A6 !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 12px 0 16px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 16px 0 12px !default;
-$gantt-bigger-dialog-close-button-left: 0 !important;
 $gantt-bigger-dialog-close-button-size: 12px !important;
 $gantt-bigger-dialog-header-padding: 16px 4px 16px 16px !important;
 $gantt-bigger-add-dialog-content-height: 242px !important;
@@ -126,6 +126,7 @@ $gantt-dialog-bigger-border-radius: 6px !important;
 $gantt-bigger-dialog-tab-padding-left: 5px !important;
 $gantt-bigger-dialog-border-radius: 6px 6px 0px 0px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 0 !default;
+$gantt-dialog-close-button-top: 0 !important;
 $gantt-dialog-dependent-height: 161px !default;
 $gantt-dialog-resource-height: 202px !default;
 $gantt-dialog-rte-height: 241px !default;
@@ -155,6 +156,7 @@ $gantt-parent-progress-bar-border-radius: 0px !default;
 $gantt-timeline-top-headercell-font-size: 14px !default;
 $gantt-timeline-top-headercell-font-weight: 400 !default;
 $gantt-active-background: $neutral-quintenary!default;
+$gantt-active-frozen-background: $neutral-quintenary!default;
 $gantt-active-color: $neutral-primary !default;
 $gantt-active-color-opacity: 1 !default;
 $gantt-table-background: $neutral-white !default;
@@ -212,4 +214,7 @@ $rangecontainer-border-color: #FC7A05;
 $gantt-range-container-arc-radius: 0px !default;
 $gantt-active-background-color: #a9a9a9;
 $bigger-column-menu-size: 45px !default;
-$gantt-masked-table-background-color: #e1dfdd;
+$gantt-masked-table-background-color: #e1dfdd;
+$gantt-rowdd-topbottom-border: 1px solid #0074cc !default;
+$gantt-rowdd-boxshadow: #0074cc !default;
+$gantt-rowdd-childborder-width: 1px 0 0 !default;

package/styles/gantt/_fabric-definition.scss

@@ -83,6 +83,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 15px 20px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 16px 16px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 16px 16px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-predecessor-dialog-padding: 10px 9px 9px 14px !important;
 $gantt-bigger-predecessor-dialog-font-size: 12px;
 $gantt-bigger-predecessor-dialog-font-weight: 400 !default;
@@ -94,7 +95,6 @@ $gantt-bigger-tooltip-dialog-text-color: $neutral-black;
 $gantt-bigger-tooltip-disabled-button-color: $neutral-tertiary !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 12px 0 16px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 16px 0 12px !default;
-$gantt-bigger-dialog-close-button-left: 0 !important;
 $gantt-bigger-dialog-close-button-size: 12px !important;
 $gantt-bigger-dialog-header-padding: 16px 4px 16px 16px !important;
 $gantt-bigger-add-dialog-content-height: 242px !important;
@@ -126,6 +126,7 @@ $gantt-dialog-bigger-border-radius: 6px !important;
 $gantt-bigger-dialog-tab-padding-left: 5px !important;
 $gantt-bigger-dialog-border-radius: 6px 6px 0px 0px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 9px !default;
+$gantt-dialog-close-button-top: 0 !important;
 $gantt-dialog-dependent-height: 161px !default;
 $gantt-dialog-resource-height: 202px !default;
 $gantt-dialog-rte-height: 241px !default;
@@ -155,6 +156,7 @@ $gantt-parent-progress-bar-border-radius: 0px !default;
 $gantt-timeline-top-headercell-font-size: 14px !default;
 $gantt-timeline-top-headercell-font-weight: 400 !default;
 $gantt-active-background: rgb(209, 235, 255)!default;
+$gantt-active-frozen-background: rgb(209, 235, 255)!default;
 $gantt-active-color: $neutral-primary !default;
 $gantt-active-color-opacity: 1 !default;
 $gantt-table-background: $neutral-white !default;
@@ -212,4 +214,7 @@ $gantt-collapse-progress-width: 0px !important;
 $rangecontainer-border-color: #FC7A05;
 $gantt-range-container-arc-radius: 0px !default;
 $bigger-column-menu-size: 45px !default;
-$gantt-masked-table-background-color: #e1dfdd;
+$gantt-masked-table-background-color: #e1dfdd;
+$gantt-rowdd-topbottom-border: 1px solid #0078d6 !default;
+$gantt-rowdd-boxshadow: #0078d6 !default;
+$gantt-rowdd-childborder-width: 1px 0 0 !default;

package/styles/gantt/_fluent-definition.scss

@@ -69,6 +69,7 @@ $gantt-tab-selection-indicator-color: $primary !default;
 $gantt-tab-header-hover-color: $transparent !default;
 $gantt-tab-header-hover-font-color: $content-text-color-alt2 !default;
 $gantt-active-background: $table-bg-color-selected;
+$gantt-active-frozen-background: $table-bg-color-selected;
 $gantt-active-color: $table-text-color-selected !default;
 $gantt-table-background: $content-bg-color !default;
 $gantt-baseline-color: $warning !default;
@@ -123,6 +124,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 12px 18px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 12px 18px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 12px 18px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-predecessor-dialog-padding: 10px 9px 9px 14px !important;
 $gantt-bigger-predecessor-dialog-font-size: $text-xs;
 $gantt-bigger-predecessor-dialog-font-weight: $font-weight-normal !default;
@@ -134,7 +136,6 @@ $gantt-bigger-tooltip-dialog-text-color: $content-text-color;
 $gantt-bigger-tooltip-disabled-button-color: $content-text-color-disabled !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 8px 0 28px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 28px 0 8px !default;
-$gantt-bigger-dialog-close-button-left: 8px !important;
 $gantt-bigger-dialog-close-button-size: 14px !important;
 $gantt-bigger-dialog-header-padding: 16px 4px 16px 28px !important;
 $gantt-bigger-add-dialog-content-height: 254px !important;
@@ -166,6 +167,7 @@ $gantt-dialog-bigger-border-radius: 2px !important;
 $gantt-bigger-dialog-tab-padding-left: 16px !important;
 $gantt-bigger-dialog-border-radius: 6px 6px 0px 0px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 9px !default;
+$gantt-dialog-close-button-top: 0 !important;
 $gantt-dialog-dependent-height: 161px !default;
 $gantt-dialog-resource-height: 202px !default;
 $gantt-dialog-rte-height: 241px !default;
@@ -216,4 +218,7 @@ $grid-active-container-border: 0 0 0 1px $border inset !default;
 $gantt-collapse-progress-width: 0px !important;
 $gantt-range-container-arc-radius: 2px !default;
 $bigger-column-menu-size: 38px !default;
-$gantt-masked-table-background-color: rgb(225,223,221);
+$gantt-masked-table-background-color: rgb(225,223,221);
+$gantt-rowdd-topbottom-border: 2px solid $primary !default;
+$gantt-rowdd-boxshadow: $primary !default;
+$gantt-rowdd-childborder-width: 2px 0 0 !default;

package/styles/gantt/_fusionnew-definition.scss

@@ -69,6 +69,7 @@ $gantt-tab-selection-indicator-color: $primary !default;
 $gantt-tab-header-hover-color: $transparent !default;
 $gantt-tab-header-hover-font-color: $content-text-color-alt2 !default;
 $gantt-active-background: $table-bg-color-selected;
+$gantt-active-frozen-background: $table-bg-color-selected;
 $gantt-active-color: $table-text-color-selected !default;
 $gantt-table-background: $content-bg-color !default;
 $gantt-baseline-color: $warning !default;
@@ -123,13 +124,13 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 12px 18px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 12px 18px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 12px 18px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-tooltip-button-color: $tooltip-bg-color;
 $gantt-bigger-tooltip-button-text-color: $toooltip-text-color;
 $gantt-bigger-tooltip-dialog-text-color: $warnig-text;
 $gantt-bigger-tooltip-disabled-button-color: $content-text-color-disabled !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 12px 0 16px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 16px 0 12px !default;
-$gantt-bigger-dialog-close-button-left: 2px !important;
 $gantt-bigger-dialog-close-button-size: 14px !important;
 $gantt-bigger-dialog-header-padding: 16px 4px 16px 16px !important;
 $gantt-bigger-add-dialog-content-height: 250px !important;
@@ -215,4 +216,7 @@ $grid-active-container-border: 0 0 0 1px $border inset !default;
 $gantt-collapse-progress-width: 0px !important;
 $gantt-range-container-arc-radius: 2px !default;
 $bigger-column-menu-size: 35px !default;
-$gantt-masked-table-background-color: rgb(225,223,221);
+$gantt-masked-table-background-color: rgb(225,223,221);
+$gantt-rowdd-topbottom-border: 2px solid #4f46e5 !default;
+$gantt-rowdd-boxshadow: $primary !default;
+$gantt-rowdd-childborder-width: 2px 0 0 !default;

package/styles/gantt/_highcontrast-definition.scss

@@ -83,6 +83,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 16px 18px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 16px 16px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 16px 16px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-predecessor-dialog-padding: 10px 9px 9px 14px !important;
 $gantt-bigger-predecessor-dialog-font-size: 12px;
 $gantt-bigger-predecessor-dialog-font-weight: 400 !default;
@@ -92,7 +93,6 @@ $gantt-bigger-tooltip-dialog-text-color: $message-font;
 $gantt-bigger-tooltip-dialog-color: $bg-base-10;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 9px 0 18px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 18px 0 9px !default;
-$gantt-bigger-dialog-close-button-left: 2px !important;
 $gantt-bigger-dialog-close-button-size: 12px !important;
 $gantt-bigger-dialog-header-padding: 16px 4px 12px 18px !important;
 $gantt-bigger-add-dialog-content-height: 241px !important;
@@ -126,6 +126,7 @@ $gantt-dialog-bigger-border-radius: 0px !important;
 $gantt-bigger-dialog-tab-padding-left: 6px !important;
 $gantt-bigger-dialog-border-radius: 6px 6px 0px 0px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 9px !default;
+$gantt-dialog-close-button-top: 0px !important;
 $gantt-dialog-dependent-height: 161px !default;
 $gantt-dialog-resource-height: 202px !default;
 $gantt-dialog-rte-height: 241px !default;
@@ -155,6 +156,7 @@ $gantt-parent-progress-bar-border-radius: 0px !default;
 $gantt-timeline-top-headercell-font-size: 14px !default;
 $gantt-timeline-top-headercell-font-weight: 400 !default;
 $gantt-active-background: rgba($selection-bg, 0.70) !default;
+$gantt-active-frozen-background: #b39828 !default;
 $gantt-active-color: $selection-font !default;
 $gantt-active-color-opacity: 1 !default;
 $gantt-table-background: $selection-font !default;
@@ -212,4 +214,7 @@ $gantt-collapse-progress-width: 0px !important;
 $rangecontainer-border-color: #FC7A05;
 $gantt-range-container-arc-radius: 0px !default;
 $bigger-column-menu-size: 45px !default;
-$gantt-masked-table-background-color: #e1dfdd;
+$gantt-masked-table-background-color: #e1dfdd;
+$gantt-rowdd-topbottom-border: 1px solid #ffd939 !default;
+$gantt-rowdd-boxshadow: #ffd939 !default;
+$gantt-rowdd-childborder-width: 1px 0 0 !default;

package/styles/gantt/_highcontrast-light-definition.scss

@@ -83,6 +83,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 16px 18px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 16px 16px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 16px 16px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-predecessor-dialog-padding: 10px 9px 9px 14px !important;
 $gantt-bigger-predecessor-dialog-font-size: 12px;
 $gantt-bigger-predecessor-dialog-font-weight: 400 !default;
@@ -92,7 +93,6 @@ $gantt-bigger-tooltip-dialog-color: #1a1a1a;
 $gantt-bigger-tooltip-dialog-text-color: $hover-border;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 9px 0 18px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 18px 0 9px !default;
-$gantt-bigger-dialog-close-button-left: 2px !important;
 $gantt-bigger-dialog-close-button-size: 12px !important;
 $gantt-bigger-dialog-header-padding: 16px 4px 12px 18px !important;
 $gantt-bigger-add-dialog-content-height: 241px !important;
@@ -126,6 +126,7 @@ $gantt-dialog-bigger-border-radius: 0px !important;
 $gantt-bigger-dialog-tab-padding-left: 6px !important;
 $gantt-bigger-dialog-border-radius: 6px 6px 0px 0px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 9px !default;
+$gantt-dialog-close-button-top: 0px !important;
 $gantt-dialog-dependent-height: 161px !default;
 $gantt-dialog-resource-height: 202px !default;
 $gantt-dialog-rte-height: 241px !default;
@@ -155,6 +156,7 @@ $gantt-parent-progress-bar-border-radius: 0px !default;
 $gantt-timeline-top-headercell-font-size: 14px !default;
 $gantt-timeline-top-headercell-font-weight: 400 !default;
 $gantt-active-background: $selection-bg !default;
+$gantt-active-frozen-background: $selection-bg !default;
 $gantt-active-color: $hover-font !default;
 $gantt-active-color-opacity: 1 !default;
 $gantt-table-background: $hover-font !default;
@@ -212,4 +214,7 @@ $gantt-collapse-progress-width: 0px !important;
 $rangecontainer-border-color: #FC7A05;
 $gantt-range-container-arc-radius: 0px !default;
 $bigger-column-menu-size: 45px !default;
-$gantt-masked-table-background-color: #e1dfdd;
+$gantt-masked-table-background-color: #e1dfdd;
+$gantt-rowdd-topbottom-border: 1px solid #400074 !default;
+$gantt-rowdd-boxshadow: #400074 !default;
+$gantt-rowdd-childborder-width: 1px 0 0 !default;

package/styles/gantt/_layout.scss

@@ -16,6 +16,23 @@
           font-size: 18px;
         }}
       .e-gantt-chart {
+        
+        .e-taskbar-left-resizer,
+        .e-taskbar-right-resizer {
+          display: inline-block;
+          position: absolute;
+          top: 0;
+          width: 25px;
+          z-index: 4;
+        }
+
+        .e-left-resize-gripper,
+        .e-right-resize-gripper {
+          align-items: center;
+          cursor: ew-resize;
+          display: inline-flex;
+        }
+
         .e-timeline-header-container {
           height: $gantt-bigger-header-border-height;
         }
@@ -135,7 +152,13 @@
           padding: $gantt-bigger-dialog-header-padding; /* stylelint-disable-line declaration-no-important */
 
           .e-btn.e-dlg-closeicon-btn {
-            left: $gantt-bigger-dialog-close-button-left;
+            left: -11px;
+            @if ($skin-name == 'bootstrap5-dark' or $skin-name == 'bootstrap5'){
+              top: 2px;
+            }
+            @else {
+              top: 3px;
+            }
           }
         }
         @if ($skin-name == 'FluentUI' or $skin-name == 'fluent-dark') {
@@ -165,8 +188,13 @@
           }
         }
 
-        .e-dlg-header {
-          line-height: 28px;
+        .e-dlg-header:not(.e-gantt-adaptive-dialog .e-dialog .e-dlg-header) {
+          @if ($skin-name== 'Material3-dark' or $skin-name == 'Material3') {
+            line-height: 28px;
+          }
+          @else if ($skin-name != 'FluentUI' or $skin-name != 'fluent-dark'){
+            line-height: 37px;
+          }
         }
       }
 
@@ -197,7 +225,7 @@
     .e-gantt-dialog {
       .e-dialog {
         border-radius: 6px;
-        //width: $gantt-bigger-dialog-width;
+        width: $gantt-bigger-dialog-width;
       }
       .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
         padding: 0 16px !important;    /* stylelint-disable-line declaration-no-important */
@@ -243,7 +271,7 @@
           }
         }
         @else{
-          .e-btn.e-dlg-closeicon-btn {
+          .e-btn.e-dlg-closeicon-btn:not(.e-gantt-adaptive-dialog .e-dialog .e-dlg-closeicon-btn) {
             border-radius: 50%;
             height: auto !important; /* stylelint-disable-line declaration-no-important */
             width: auto;
@@ -343,6 +371,16 @@
           padding: 7px 0 !important; /* stylelint-disable-line declaration-no-important */
         }
       }
+      .e-gantt-adaptive-dialog .e-dialog {
+        position: absolute !important; /* stylelint-disable-line declaration-no-important */
+        left: 0 !important; /* stylelint-disable-line declaration-no-important */
+      }
+      .e-gantt-adaptive-dialog .e-dialog .e-dlg-header-content {
+        padding: 16px !important; /* stylelint-disable-line declaration-no-important */
+      }
+      .e-gantt-adaptive-dialog .e-dialog td{
+        width: 100% !important; /* stylelint-disable-line declaration-no-important */
+      }
     }
 
     .e-predecessor-tooltip {
@@ -638,10 +676,6 @@
         overflow-x: scroll !important; /* stylelint-disable-line declaration-no-important */
       }
 
-      .e-gridcontent .e-gantt-frozen {
-        overflow-x: hidden !important; /* stylelint-disable-line declaration-no-important */
-      }
-
       .e-gridcontent .e-content.e-gantt-scroll-padding {
         width: calc(100% + 17px);
       }
@@ -779,7 +813,7 @@
       }
 
       .e-zero-spacing {
-        border-spacing: 0;
+        border-spacing: .25px;
       }
 
       .e-chart-row:first-child .e-chart-row-border {
@@ -822,10 +856,6 @@
         vertical-align: middle;
         z-index: 3;
       }
-
-      .e-taskbar-main-container:hover{
-        z-index: 4;
-      }
       
       .e-taskbar-main-container.e-gantt-multi-taskbar:hover {
         z-index: 4;
@@ -1407,7 +1437,7 @@
     }
 
     .e-item {
-      height: $gantt-dialog-general-height;
+      height: 100%;
     }
 
     .e-dependent-div {
@@ -1486,6 +1516,10 @@
       }
     }
 
+    .e-dlg-header {
+      line-height: 30px;
+    }
+
     .e-dlg-header-content {
       border-bottom: 0 !important; /* stylelint-disable-line declaration-no-important */
     }
@@ -1494,6 +1528,11 @@
       border-radius: $gantt-dialog-border-radius;
       padding-bottom: $gantt-dialog-padding-bottom;
       
+      .e-btn.e-dlg-closeicon-btn {
+        left: -11px;
+        top: $gantt-dialog-close-button-top;
+      }
+      
       @if ($skin-name == 'bootstrap-dark'){
         .e-btn.e-dlg-closeicon-btn {
           border-radius: 50%;
@@ -1574,12 +1613,14 @@
   .e-bigger .e-gantt .e-gantt-chart .e-label {
     font-size: $gantt-bigger-label-font-size;
   }
-  .e-bigger .e-gantt .e-gantt-chart .e-timeline-single-header-outer-div{
-    height: 64px !important; /* stylelint-disable-line declaration-no-important */
+
+  .e-bigger .e-filter-popup .e-control .e-dialog .e-lib .e-popup .e-popup-open .e-excelfilter .e-gantt,
+  .e-bigger .e-gantt .e-excelfilter .e-dialog .e-dlg-content {
+    padding: 0 18px 0 0 !important; /* stylelint-disable-line declaration-no-important */
   }
-  .e-bigger .e-timeline-single-header-cell {
-    height: 64px !important; /* stylelint-disable-line declaration-no-important */
-    line-height: 64px !important; /* stylelint-disable-line declaration-no-important */
+  .e-bigger .e-filter-popup .e-control .e-dialog .e-lib .e-popup .e-popup-open .e-excelfilter .e-gantt,
+  .e-bigger .e-gantt .e-contextmenu-wrapper ul {
+    padding: 0 !important; /* stylelint-disable-line declaration-no-important */
   }
 
   .e-gantt-tooltip-label {
@@ -1740,4 +1781,35 @@
     position: absolute;
     z-index: 1;
   }
+  .e-gantt .e-gantt-chart .e-chart-root-container .e-content td.e-chart-row-cell.e-droptop{
+    border-top: $gantt-rowdd-topbottom-border;
+    border-width: $gantt-rowdd-childborder-width;
+  }
+  .e-gantt .e-gantt-chart .e-chart-root-container .e-content td.e-chart-row-cell.e-dropbottom{
+    border-bottom: $gantt-rowdd-topbottom-border;
+    box-shadow: $gantt-rowdd-boxshadow;
+  }
+  
+  .e-gantt .e-gantt-chart .e-chart-root-container .e-content td.e-chart-row-cell.e-childborder {
+    border-bottom: $gantt-rowdd-topbottom-border;
+    border-top: $gantt-rowdd-topbottom-border;
+    box-shadow: $gantt-rowdd-boxshadow;
+  }
+}
+@media (max-width: 767px)
+{
+  .e-bigger{
+    .e-gantt {
+      .e-dialog {
+        .e-edit-form-column {
+          &:nth-child(odd),
+          &:nth-child(even) {
+            float: none;
+            padding: $gantt-mobile-bigger-dialog-edit-form-padding;
+            width: 100%;
+          }
+        }
+      }
+    }
+  }
 }

package/styles/gantt/_material-dark-definition.scss

@@ -85,6 +85,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 16px 18px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 16px 16px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 16px 16px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-predecessor-dialog-padding: 10px 9px 9px 14px !important;
 $gantt-bigger-predecessor-dialog-font-size: 12px;
 $gantt-bigger-predecessor-dialog-font-weight: 400 !default;
@@ -96,7 +97,6 @@ $gantt-bigger-tooltip-dialog-text-color: $grey-black;
 $gantt-bigger-tooltip-disabled-button-color: $grey-600 !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 9px 0 16px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 16px 0 9px !default;
-$gantt-bigger-dialog-close-button-left: 1px !important;
 $gantt-bigger-dialog-close-button-size: 12px !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 9px 0 16px !default;
 $gantt-bigger-dialog-header-padding: 16px 4px 17px 16px !important;
@@ -130,6 +130,7 @@ $gantt-bigger-dialog-tab-padding-left: 4px !important;
 $gantt-bigger-dialog-border-radius: 6px 6px 0px 0px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 9px !default;
 $gantt-dialog-dependent-height: 153px !default;
+$gantt-dialog-close-button-top: 2px !important;
 $gantt-dialog-resource-height: 196px !default;
 $gantt-dialog-rte-height: 241px !default;
 $gantt-dialog-rte-content-height: 198px !default;
@@ -158,6 +159,7 @@ $gantt-parent-progress-bar-border-radius: 4px !default;
 $gantt-timeline-top-headercell-font-size: 12px !default;
 $gantt-timeline-top-headercell-font-weight: 500 !default;
 $gantt-active-background: rgba(255, 255, 255, 0.28) !default;
+$gantt-active-frozen-background: #626262 !default;
 $gantt-active-color: $primary-font !default;
 $gantt-active-color-opacity: 0.87 !default;
 $gantt-table-background: $grey-dark !default;
@@ -213,4 +215,7 @@ $rangecontainer-border-color: #FC7A05;
 $gantt-range-container-arc-radius: 2px !default;
 $gantt-active-background-color: #a9a9a9;
 $bigger-column-menu-size: 38px !default;
-$gantt-masked-table-background-color: #e1dfdd;
+$gantt-masked-table-background-color: #e1dfdd;
+$gantt-rowdd-topbottom-border: 1px solid #00b0ff !default;
+$gantt-rowdd-boxshadow: #00b0ff !default;
+$gantt-rowdd-childborder-width: 1px 0 0 !default;

package/styles/gantt/_material-definition.scss

@@ -85,6 +85,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 16px 18px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 16px 16px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 16px 16px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-predecessor-dialog-padding: 10px 9px 9px 14px !important;
 $gantt-bigger-predecessor-dialog-font-size: 12px;
 $gantt-bigger-predecessor-dialog-font-weight: 400 !default;
@@ -96,7 +97,6 @@ $gantt-bigger-tooltip-dialog-text-color: $grey-black;
 $gantt-bigger-tooltip-disabled-button-color: $grey-600 !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 9px 0 16px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 16px 0 9px !default;
-$gantt-bigger-dialog-close-button-left: 1px !important;
 $gantt-bigger-dialog-close-button-size: 12px !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 9px 0 16px !default;
 $gantt-bigger-dialog-header-padding: 16px 14px 17px 16px !important;
@@ -129,6 +129,7 @@ $gantt-dialog-bigger-border-radius: 6px !important;
 $gantt-bigger-dialog-tab-padding-left: 4px !important;
 $gantt-bigger-dialog-border-radius: 6px 6px 0px 0px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 9px !default;
+$gantt-dialog-close-button-top: 2px !important;
 $gantt-dialog-dependent-height: 153px !default;
 $gantt-dialog-resource-height: 196px !default;
 $gantt-dialog-rte-height: 241px !default;
@@ -158,6 +159,7 @@ $gantt-parent-progress-bar-border-radius: 4px !default;
 $gantt-timeline-top-headercell-font-size: 12px !default;
 $gantt-timeline-top-headercell-font-weight: 500 !default;
 $gantt-active-background: rgba($primary, .15) !default;
+$gantt-active-frozen-background: #e2e5f4 !default;
 $gantt-active-color: $grey-black !default;
 $gantt-active-color-opacity: 1 !default;
 $gantt-table-background: $accent-font !default;
@@ -213,4 +215,7 @@ $gantt-collapse-progress-width: 0px !important;
 $rangecontainer-border-color: #FC7A05;
 $gantt-range-container-arc-radius: 2px !default;
 $bigger-column-menu-size: 38px !default;
-$gantt-masked-table-background-color: #e1dfdd;
+$gantt-masked-table-background-color: #e1dfdd;
+$gantt-rowdd-topbottom-border: 1px solid #e3165b !default;
+$gantt-rowdd-boxshadow: #e3165b !default;
+$gantt-rowdd-childborder-width: 1px 0 0 !default;

package/styles/gantt/_material3-definition.scss

@@ -69,6 +69,7 @@ $gantt-tab-selection-indicator-color: rgba($primary) !default;
 $gantt-tab-header-hover-color: $transparent !default;
 $gantt-tab-header-hover-font-color: rgba($content-text-color-alt2) !default;
 $gantt-active-background: $table-bg-color-selected;
+$gantt-active-frozen-background: rgba($primary-container, 1) !default;
 $gantt-active-color: rgba($table-text-color-selected) !default;
 $gantt-table-background: rgba($content-bg-color) !default;
 $gantt-baseline-color: rgba($danger) !default;
@@ -123,6 +124,7 @@ $gantt-dialog-general-height: 241px !default;
 $gantt-dialog-edit-form-odd-padding: 12px 18px 0 18px !default;
 $gantt-dialog-edit-form-even-padding: 12px 18px 0 0 !default;
 $gantt-dialog-edit-form-scroll-padding: 12px 18px 0 0 !default;
+$gantt-mobile-bigger-dialog-edit-form-padding: 16px 12px 0 16px !default;
 $gantt-bigger-tooltip-button-color: rgba($tooltip-bg-color) !default;
 $gantt-bigger-tooltip-dialog-color: rgba($tooltip-bg-color) !default;
 $gantt-bigger-tooltip-button-text-color: $toooltip-text-color !default;
@@ -130,7 +132,6 @@ $gantt-bigger-tooltip-dialog-text-color: rgba($tooltip-text-color) !default;
 $gantt-bigger-tooltip-disabled-button-color: $content-bg-color-alt5 !important;
 $gantt-bigger-dialog-edit-form-odd-padding: 16px 12px 0 16px !default;
 $gantt-bigger-dialog-edit-form-even-padding: 16px 16px 0 12px !default;
-$gantt-bigger-dialog-close-button-left: 2px !important;
 $gantt-bigger-dialog-close-button-size: 20px !important;
 $gantt-bigger-dialog-header-padding: 20px !important;
 $gantt-bigger-add-dialog-content-height: 250px !important;
@@ -166,6 +167,7 @@ $gantt-dialog-bigger-border-radius: 6px !important;
 $gantt-bigger-dialog-tab-padding-left: 5px !important;
 $gantt-bigger-dialog-border-radius: 16px 16px 0px 0px !default;
 $gantt-bigger-dialog-edit-form-scroll-padding: 16px 18px 0 9px !default;
+$gantt-dialog-close-button-top: 6px !important;
 $gantt-dialog-dependent-height: 161px !default;
 $gantt-dialog-resource-height: 202px !default;
 $gantt-dialog-rte-height: 241px !default;
@@ -217,4 +219,7 @@ $gantt-collapse-progress-width: 0px !important;
 $gantt-range-container-arc-radius: 2px !default;
 $bigger-column-menu-size: 35px !default;
 $gantt-masked-table-background-color: rgb(225,223,221);
-$gantt-split-container-line-border-color: rgba($outline);
+$gantt-split-container-line-border-color: rgba($outline);
+$gantt-rowdd-topbottom-border: 2px solid rgba($primary) !default;
+$gantt-rowdd-boxshadow: rgba($primary) !default;
+$gantt-rowdd-childborder-width: 2px 0 0 !default;