@syncfusion/ej2-schedule 23.2.4 → 24.1.41

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

@@ -88,7 +88,7 @@ $schedule-current-time-bgr-font-size: 12px !default;
 $schedule-current-time-bgr-device-font-size: 9px !default;
 $schedule-popup-header-icon-font-size: 11px !default;
 $schedule-time-scale-width: 85px !default;
-$schedule-device-time-scale-width: 35px !default;
+$schedule-device-time-scale-width: 60px !default;
 
 $schedule-vertical-work-cells-border: 0 0 1px 1px !default;
 $schedule-rtl-vertical-work-cells-border: 0 1px 1px 0 !default;
@@ -197,7 +197,11 @@ $schedule-bgr-event-popup-header-icon-size: 2.8572em !default;
 $schedule-bgr-rtl-event-popup-date-time-icon-padding-right: 13px !default;
 $schedule-multiple-event-popup-icon-bg-color: transparent !default;
 $schedule-multiple-event-popup-icon-color: $schedule-primary-content-font-color !default;
-$schedule-multiple-event-popup-subject-padding: 5px 5px 0 8px !default;
+$schedule-multiple-event-popup-subject-padding: 2px 5px !default;
+$schedule-multiple-event-popup-icon-height: 35px !default;
+$schedule-multiple-event-popup-icon-font-size: 14px !default;
+$schedule-bgr-multiple-event-popup-subject-padding: 3px 5px !default;
+$schedule-bgr-multiple-event-popup-icon-height: 35px !default;
 
 $schedule-event-box-shadow-1: 0 6px 10px 0 rgba($grey-black, .14) !default;
 $schedule-event-box-shadow-2: 0 1px 18px 0 rgba($grey-black, .12) !default;

package/styles/schedule/_material-definition.scss

@@ -89,7 +89,7 @@ $schedule-current-time-bgr-font-size: 12px !default;
 $schedule-current-time-bgr-device-font-size: 9px !default;
 $schedule-popup-header-icon-font-size: 11px !default;
 $schedule-time-scale-width: 85px !default;
-$schedule-device-time-scale-width: 35px !default;
+$schedule-device-time-scale-width: 60px !default;
 
 $schedule-vertical-work-cells-border: 0 0 1px 1px !default;
 $schedule-rtl-vertical-work-cells-border: 0 1px 1px 0 !default;
@@ -194,7 +194,11 @@ $schedule-bgr-event-popup-header-icon-size: 2.8572em !default;
 $schedule-bgr-rtl-event-popup-date-time-icon-padding-right: 13px !default;
 $schedule-multiple-event-popup-icon-bg-color: transparent !default;
 $schedule-multiple-event-popup-icon-color: $schedule-primary-content-font-color !default;
-$schedule-multiple-event-popup-subject-padding: 5px 5px 0 8px !default;
+$schedule-multiple-event-popup-subject-padding: 2px 5px !default;
+$schedule-multiple-event-popup-icon-height: 35px !default;
+$schedule-multiple-event-popup-icon-font-size: 14px !default;
+$schedule-bgr-multiple-event-popup-subject-padding: 3px 5px !default;
+$schedule-bgr-multiple-event-popup-icon-height: 35px !default;
 
 $schedule-event-box-shadow-1: 0 6px 10px 0 rgba($grey-black, .14) !default;
 $schedule-event-box-shadow-2: 0 1px 18px 0 rgba($grey-black, .12) !default;

package/styles/schedule/_material3-definition.scss

@@ -121,7 +121,11 @@ $schedule-bgr-event-popup-header-icon-size: 30px !default;
 $schedule-bgr-rtl-event-popup-date-time-icon-padding-right: 13px !default;
 $schedule-multiple-event-popup-icon-bg-color: transparent !default;
 $schedule-multiple-event-popup-icon-color: rgba($icon-color) !default;
-$schedule-multiple-event-popup-subject-padding: 5px 5px 0 8px !default;
+$schedule-multiple-event-popup-subject-padding: 2px 5px !default;
+$schedule-multiple-event-popup-icon-height: 35px !default;
+$schedule-multiple-event-popup-icon-font-size: $text-base !default;
+$schedule-bgr-multiple-event-popup-subject-padding: 2px 5px !default;
+$schedule-bgr-multiple-event-popup-icon-height: 35px !default;
 
 // schedule toolbar definitions
 $border-size: 1px;
