@syncfusion/ej2-schedule 26.2.14 → 27.1.48

package/styles/schedule/_bootstrap4-definition.scss

@@ -209,7 +209,7 @@ $schedule-more-indicator-nrml-font-size: 12px !default;
 $schedule-more-popup-close-margin-top: 3px !default;
 $schedule-more-popup-padding: 12px 4px 14px !default;
 $schedule-more-appointment-margin-bottom: 4px !default;
-$schedule-event-popup-header-icon-padding: 6px 8px 0 0 !default;
+$schedule-event-popup-header-icon-padding: 6px 8px 0 8px !default;
 $schedule-event-popup-subject-wrap-padding: 8px 14px !default;
 $schedule-timeline-header-cells-height: 36px !default;
 $schedule-timeline-work-cells-height: 60px !default;

package/styles/schedule/_bootstrap5-definition.scss

@@ -83,7 +83,7 @@ $schedule-popup-btn-border: none !default;
 $schedule-alert-dialog-border: none !default;
 $schedule-more-popup-close-margin-top: 3px !default;
 $schedule-more-popup-padding: 8px 0 !default;
-$schedule-event-popup-header-icon-padding: 6px 8px 0 0 !default;
+$schedule-event-popup-header-icon-padding: 6px 8px 0 8px !default;
 $schedule-event-popup-subject-wrap-padding: 12px 18px !default;
 $schedule-popup-overlay-bg-color: $overlay-bg-color !default;
 $schedule-time-cells-font-color: $schedule-secondary-content-font-color !default;

package/styles/schedule/_bootstrap5.3-definition.scss

@@ -78,12 +78,12 @@ $schedule-popup-icon-hover-bg-color: $content-bg-color-alt2 !default;
 $schedule-popup-content-icon-color: $schedule-secondary-content-font-color !default;
 $schedule-event-popup-content-padding: 0 18px 12px !default;
 $schedule-event-popup-fields-padding: 12px !default;
-$schedule-popup-title-color: rgba($color: $schedule-appointment-bg-color, $alpha: .3) !default;
+$schedule-popup-title-color: $primary-lighter !default;
 $schedule-popup-btn-border: none !default;
 $schedule-alert-dialog-border: none !default;
 $schedule-more-popup-close-margin-top: 3px !default;
 $schedule-more-popup-padding: 8px 0 !default;
-$schedule-event-popup-header-icon-padding: 6px 8px 0 0 !default;
+$schedule-event-popup-header-icon-padding: 6px 8px 0 8px !default;
 $schedule-event-popup-subject-wrap-padding: 12px 18px !default;
 $schedule-popup-overlay-bg-color: $overlay-bg-color !default;
 $schedule-time-cells-font-color: $schedule-secondary-content-font-color !default;
@@ -92,7 +92,7 @@ $schedule-popup-icon-padding: 2px 10px 0 0 !default;
 $schedule-popup-footer-text-transform: capitalize !default;
 $schedule-cell-popup-header-icon-padding: 2px 8px 0 0 !default;
 $schedule-cell-popup-span-margin: 14px 0 4px !default;
-$schedule-cell-popup-subject-height: 30px !default;
+$schedule-cell-popup-subject-height: 32px !default;
 $schedule-bgr-cell-popup-content-padding: 48px 24px 16px !default;
 $schedule-bgr-cell-popup-footer-padding: $schedule-popup-footer-padding !default;
 $schedule-event-popup-subject-color: $schedule-primary-content-font-color !default;
@@ -145,7 +145,7 @@ $schedule-tbar-btn-bgr-padding: 0 1.5px !default;
 $schedule-tbar-btn-icn-bgr-padding: 4px 6px !default;
 $schedule-tbar-btn-icn-right-bgr-padding: 2px 0 0 12px !default;
 $schedule-tbar-right-items-btn-border: none !default;
-$schedule-tbar-right-items-btn-border-radius: 0 !default;
+$schedule-tbar-right-items-btn-border-radius: 6px !default;
 $schedule-tbar-right-active-items-btn-border: none !default;
 $schedule-device-tbar-right-items-btn-border-radius: 0 !default;
 $schedule-device-tbar-right-items-btn-border: none !default;
@@ -217,6 +217,8 @@ $schedule-alternate-cell-border: dotted !default;
 $schedule-header-hover-border-radius: 4px !default;
 $schedule-more-popup-wrapper-border-radius: 6px !default;
 $schedule-box-shadow: 0 1px 0 rgba($black, .15) !default;
+$schedule-select-focus-bg-color: $content-bg-color-focus !default;
+$schedule-select-focus-box-shadow: $keyboard-focus-shadow !default;
 $schedule-btn-txt-bgr-padding: 5px 12px !default;
 $schedule-header-bg-color: $content-bg-color !default;
 $schedule-header-border-color: $border-light !default;
@@ -224,11 +226,12 @@ $schedule-header-hover-color: $content-bg-color-alt3 !default;
 $schedule-content-bg-color: $content-bg-color !default;
 $schedule-content-border-color: $border-light !default;
 $schedule-month-agenda-border: 2px solid $schedule-content-border-color !default;
-$schedule-select-bg-color: $content-bg-color-alt2 !default;
+$schedule-select-bg-color: $content-bg-color-pressed !default;
 $schedule-work-cells-bg-color: $content-bg-color-alt1 !default;
 $schedule-current-date-bg-color: $primary !default;
 $schedule-disable-dates-color: $content-bg-color-alt2 !default;
 $schedule-workhour-bg-color: $content-bg-color !default;
+$schedule-hover-bg-color: $content-bg-color-hover !default;
 $schedule-resource-focus-bg-color: $schedule-hover-bg-color !default;
 $schedule-active-color: $content-bg-color !default;
 $schedule-current-day-active-color: $schedule-active-color !default;
@@ -247,7 +250,7 @@ $schedule-popup-header-icon-focus-bg-color: $schedule-active-color !default;
 $schedule-popup-header-icon-focus-color: $schedule-popup-header-icon-hover-color !default;
 $schedule-tip-content-padding: 3px 6px !default;
 $schedule-time-cells-bg-color: $schedule-vertical-time-slot-color !default;
-$schedule-time-cells-border-bottom-color: none !default;
+$schedule-time-cells-border-bottom-color: $border-light !default;
 $schedule-current-day-font-weight: $font-weight-normal !default;
 $schedule-selected-cell-hover-font-color: $schedule-active-color !default;
 $schedule-work-cell-hover-color: $schedule-select-font-color !default;

package/styles/schedule/_fluent-definition.scss

@@ -210,7 +210,7 @@ $schedule-popup-header-icon-font-size: $text-xs !default;
 $schedule-more-popup-close-margin-top: 6px !default;
 $schedule-more-popup-padding: 8px 0 !default;
 $schedule-more-appointment-margin-bottom: 2px !default;
-$schedule-event-popup-header-icon-padding: 6px 8px 0 0 !default;
+$schedule-event-popup-header-icon-padding: 6px 8px 0 8px !default;
 $schedule-event-popup-subject-wrap-padding: 14px 24px !default;
 $schedule-big-event-popup-subject-padding: 16px 28px !default;
 $schedule-timeline-header-cells-height: 36px !default;

package/styles/schedule/_fluent2-definition.scss

@@ -9,7 +9,7 @@ $schedule-primary-content-font-color: $content-text-color !default;
 $schedule-secondary-content-font-color: $content-text-color !default;
 $schedule-select-font-color: $content-text-color-selected !default;
 $schedule-select-bg-color: $content-bg-color-selected !default;
-$schedule-work-cells-bg-color: $content-bg-color !default;
+$schedule-work-cells-bg-color: $holiday-bg-color !default;
 $schedule-current-date-bg-color: $primary !default;
 $schedule-disable-dates-color: $content-bg-color-alt2 !default;
 $schedule-disable-font-color: $content-text-color !default;
@@ -121,8 +121,8 @@ $schedule-tbar-default-bg: $content-bg-color-alt1 !default;
 $schedule-tbar-separator-border: $border-light !default;
 $schedule-tbar-border-nav: $border-light !default;
 $schedule-tbar-border-nav-type: solid !default;
-$schedule-tbar-hover-bg: $content-bg-color-alt3 !default;
-$schedule-tbar-hover-font: rgba($color: $primary, $alpha: .87) !default;
+$schedule-tbar-hover-bg: $content-bg-color-hover !default;
+$schedule-tbar-hover-font: $icon-color-hover !default;
 $schedule-tbar-nav-bgr-width: 32px !default;
 $schedule-tbar-bgr-item-size: 34px !default;
 $schedule-tbar-bgr-size: $schedule-tbar-bgr-min-height !default;