@@ -229,7 +233,7 @@ $schedule-timezone-enable-nrml-height: 60px !default;
 $schedule-timezone-enable-bgr-height: 66px !default;
 $schedule-header-cells-padding: 3px 3px 2px !default;
 $schedule-time-scale-width: 85px !default;
-$schedule-device-time-scale-width: 44px !default;
+$schedule-device-time-scale-width: 60px !default;
 $border-type: solid !default;
 $schedule-alternate-cell-border: dashed !default;
 $schedule-header-hover-border-radius: 4px !default;

package/styles/schedule/_tailwind-definition.scss

@@ -93,7 +93,7 @@ $schedule-current-time-bgr-font-size: $text-xs !default;
 $schedule-current-time-bgr-device-font-size: $text-xs !default;
 $schedule-popup-header-icon-font-size: $text-lg !default;
 $schedule-time-scale-width: 85px !default;
-$schedule-device-time-scale-width: 35px !default;
+$schedule-device-time-scale-width: 60px !default;
 $schedule-header-date-line-height: 24px !default;
 $schedule-header-padding-top: 0 !default;
 
@@ -200,7 +200,11 @@ $schedule-bgr-event-popup-header-icon-size: 2em !default;
 $schedule-bgr-rtl-event-popup-date-time-icon-padding-right: 16px !default;
 $schedule-multiple-event-popup-icon-bg-color: $schedule-header-bg-color !default;
 $schedule-multiple-event-popup-icon-color: $schedule-popup-header-icon-color !default;
-$schedule-multiple-event-popup-subject-padding: 0 5px 0 8px !default;
+$schedule-multiple-event-popup-subject-padding: 2px 5px !default;
+$schedule-multiple-event-popup-icon-height: 35px !default;
+$schedule-multiple-event-popup-icon-font-size: 18px !default;
+$schedule-bgr-multiple-event-popup-subject-padding: 2px 5px !default;
+$schedule-bgr-multiple-event-popup-icon-height: 35px !default;
 
 $schedule-event-box-shadow-1: $shadow-lg !default;
 $schedule-event-box-shadow-2: $shadow-lg !default;

package/styles/schedule/bootstrap-dark.css