@@ -207,10 +207,10 @@ $schedule-more-indicator-shadow-color: $shadow !default;
 $schedule-more-indicator-shadow-color-res-tree-popup: $schedule-more-indicator-shadow-color !default;
 $schedule-more-indicator-shadow-color-more-popup: none !default;
 $schedule-more-indicator-nrml-font-size: $text-xs !default;
-$schedule-more-popup-close-margin-top: 8px !default;
+$schedule-more-popup-close-margin-top: 5px !default;
 $schedule-more-popup-padding: 8px 0 !default;
 $schedule-more-appointment-margin-bottom: 2px !default;
-$schedule-event-popup-header-icon-padding: 6px 8px 0 0 !default;
+$schedule-event-popup-header-icon-padding: 6px 8px 0 8px !default;
 $schedule-event-popup-subject-wrap-padding: 12px 18px !default;
 $schedule-timeline-header-time-slots-bg: $schedule-tbar-default-bg !default;
 $schedule-timeline-header-cells-height: 36px !default;
@@ -240,7 +240,7 @@ $schedule-tree-content-color: $content-text-color-alt2;
 $schedule-popup-overlay-bg-color: $overlay-bg-color !default;
 $schedule-val-error-color: $danger-bg-color !default;
 $schedule-val-error-bg-color: $danger-light !default;
-$schedule-block-appointment-bg-color: $content-bg-color-alt2 !default;
+$schedule-block-appointment-bg-color: $holiday-bg-color !default;
 $schedule-block-appointment-font-color: $content-text-color !default;
 $schedule-resource-color-margin-top: 10px !default;
 $schedule-bigger-resource-color-margin-top: 10px !default;

package/styles/schedule/_fusionnew-definition.scss

@@ -83,7 +83,7 @@ $schedule-popup-btn-border: none !default;
 $schedule-alert-dialog-border: none !default;
 $schedule-more-popup-close-margin-top: 3px !default;
 $schedule-more-popup-padding: 8px 0 !default;
-$schedule-event-popup-header-icon-padding: 6px 8px 0 0 !default;
+$schedule-event-popup-header-icon-padding: 6px 8px 0 8px !default;
 $schedule-event-popup-subject-wrap-padding: 12px 18px !default;
 $schedule-popup-overlay-bg-color: $overlay-bg-color !default;
 $schedule-popup-icon-font-size: 18px !default;

package/styles/schedule/_layout.scss

@@ -2668,161 +2668,6 @@
     display: none;
   }
 
-  .e-bigger .e-schedule,
-  .e-bigger.e-schedule {
-    .e-schedule-toolbar {
-      height: $schedule-tbar-bgr-size;
-      min-height: $schedule-tbar-bgr-size;
-
-      .e-tbar-btn .e-tbar-btn-text {
-        font-size: $schedule-content-bgr-font-size;
-      }
-
-      .e-toolbar-item.e-date-range .e-tbar-btn-text {
-        font-size: $schedule-header-bgr-font-size;
-      }
-
-      .e-icon-down-arrow {
-        font-size: $schedule-tbar-down-arrow-font-size;
-      }
-
-      .e-schedule .e-toolbar .e-hor-nav {
-        min-height: $schedule-tbar-bgr-items-size;
-        min-width: $schedule-tbar-nav-bgr-width;
-        z-index: 0;
-      }
-
-      .e-toolbar-item {
-
-        .e-btn.e-tbar-btn .e-icons.e-btn-icon {
-          font-size: $schedule-bigger-tbar-btn-font-size;
-        }
-
-        .e-tbar-btn-text {
-          line-height: inherit;
-        }
-      }
-
-      .e-toolbar-items {
-        min-height: $schedule-tbar-bgr-items-size;
-
-        .e-toolbar-item {
-          min-height: $schedule-tbar-bgr-items-size;
-
-          &:not(.e-separator):not(.e-spacer) {
-            min-width: $schedule-tbar-bgr-item-size;
-          }
-
-          &.e-separator {
-            height: $schedule-tbar-separator-bgr-height;
-            margin: $schedule-tbar-separator-bgr-mrgn;
-            min-height: $schedule-tbar-separator-bgr-minheight;
-          }
-
-          .e-icons {
-            min-width: $schedule-tbar-btn-icon-bgr-width;
-          }
-
-          button.e-btn,
-          .e-tbar-btn.e-btn.e-control {
-            height: auto;
-            line-height: $schedule-tbar-btn-bgr-line-height;
-            margin: $schedule-tbar-btn-bgr-mrgn;
-            min-width: $schedule-tbar-btn-bgr-minwidth;
-            padding: $schedule-tbar-btn-bgr-padding;
-
-            &.e-tbtn-txt {
-              .e-icons.e-icon-right {
-                padding: $schedule-tbar-btn-icn-right-bgr-padding;
-                font-size: $schedule-bigger-tbar-btn-font-size;
-              }
-            }
-
-            .e-btn-icon {
-              padding-top: $schedule-tbar-btn-icn-right-bgr-padding-top;
-            }
-          }
-
-          .e-tbar-btn .e-tbar-btn-text {
-            font-size: $schedule-bgr-tbar-btn-text-font-size;
-          }
-        }
-      }
-    }
-
-    .e-more-popup-wrapper {
-      .e-header-day {
-        font-size: $schedule-header-day-bgr-font-size;
-      }
-    }
-
-    .e-vertical-view {
-      .e-header-cells {
-        .e-header-day {
-          font-size: $schedule-header-day-bgr-font-size;
-        }
-
-        .e-header-date {
-          font-size: $schedule-header-date-bgr-font-size;
-        }
-      }
-
-      .e-resource-cells {
-        font-size: $schedule-header-day-bgr-font-size;
-      }
-
-      .e-time-cells-wrap table td {
-        font-size: $schedule-time-scale-bgr-font-size;
-      }
-
-      .e-clone-time-indicator,
-      .e-current-time {
-        font-size: $schedule-current-time-bgr-font-size;
-      }
-    }
-
-    &.e-device {
-      .e-vertical-view {
-        .e-time-cells-wrap table td {
-          font-size: $schedule-time-scale-device-font-size;
-        }
-
-        .e-clone-time-indicator,
-        .e-current-time {
-          font-size: $schedule-current-time-bgr-device-font-size;
-        }
-      }
-    }
-
-    .e-month-view {
-      .e-header-cells {
-        height: $schedule-month-header-cells-bgr-height;
-      }
-
-      .e-resource-cells,
-      .e-date-header-wrap table td {
-        font-size: $schedule-date-month-header-wrap-bgr-font-size;
-      }
-
-      .e-content-wrap {
-        font-size: $schedule-date-month-header-wrap-bgr-font-size;
-      }
-
-      .e-m-date {
-        font-size: $schedule-header-date-bgr-font-size;
-      }
-
-      .e-resource-name,
-      .e-m-day {
-        font-size: $schedule-header-day-bgr-font-size;
-      }
-    }
-
-    .e-year-view .e-calendar-wrapper .e-month-calendar.e-calendar {
-      min-width: 306px;
-    }
-  }
-
   .e-schedule.e-multi-drag {
     .e-vertical-view {
       .e-all-day-appointment-wrapper .e-appointment {
@@ -2894,18 +2739,6 @@
     font-size: 12px;
   }
 
-  .e-bigger .e-schedule-event-tooltip,
-  .e-schedule-event-tooltip.e-bigger {
-    .e-subject {
-      font-size: 14px;
-      font-weight: 500;
-    }
-  }
-
-  .e-bigger .e-dialog.e-quick-dialog.e-following-events-dialog {
-    width: 502px;
-  }
-
   .e-dialog.e-quick-dialog.e-following-events-dialog {
     width: 420px;
 
@@ -2950,10 +2783,6 @@
     }
   }
 
-  .e-bigger .e-dialog.e-quick-dialog {
-    min-width: 370px;
-  }
-
   /*! schedule event window */
 
   .e-schedule-dialog {
@@ -3143,155 +2972,6 @@
     }
   }
 