@@ -1154,7 +1154,7 @@
   text-decoration: none;
 }
 .e-schedule.e-device .e-vertical-view .e-left-indent {
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-clone-time-indicator,
 .e-schedule.e-device .e-vertical-view .e-current-time {
@@ -1162,7 +1162,7 @@
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap {
   float: left;
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap table td {
   font-size: 11px;
@@ -1200,7 +1200,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-schedule .e-vertical-view .e-left-indent {
-    width: 35px;
+    width: 60px;
   }
 }
 .e-schedule .e-month-view .e-left-indent,
@@ -3350,8 +3350,8 @@
   background: transparent;
   border: 0;
   color: #f0f0f0;
-  height: 40px;
-  width: 40px;
+  height: 35px;
+  width: 35px;
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:focus, .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:hover,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit:focus,
@@ -3363,10 +3363,10 @@
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
   font-size: 15px;
   font-weight: 500;
-  height: 40px;
+  height: 35px;
   line-height: 2.25;
-  padding: 4px 5px;
-  width: calc(100% - 95px);
+  padding: 2px 5px;
+  width: calc(100% - 105px);
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close-icon,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit-icon,
@@ -3400,9 +3400,13 @@
 .e-bigger .e-quick-popup-wrapper.e-rtl .e-event-popup .e-date-time-icon {
   padding-right: 13px;
 }
-.e-bigger .e-quick-popup-wrapper .e-edit.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-delete.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-close.e-btn.e-small.e-round {
+.e-bigger .e-quick-popup-wrapper .e-cell-popup .e-close.e-btn.e-small.e-round {
+  height: 2em;
+  width: 2em;
+}
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-close.e-btn.e-small.e-round {
   height: 2em;
   width: 2em;
 }
@@ -3416,8 +3420,13 @@
 .e-bigger .e-quick-popup-wrapper.e-device .e-event-popup .e-popup-header .e-header-icon-wrapper .e-delete-icon {
   font-size: 14px;
 }
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close.e-btn.e-small.e-round {
+  height: 35px;
+}
 .e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
-  padding: 0 5px 0 8px;
+  padding: 2px 5px;
 }
 
 .e-bigger .e-agenda-view .e-appointment {

package/styles/schedule/bootstrap.css

@@ -1149,7 +1149,7 @@
   text-decoration: none;
 }
 .e-schedule.e-device .e-vertical-view .e-left-indent {
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-clone-time-indicator,
 .e-schedule.e-device .e-vertical-view .e-current-time {
@@ -1157,7 +1157,7 @@
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap {
   float: left;
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap table td {
   font-size: 11px;
@@ -1195,7 +1195,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-schedule .e-vertical-view .e-left-indent {
-    width: 35px;
+    width: 60px;
   }
 }
 .e-schedule .e-month-view .e-left-indent,
@@ -3345,8 +3345,8 @@
   background: transparent;
   border: 0;
   color: #333;
-  height: 40px;
-  width: 40px;
+  height: 35px;
+  width: 35px;
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:focus, .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:hover,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit:focus,
@@ -3358,10 +3358,10 @@
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
   font-size: 15px;
   font-weight: 500;
-  height: 40px;
+  height: 35px;
   line-height: 2.25;
-  padding: 4px 5px;
-  width: calc(100% - 95px);
+  padding: 2px 5px;
+  width: calc(100% - 105px);
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close-icon,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit-icon,
@@ -3395,9 +3395,13 @@
 .e-bigger .e-quick-popup-wrapper.e-rtl .e-event-popup .e-date-time-icon {
   padding-right: 13px;
 }
-.e-bigger .e-quick-popup-wrapper .e-edit.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-delete.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-close.e-btn.e-small.e-round {
+.e-bigger .e-quick-popup-wrapper .e-cell-popup .e-close.e-btn.e-small.e-round {
+  height: 2em;
+  width: 2em;
+}
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-close.e-btn.e-small.e-round {
   height: 2em;
   width: 2em;
 }
@@ -3411,8 +3415,13 @@
 .e-bigger .e-quick-popup-wrapper.e-device .e-event-popup .e-popup-header .e-header-icon-wrapper .e-delete-icon {
   font-size: 14px;
 }
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close.e-btn.e-small.e-round {
+  height: 35px;
+}
 .e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
-  padding: 0 5px 0 8px;
+  padding: 2px 5px;
 }
 
 .e-bigger .e-agenda-view .e-appointment {

package/styles/schedule/bootstrap4.css

@@ -1258,7 +1258,7 @@
   text-decoration: none;
 }
 .e-schedule.e-device .e-vertical-view .e-left-indent {
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-clone-time-indicator,
 .e-schedule.e-device .e-vertical-view .e-current-time {
@@ -1266,7 +1266,7 @@
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap {
   float: left;
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap table td {
   font-size: 11px;
@@ -1304,7 +1304,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-schedule .e-vertical-view .e-left-indent {
-    width: 35px;
+    width: 60px;
   }
 }
 .e-schedule .e-month-view .e-left-indent,
@@ -3454,8 +3454,8 @@
   background: #fff;
   border: 0;
   color: rgba(33, 37, 41, 0.5);
-  height: 40px;
-  width: 40px;
+  height: 35px;
+  width: 35px;
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:focus, .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:hover,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit:focus,
@@ -3467,10 +3467,10 @@
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
   font-size: 15px;
   font-weight: 500;
-  height: 40px;
+  height: 35px;
   line-height: 2.25;
-  padding: 4px 5px;
-  width: calc(100% - 95px);
+  padding: 2px 5px;
+  width: calc(100% - 105px);
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close-icon,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit-icon,
@@ -3504,9 +3504,13 @@
 .e-bigger .e-quick-popup-wrapper.e-rtl .e-event-popup .e-date-time-icon {
   padding-right: 13px;
 }
-.e-bigger .e-quick-popup-wrapper .e-edit.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-delete.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-close.e-btn.e-small.e-round {
+.e-bigger .e-quick-popup-wrapper .e-cell-popup .e-close.e-btn.e-small.e-round {
+  height: 2em;
+  width: 2em;
+}
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-close.e-btn.e-small.e-round {
   height: 2em;
   width: 2em;
 }
@@ -3520,8 +3524,13 @@
 .e-bigger .e-quick-popup-wrapper.e-device .e-event-popup .e-popup-header .e-header-icon-wrapper .e-delete-icon {
   font-size: 14px;
 }
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close.e-btn.e-small.e-round {
+  height: 35px;
+}
 .e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
-  padding: 0 5px 0 8px;
+  padding: 2px 5px;
 }
 
 .e-bigger .e-agenda-view .e-appointment {

package/styles/schedule/bootstrap5-dark.css

@@ -1203,7 +1203,7 @@
   text-decoration: none;
 }
 .e-schedule.e-device .e-vertical-view .e-left-indent {
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-clone-time-indicator,
 .e-schedule.e-device .e-vertical-view .e-current-time {
@@ -1211,7 +1211,7 @@
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap {
   float: left;
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap table td {
   font-size: 12px;
@@ -1249,7 +1249,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-schedule .e-vertical-view .e-left-indent {
-    width: 35px;
+    width: 60px;
   }
 }
 .e-schedule .e-month-view .e-left-indent,
@@ -3399,8 +3399,8 @@
   background: #212529;
   border: 0;
   color: #adb5bd;
-  height: 40px;
-  width: 40px;
+  height: 35px;
+  width: 35px;
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:focus, .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:hover,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit:focus,
@@ -3412,10 +3412,10 @@
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
   font-size: 15px;
   font-weight: 500;
-  height: 40px;
+  height: 35px;
   line-height: 2.25;
-  padding: 4px 5px;
-  width: calc(100% - 95px);
+  padding: 0 5px;
+  width: calc(100% - 105px);
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close-icon,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit-icon,
@@ -3449,9 +3449,13 @@
 .e-bigger .e-quick-popup-wrapper.e-rtl .e-event-popup .e-date-time-icon {
   padding-right: 16px;
 }
-.e-bigger .e-quick-popup-wrapper .e-edit.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-delete.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-close.e-btn.e-small.e-round {
+.e-bigger .e-quick-popup-wrapper .e-cell-popup .e-close.e-btn.e-small.e-round {
+  height: 2em;
+  width: 2em;
+}
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-close.e-btn.e-small.e-round {
   height: 2em;
   width: 2em;
 }
@@ -3465,8 +3469,13 @@
 .e-bigger .e-quick-popup-wrapper.e-device .e-event-popup .e-popup-header .e-header-icon-wrapper .e-delete-icon {
   font-size: 14px;
 }
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close.e-btn.e-small.e-round {
+  height: 30px;
+}
 .e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
-  padding: 0 5px 0 8px;
+  padding: 1px 5px;
 }
 
 .e-bigger .e-agenda-view .e-appointment {

package/styles/schedule/bootstrap5.css

@@ -1203,7 +1203,7 @@
   text-decoration: none;
 }
 .e-schedule.e-device .e-vertical-view .e-left-indent {
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-clone-time-indicator,
 .e-schedule.e-device .e-vertical-view .e-current-time {
@@ -1211,7 +1211,7 @@
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap {
   float: left;
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap table td {
   font-size: 12px;
@@ -1249,7 +1249,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-schedule .e-vertical-view .e-left-indent {
-    width: 35px;
+    width: 60px;
   }
 }
 .e-schedule .e-month-view .e-left-indent,
@@ -3399,8 +3399,8 @@
   background: #fff;
   border: 0;
   color: #6c757d;
-  height: 40px;
-  width: 40px;
+  height: 35px;
+  width: 35px;
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:focus, .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:hover,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit:focus,
@@ -3412,10 +3412,10 @@
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
   font-size: 15px;
   font-weight: 500;
-  height: 40px;
+  height: 35px;
   line-height: 2.25;
-  padding: 4px 5px;
-  width: calc(100% - 95px);
+  padding: 0 5px;
+  width: calc(100% - 105px);
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close-icon,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit-icon,
@@ -3449,9 +3449,13 @@
 .e-bigger .e-quick-popup-wrapper.e-rtl .e-event-popup .e-date-time-icon {
   padding-right: 16px;
 }
-.e-bigger .e-quick-popup-wrapper .e-edit.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-delete.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-close.e-btn.e-small.e-round {
+.e-bigger .e-quick-popup-wrapper .e-cell-popup .e-close.e-btn.e-small.e-round {
+  height: 2em;
+  width: 2em;
+}
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-close.e-btn.e-small.e-round {
   height: 2em;
   width: 2em;
 }
@@ -3465,8 +3469,13 @@
 .e-bigger .e-quick-popup-wrapper.e-device .e-event-popup .e-popup-header .e-header-icon-wrapper .e-delete-icon {
   font-size: 14px;
 }
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close.e-btn.e-small.e-round {
+  height: 30px;
+}
 .e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
-  padding: 0 5px 0 8px;
+  padding: 1px 5px;
 }
 
 .e-bigger .e-agenda-view .e-appointment {

package/styles/schedule/fabric-dark.css

@@ -1121,7 +1121,7 @@
   text-decoration: none;
 }
 .e-schedule.e-device .e-vertical-view .e-left-indent {
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-clone-time-indicator,
 .e-schedule.e-device .e-vertical-view .e-current-time {
@@ -1129,7 +1129,7 @@
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap {
   float: left;
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap table td {
   font-size: 11px;
@@ -1167,7 +1167,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-schedule .e-vertical-view .e-left-indent {
-    width: 35px;
+    width: 60px;
   }
 }
 .e-schedule .e-month-view .e-left-indent,
@@ -3317,8 +3317,8 @@
   background: transparent;
   border: 0;
   color: #dadada;
-  height: 40px;
-  width: 40px;
+  height: 35px;
+  width: 35px;
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:focus, .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:hover,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit:focus,
@@ -3330,10 +3330,10 @@
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
   font-size: 15px;
   font-weight: 500;
-  height: 40px;
+  height: 35px;
   line-height: 2.25;
-  padding: 4px 5px;
-  width: calc(100% - 95px);
+  padding: 1px 5px;
+  width: calc(100% - 105px);
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close-icon,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit-icon,
@@ -3367,9 +3367,13 @@
 .e-bigger .e-quick-popup-wrapper.e-rtl .e-event-popup .e-date-time-icon {
   padding-right: 13px;
 }
-.e-bigger .e-quick-popup-wrapper .e-edit.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-delete.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-close.e-btn.e-small.e-round {
+.e-bigger .e-quick-popup-wrapper .e-cell-popup .e-close.e-btn.e-small.e-round {
+  height: 2em;
+  width: 2em;
+}
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-close.e-btn.e-small.e-round {
   height: 2em;
   width: 2em;
 }
@@ -3383,8 +3387,13 @@
 .e-bigger .e-quick-popup-wrapper.e-device .e-event-popup .e-popup-header .e-header-icon-wrapper .e-delete-icon {
   font-size: 14px;
 }
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close.e-btn.e-small.e-round {
+  height: 35px;
+}
 .e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
-  padding: 0 5px 0 8px;
+  padding: 0 5px;
 }
 
 .e-bigger .e-agenda-view .e-appointment {

package/styles/schedule/fabric.css

@@ -1111,7 +1111,7 @@
   text-decoration: none;
 }
 .e-schedule.e-device .e-vertical-view .e-left-indent {
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-clone-time-indicator,
 .e-schedule.e-device .e-vertical-view .e-current-time {
@@ -1119,7 +1119,7 @@
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap {
   float: left;
-  width: 35px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap table td {
   font-size: 11px;
@@ -1157,7 +1157,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-schedule .e-vertical-view .e-left-indent {
-    width: 35px;
+    width: 60px;
   }
 }
 .e-schedule .e-month-view .e-left-indent,
@@ -3307,8 +3307,8 @@
   background: transparent;
   border: 0;
   color: #333;
-  height: 40px;
-  width: 40px;
+  height: 35px;
+  width: 35px;
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:focus, .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close:hover,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit:focus,
@@ -3320,10 +3320,10 @@
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
   font-size: 15px;
   font-weight: 500;
-  height: 40px;
+  height: 35px;
   line-height: 2.25;
-  padding: 4px 5px;
-  width: calc(100% - 95px);
+  padding: 1px 5px;
+  width: calc(100% - 105px);
 }
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close-icon,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit-icon,
@@ -3357,9 +3357,13 @@
 .e-bigger .e-quick-popup-wrapper.e-rtl .e-event-popup .e-date-time-icon {
   padding-right: 13px;
 }
-.e-bigger .e-quick-popup-wrapper .e-edit.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-delete.e-btn.e-small.e-round,
-.e-bigger .e-quick-popup-wrapper .e-close.e-btn.e-small.e-round {
+.e-bigger .e-quick-popup-wrapper .e-cell-popup .e-close.e-btn.e-small.e-round {
+  height: 2em;
+  width: 2em;
+}
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper .e-event-popup .e-close.e-btn.e-small.e-round {
   height: 2em;
   width: 2em;
 }
@@ -3373,8 +3377,13 @@
 .e-bigger .e-quick-popup-wrapper.e-device .e-event-popup .e-popup-header .e-header-icon-wrapper .e-delete-icon {
   font-size: 14px;
 }
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-edit.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-delete.e-btn.e-small.e-round,
+.e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-close.e-btn.e-small.e-round {
+  height: 35px;
+}
 .e-bigger .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-subject {
-  padding: 0 5px 0 8px;
+  padding: 0 5px;
 }
 
 .e-bigger .e-agenda-view .e-appointment {