-  .e-bigger {
-    .e-ddl.e-popup .e-resource-template {
-      padding: 0 15px;
-
-      .e-resource-color {
-        height: $schedule-bigger-resource-color-size;
-        margin-top: $schedule-bigger-resource-color-margin-top;
-        width: $schedule-bigger-resource-color-size;
-      }
-    }
-
-    .e-schedule-dialog {
-      .e-disable {
-        display: none;
-      }
-
-      .e-dlg-header-content {
-        padding-bottom: 8px;
-      }
-
-      .e-dlg-content {
-        padding-bottom: 12px;
-        position: relative;
-      }
-
-      .e-event-cancel,
-      .e-event-delete {
-        border: $schedule-popup-btn-border;
-        box-shadow: none;
-      }
-
-      .e-footer-content .e-btn.e-event-delete {
-        float: left;
-        margin-left: 0;
-      }
-
-      .e-subject-container,
-      .e-start-container,
-      .e-start-time-zone-container,
-      .e-description-label {
-        padding-right: 12px;
-      }
-
-      .e-location-container,
-      .e-end-container,
-      .e-end-time-zone-container {
-        padding-left: 12px;
-      }
-
-      .e-all-day-container {
-        padding-right: 16px;
-      }
-
-      .e-time-zone-row {
-        display: none;
-
-        &.e-enable {
-          display: flex;
-          height: $schedule-timezone-enable-bgr-height;
-        }
-      }
-
-      .e-title-location-row,
-      .e-start-end-row,
-      .e-start-input-container,
-      .e-end-input-container,
-      .e-time-zone-row {
-        display: flex;
-        padding-bottom: $schedule-bigger-dialog-row-container-padding-bottom;
-        width: 100%;
-      }
-
-      .e-resources {
-        padding-bottom: 12px;
-        width: 100%;
-      }
-
-      .e-all-day-time-zone-row {
-        display: flex;
-        padding-bottom: 20px;
-        padding-top: 0;
-        width: 100%;
-      }
-
-      .e-subject-container,
-      .e-location-container,
-      .e-start-container,
-      .e-end-container,
-      .e-start-time-zone-container,
-      .e-end-time-zone-container {
-        width: 50%;
-      }
-
-      .e-location-container,
-      .e-end-container,
-      .e-end-time-zone-container,
-      .e-start-container,
-      .e-start-time-zone-container,
-      .e-subject-container,
-      .e-description-row,
-      .e-repeat-container {
-        padding-top: 0;
-      }
-
-      .e-all-day-time-zone-row {
-        padding-bottom: 16px;
-        padding-top: $schedule-bigger-dialog-all-day-row-padding-top;
-      }
-
-      .e-description,
-      .e-float-input .e-description {
-        height: 50px;
-        resize: vertical;
-      }
-
-      .e-time-zone-row,
-      .e-repeat-container,
-      .e-input-group .e-input-group-icon.e-icon-disable {
-        display: none;
-      }
-
-      &.e-rtl {
-        .e-all-day-container {
-          margin-left: 20px;
-          margin-right: 0;
-        }
-
-        .e-subject-container,
-        .e-start-container,
-        .e-start-time-zone-container,
-        .e-description-label {
-          padding-left: 12px;
-          padding-right: 0;
-        }
-
-        .e-location-container,
-        .e-end-container,
-        .e-end-time-zone-container {
-          padding-left: 0;
-          padding-right: 12px;
-        }
-
-        .e-event-delete {
-          float: right;
-        }
-      }
-    }
-  }
-
   .e-schedule-dialog.e-device {
     .e-dlg-header,
     .e-dlg-header * {
@@ -3831,123 +3511,6 @@
       }
     }
   }
-  
-  .e-bigger .e-quick-popup-wrapper {
-    .e-cell-popup .e-popup-content .e-popup-table .e-subject {
-      font-size: 24px;
-    }
-
-    .e-cell-popup .e-popup-content {
-      padding: $schedule-bgr-cell-popup-content-padding;
-    }
-
-    .e-popup-footer {
-      padding: $schedule-bgr-cell-popup-footer-padding;
-    }
-
-    .e-cell-popup .e-date-time-icon,
-    .e-event-popup .e-date-time-icon {
-      padding-right: $schedule-bgr-date-time-icon-padding-right;
-    }
-
-    .e-cell-popup .e-popup-header .e-header-icon-wrapper .e-close .e-close-icon {
-      font-size: 16px;
-    }
-
-    &.e-rtl {
-      .e-cell-popup .e-date-time-icon {
-        padding-right: 0;
-      }
-
-      .e-event-popup .e-date-time-icon {
-        padding-right: $schedule-bgr-rtl-event-popup-date-time-icon-padding-right;
-      }
-    }
-
-    .e-cell-popup .e-close.e-btn.e-small.e-round {
-      height: $schedule-bgr-event-popup-header-icon-size;
-      width: $schedule-bgr-event-popup-header-icon-size;
-    }
-
-    .e-event-popup {
-      .e-edit.e-btn.e-small.e-round,
-      .e-delete.e-btn.e-small.e-round,
-      .e-close.e-btn.e-small.e-round {
-        height: $schedule-bgr-event-popup-header-icon-size;
-        width: $schedule-bgr-event-popup-header-icon-size;
-      }
-    }
-
-    .e-event-popup .e-popup-header .e-header-icon-wrapper {
-      .e-close-icon,
-      .e-edit-icon,
-      .e-delete-icon {
-        font-size: $schedule-bigger-tbar-btn-font-size;
-      }
-    }
-
-    &.e-device {
-      .e-event-popup .e-popup-header .e-header-icon-wrapper {
-        .e-close-icon,
-        .e-edit-icon,
-        .e-delete-icon {
-          font-size: 14px;
-        }
-      }
-
-      .e-multiple-event-popup .e-popup-header {
-        .e-edit.e-btn.e-small.e-round,
-        .e-delete.e-btn.e-small.e-round,
-        .e-close.e-btn.e-small.e-round {
-          height: $schedule-bgr-multiple-event-popup-icon-height;
-        }
-
-        .e-subject {
-          padding: $schedule-bgr-multiple-event-popup-subject-padding;
-        }
-      }
-    }
-  }
-
-  .e-bigger .e-agenda-view {
-    .e-appointment {
-      padding: $schedule-agenda-big-appointment-padding;
-    }
-    .e-subject {
-      font-size: 16px;
-    }
-
-    .e-date-time {
-      font-size: 14px;
-    }
-
-    .e-day-date-header {
-      .e-m-date {
-        font-size: 20px;
-      }
-
-      .e-m-day {
-        font-size: 14px;
-      }
-    }
-  }
-
-  .e-bigger .e-timeline-view {
-    .e-resource-text {
-      font-size: 14px;
-      padding-left: 12px;
-    }
-
-    .e-navigate {
-      font-size: $schedule-date-header-wrap-bgr-font-size;
-      padding: 8px 0 8px 8px;
-    }
-
-    .e-date-header-wrap table tbody td > span {
-      font-size: $schedule-date-header-wrap-bgr-font-size;
-      padding: 8px 0 8px 8px;
-    }
-  }
 
   .e-appointment.e-schedule-event-clone {
     background: $schedule-appointment-bg-color;
@@ -4025,10 +3588,6 @@
       }
     }
   }
-
-  .e-bigger .e-schedule .e-month-view .e-current-date .e-date-header {
-    width: 26px;
-  }
 }
 
 @media print {
@@ -4043,7 +3602,6 @@
   }
 }
 
-.e-bigger .e-more-popup-wrapper,
 .e-more-popup-wrapper {
   background: $schedule-popup-bg-color;
   border: 1px solid $schedule-popup-border-color;
@@ -4138,6 +3696,11 @@
       background: $schedule-popup-header-icon-focus-bg-color;
       border-radius: 50%;
       color: $schedule-popup-header-icon-focus-color;
+      @if $skin-name == 'fluent2'{
+        .e-close-icon {
+          color: $schedule-hover-font-color;
+        }
+      }
     }
   }
 

package/styles/schedule/_tailwind-definition.scss

@@ -208,7 +208,7 @@ $schedule-more-indicator-nrml-font-size: $text-xxs !default;
 $schedule-more-popup-close-margin-top: 8px !default;
 $schedule-more-popup-padding: 8px 0 !default;
 $schedule-more-appointment-margin-bottom: 2px !default;
-$schedule-event-popup-header-icon-padding: 6px 8px 0 0 !default;
+$schedule-event-popup-header-icon-padding: 6px 8px 0 8px !default;
 $schedule-event-popup-subject-wrap-padding: 12px 18px !default;
 $schedule-timeline-header-time-slots-bg: $schedule-tbar-default-bg !default;
 $schedule-timeline-header-cells-height: 36px !default;