@syncfusion/ej2-schedule 23.2.7 → 24.2.3

package/styles/material3.css

@@ -1296,7 +1296,7 @@
   text-decoration: none;
 }
 .e-schedule.e-device .e-vertical-view .e-left-indent {
-  width: 44px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-clone-time-indicator,
 .e-schedule.e-device .e-vertical-view .e-current-time {
@@ -1304,7 +1304,7 @@
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap {
   float: left;
-  width: 44px;
+  width: 60px;
 }
 .e-schedule.e-device .e-vertical-view .e-time-cells-wrap table td {
   font-size: 14px;
@@ -1342,7 +1342,7 @@
 }
 @media screen and (max-width: 480px) {
   .e-schedule .e-vertical-view .e-left-indent {
-    width: 44px;
+    width: 60px;
   }
 }
 .e-schedule .e-month-view .e-left-indent,
@@ -3492,8 +3492,8 @@
   background: transparent;
   border: 0;
   color: rgba(var(--color-sf-on-surface-variant));
-  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,
@@ -3505,15 +3505,15 @@
 .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,
 .e-quick-popup-wrapper.e-device .e-multiple-event-popup .e-popup-header .e-delete-icon {
-  font-size: 14px;
+  font-size: 16px;
 }
 .e-quick-popup-wrapper.e-device.e-rtl .e-event-popup .e-popup-header .e-close {
   margin-left: auto;
@@ -3542,9 +3542,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: 30px;
+  width: 30px;
+}
+.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: 30px;
   width: 30px;
 }
@@ -3558,8 +3562,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: 5px 5px 0 8px;
+  padding: 2px 5px;
 }
 
 .e-bigger .e-agenda-view .e-appointment {
@@ -4341,6 +4350,7 @@
 .e-recurrenceeditor .e-input-wrapper.e-end-on-date,
 .e-recurrenceeditor .e-input-wrapper.e-end-on-count {
   padding-right: 0;
+  margin-top: 16px;
 }
 .e-recurrenceeditor.e-rtl .e-end-on > div,
 .e-recurrenceeditor.e-rtl .e-month-expander > div > div {
@@ -4380,7 +4390,7 @@
   width: 30px;
 }
 .e-recurrenceeditor .e-days .e-week-expander-label {
-  font-size: 10px;
+  font-size: 12px;
   font-weight: 400;
   margin-bottom: 8px;
 }
@@ -4415,13 +4425,6 @@
   padding: 16px 20px 0;
   width: 50%;
 }
-.e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-label {
-  float: none;
-  font-size: 10px;
-  font-weight: 400;
-  margin-bottom: 8px;
-  padding-right: 16px;
-}
 .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 16px;
 }
@@ -4429,9 +4432,9 @@
   margin: 0;
 }
 .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
-  font-size: 10px;
+  font-size: 12px;
   font-weight: 400;
-  margin-bottom: 8px;
+  margin-bottom: -2px;
   padding-right: 16px;
 }
 .e-recurrenceeditor .e-input-wrapper-side .e-days .e-form-left {
@@ -4473,7 +4476,8 @@
 }
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
   font-size: 12px;
-  margin-bottom: 0;
+  margin-bottom: -1px;
+  font-weight: 400;
 }
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 16px;
@@ -4639,7 +4643,7 @@
   }
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-non-week > .e-month-expander-label,
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-end-on .e-end-on-label {
-    margin-bottom: 8px;
+    margin-bottom: -2px;
   }
   .e-recurrenceeditor .e-editor > div {
     margin-top: 20px;

package/styles/recurrence-editor/_bootstrap-dark-definition.scss

@@ -1,6 +1,7 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 9px !default;
+$recurrence-month-label-bottom-bgr: 9px !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: bold !default;
 $recurrence-label-font-nrml-size: 12px !default;
@@ -11,3 +12,4 @@ $recurrence-week-position-bgr-min-width: 130px !default;
 $recurrence-day-position-bgr-min-width: 190px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 8px !default;
+$recurrence-end-on-date-margin-top: 24px !default;

package/styles/recurrence-editor/_bootstrap-definition.scss

@@ -1,6 +1,7 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 9px !default;
+$recurrence-month-label-bottom-bgr: 9px !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: bold !default;
 $recurrence-label-font-nrml-size: 12px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 190px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 8px !default;
 $recurrence-week-position-min-width: 98px !default;
+$recurrence-end-on-date-margin-top: 24px !default;

package/styles/recurrence-editor/_bootstrap4-definition.scss

@@ -1,6 +1,7 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 3px !default;
+$recurrence-month-label-bottom-bgr: 0 !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: 400 !default;
 $recurrence-label-font-nrml-size: 14px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 190px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 16px !default;
 $recurrence-week-position-min-width: 98px !default;
+$recurrence-end-on-date-margin-top: 24px !default;

package/styles/recurrence-editor/_bootstrap5-definition.scss

@@ -1,9 +1,10 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 5px !default;
+$recurrence-month-label-bottom-bgr: 0 !default;
 $recurrence-week-label-bottom: 10px !default;
-$recurrence-label-font-weight: $font-weight-normal !default;
-$recurrence-label-font-nrml-size: 14px !default;
+$recurrence-label-font-weight: $font-weight-medium !default;
+$recurrence-label-font-nrml-size: 12px !default;
 $recurrence-label-font-bgr-size: 16px !default;
 $recurrence-left-padding: 0 8px 16px 0 !default;
 $recurrence-week-position-bgr-min-width: 130px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 190px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 16px !default;
 $recurrence-week-position-min-width: 98px !default;
+$recurrence-end-on-date-margin-top: 24px !default;

package/styles/recurrence-editor/_fabric-dark-definition.scss

@@ -1,9 +1,10 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 10px !default;
+$recurrence-month-label-bottom-bgr: 8px !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: 400 !default;
-$recurrence-label-font-nrml-size: 13px !default;
+$recurrence-label-font-nrml-size: 12px !default;
 $recurrence-label-font-bgr-size: 13px !default;
 $recurrence-left-padding: 0 8px 10px 0 !default;
 $recurrence-week-position-bgr-min-width: 130px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 183px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 5px !default;
 $recurrence-week-position-min-width: 90px !default;
+$recurrence-end-on-date-margin-top: 28px !default;

package/styles/recurrence-editor/_fabric-definition.scss

@@ -1,9 +1,10 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 10px !default;
+$recurrence-month-label-bottom-bgr: 8px !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: 400 !default;
-$recurrence-label-font-nrml-size: 13px !default;
+$recurrence-label-font-nrml-size: 12px !default;
 $recurrence-label-font-bgr-size: 13px !default;
 $recurrence-left-padding: 0 8px 10px 0 !default;
 $recurrence-week-position-bgr-min-width: 130px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 183px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 5px !default;
 $recurrence-week-position-min-width: 90px !default;
+$recurrence-end-on-date-margin-top: 28px !default;

package/styles/recurrence-editor/_fluent-definition.scss

@@ -1,8 +1,9 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 4px !default;
+$recurrence-month-label-bottom-bgr: 0 !default;
 $recurrence-week-label-bottom: 10px !default;
-$recurrence-label-font-weight: $font-weight-normal !default;
+$recurrence-label-font-weight: 600 !default;
 $recurrence-label-font-nrml-size: 14px !default;
 $recurrence-label-font-bgr-size: 16px !default;
 $recurrence-left-padding: 0 8px 16px 0 !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 183px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 5px !default;
 $recurrence-week-position-min-width: 90px !default;
+$recurrence-end-on-date-margin-top: 24px !default;

package/styles/recurrence-editor/_fusionnew-definition.scss

@@ -1,8 +1,9 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 4px !default;
+$recurrence-month-label-bottom-bgr: 0 !default;
 $recurrence-week-label-bottom: 10px !default;
-$recurrence-label-font-weight: 400 !default;
+$recurrence-label-font-weight: 600 !default;
 $recurrence-label-font-nrml-size: 14px !default;
 $recurrence-label-font-bgr-size: 16px !default;
 $recurrence-left-padding: 0 8px 16px 0 !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 190px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 16px !default;
 $recurrence-week-position-min-width: 98px !default;
+$recurrence-end-on-date-margin-top: 24px !default;

package/styles/recurrence-editor/_highcontrast-definition.scss

@@ -1,6 +1,7 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 10px !default;
+$recurrence-month-label-bottom-bgr: 10px !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: 400 !default;
 $recurrence-label-font-nrml-size: 12px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 183px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 5px !default;
 $recurrence-week-position-min-width: 88px !default;
+$recurrence-end-on-date-margin-top: 28px !default;

package/styles/recurrence-editor/_highcontrast-light-definition.scss

@@ -1,6 +1,7 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 10px !default;
+$recurrence-month-label-bottom-bgr: 10px !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: 400 !default;
 $recurrence-label-font-nrml-size: 12px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 183px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 5px !default;
 $recurrence-week-position-min-width: 88px !default;
+$recurrence-end-on-date-margin-top: 28px !default;

package/styles/recurrence-editor/_layout.scss

@@ -72,6 +72,7 @@
     .e-input-wrapper.e-end-on-date,
     .e-input-wrapper.e-end-on-count {
       padding-right: 0;
+      margin-top: $recurrence-end-on-date-margin-top;
     }
 
     &.e-rtl {
@@ -173,15 +174,6 @@
       width: 50%;
 
       &.e-end-on {
-
-        .e-end-on-label {
-          float: none;
-          font-size: $recurrence-label-font-nrml-size;
-          font-weight: $recurrence-label-font-weight;
-          margin-bottom: $recurrence-month-label-bottom;
-          padding-right: 16px;
-        }
-
         .e-end-on-left {
           padding-right: 16px;
         }
@@ -249,7 +241,8 @@
 
       .e-input-wrapper-side.e-non-week > .e-month-expander-label {
         font-size: $recurrence-label-font-bgr-size;
-        margin-bottom: 0;
+        margin-bottom: $recurrence-month-label-bottom-bgr;
+        font-weight: $recurrence-label-font-weight;
       }
 
       .e-input-wrapper-side.e-end-on .e-end-on-left {

package/styles/recurrence-editor/_material-dark-definition.scss

@@ -1,9 +1,10 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 1px !default;
 $recurrence-month-label-bottom: 1px !default;
+$recurrence-month-label-bottom-bgr: 3px !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: 400 !default;
-$recurrence-label-font-nrml-size: 12px !default;
+$recurrence-label-font-nrml-size: 13px !default;
 $recurrence-label-font-bgr-size: 12px !default;
 $recurrence-left-padding: 0 8px 10px 0 !default;
 $recurrence-week-position-bgr-min-width: 90px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 128px !default;
 $recurrence-day-position-bgr-padding-left: 14px !default;
 $recurrence-end-bgr-padding-right: 16px !default;
 $recurrence-week-position-min-width: 81px !default;
+$recurrence-end-on-date-margin-top: 16px !default;

package/styles/recurrence-editor/_material-definition.scss

@@ -1,9 +1,10 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 1px !default;
 $recurrence-month-label-bottom: 1px !default;
+$recurrence-month-label-bottom-bgr: 3px !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: 400 !default;
-$recurrence-label-font-nrml-size: 12px !default;
+$recurrence-label-font-nrml-size: 13px !default;
 $recurrence-label-font-bgr-size: 12px !default;
 $recurrence-left-padding: 0 8px 10px 0 !default;
 $recurrence-week-position-bgr-min-width: 90px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 128px !default;
 $recurrence-day-position-bgr-padding-left: 14px !default;
 $recurrence-end-bgr-padding-right: 16px !default;
 $recurrence-week-position-min-width: 81px !default;
+$recurrence-end-on-date-margin-top: 16px !default;

package/styles/recurrence-editor/_material3-definition.scss

@@ -1,9 +1,10 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 8px !default;
-$recurrence-month-label-bottom: 8px !default;
+$recurrence-month-label-bottom: -2px !default;
+$recurrence-month-label-bottom-bgr: -1px !default;
 $recurrence-week-label-bottom: 10px !default;
 $recurrence-label-font-weight: $font-weight-normal !default;
-$recurrence-label-font-nrml-size: $text-xxs !default;
+$recurrence-label-font-nrml-size: $text-xs !default;
 $recurrence-label-font-bgr-size: $text-xs !default;
 $recurrence-left-padding: 0 8px 16px 0 !default;
 $recurrence-week-position-bgr-min-width: 130px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 190px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 16px !default;
 $recurrence-week-position-min-width: 98px !default;
+$recurrence-end-on-date-margin-top: 16px !default;

package/styles/recurrence-editor/_tailwind-definition.scss

@@ -1,9 +1,10 @@
 /*! recurrence editor theme wise definitions*/
 $recurrence-label-bottom: 7px !default;
-$recurrence-month-label-bottom: 7px !default;
+$recurrence-month-label-bottom: 6px !default;
+$recurrence-month-label-bottom-bgr: 0 !default;
 $recurrence-week-label-bottom: 10px !default;
-$recurrence-label-font-weight: $font-weight-normal !default;
-$recurrence-label-font-nrml-size: 14px !default;
+$recurrence-label-font-weight: $font-weight-medium !default;
+$recurrence-label-font-nrml-size: 12px !default;
 $recurrence-label-font-bgr-size: 16px !default;
 $recurrence-left-padding: 0 8px 16px 0 !default;
 $recurrence-week-position-bgr-min-width: 130px !default;
@@ -11,3 +12,4 @@ $recurrence-day-position-bgr-min-width: 197px !default;
 $recurrence-day-position-bgr-padding-left: 54px !default;
 $recurrence-end-bgr-padding-right: 2px !default;
 $recurrence-week-position-min-width: 94px !default;
+$recurrence-end-on-date-margin-top: 24px !default;

package/styles/recurrence-editor/bootstrap-dark.css

@@ -163,6 +163,7 @@
 .e-recurrenceeditor .e-input-wrapper.e-end-on-date,
 .e-recurrenceeditor .e-input-wrapper.e-end-on-count {
   padding-right: 0;
+  margin-top: 24px;
 }
 .e-recurrenceeditor.e-rtl .e-end-on > div,
 .e-recurrenceeditor.e-rtl .e-month-expander > div > div {
@@ -237,13 +238,6 @@
   padding: 16px 20px 0;
   width: 50%;
 }
-.e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-label {
-  float: none;
-  font-size: 12px;
-  font-weight: bold;
-  margin-bottom: 7px;
-  padding-right: 16px;
-}
 .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 16px;
 }
@@ -253,7 +247,7 @@
 .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
   font-size: 12px;
   font-weight: bold;
-  margin-bottom: 7px;
+  margin-bottom: 9px;
   padding-right: 16px;
 }
 .e-recurrenceeditor .e-input-wrapper-side .e-days .e-form-left {
@@ -295,7 +289,8 @@
 }
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
   font-size: 12px;
-  margin-bottom: 0;
+  margin-bottom: 9px;
+  font-weight: bold;
 }
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 8px;
@@ -461,7 +456,7 @@
   }
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-non-week > .e-month-expander-label,
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-end-on .e-end-on-label {
-    margin-bottom: 7px;
+    margin-bottom: 9px;
   }
   .e-recurrenceeditor .e-editor > div {
     margin-top: 20px;

package/styles/recurrence-editor/bootstrap.css

@@ -163,6 +163,7 @@
 .e-recurrenceeditor .e-input-wrapper.e-end-on-date,
 .e-recurrenceeditor .e-input-wrapper.e-end-on-count {
   padding-right: 0;
+  margin-top: 24px;
 }
 .e-recurrenceeditor.e-rtl .e-end-on > div,
 .e-recurrenceeditor.e-rtl .e-month-expander > div > div {
@@ -237,13 +238,6 @@
   padding: 16px 20px 0;
   width: 50%;
 }
-.e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-label {
-  float: none;
-  font-size: 12px;
-  font-weight: bold;
-  margin-bottom: 7px;
-  padding-right: 16px;
-}
 .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 16px;
 }
@@ -253,7 +247,7 @@
 .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
   font-size: 12px;
   font-weight: bold;
-  margin-bottom: 7px;
+  margin-bottom: 9px;
   padding-right: 16px;
 }
 .e-recurrenceeditor .e-input-wrapper-side .e-days .e-form-left {
@@ -295,7 +289,8 @@
 }
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
   font-size: 12px;
-  margin-bottom: 0;
+  margin-bottom: 9px;
+  font-weight: bold;
 }
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 8px;
@@ -461,7 +456,7 @@
   }
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-non-week > .e-month-expander-label,
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-end-on .e-end-on-label {
-    margin-bottom: 7px;
+    margin-bottom: 9px;
   }
   .e-recurrenceeditor .e-editor > div {
     margin-top: 20px;

package/styles/recurrence-editor/bootstrap4.css

@@ -208,6 +208,7 @@
 .e-recurrenceeditor .e-input-wrapper.e-end-on-date,
 .e-recurrenceeditor .e-input-wrapper.e-end-on-count {
   padding-right: 0;
+  margin-top: 24px;
 }
 .e-recurrenceeditor.e-rtl .e-end-on > div,
 .e-recurrenceeditor.e-rtl .e-month-expander > div > div {
@@ -282,13 +283,6 @@
   padding: 16px 20px 0;
   width: 50%;
 }
-.e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-label {
-  float: none;
-  font-size: 14px;
-  font-weight: 400;
-  margin-bottom: 7px;
-  padding-right: 16px;
-}
 .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 16px;
 }
@@ -298,7 +292,7 @@
 .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
   font-size: 14px;
   font-weight: 400;
-  margin-bottom: 7px;
+  margin-bottom: 3px;
   padding-right: 16px;
 }
 .e-recurrenceeditor .e-input-wrapper-side .e-days .e-form-left {
@@ -341,6 +335,7 @@
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
   font-size: 16px;
   margin-bottom: 0;
+  font-weight: 400;
 }
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 16px;
@@ -506,7 +501,7 @@
   }
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-non-week > .e-month-expander-label,
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-end-on .e-end-on-label {
-    margin-bottom: 7px;
+    margin-bottom: 3px;
   }
   .e-recurrenceeditor .e-editor > div {
     margin-top: 20px;

package/styles/recurrence-editor/bootstrap5-dark.css

@@ -204,6 +204,7 @@
 .e-recurrenceeditor .e-input-wrapper.e-end-on-date,
 .e-recurrenceeditor .e-input-wrapper.e-end-on-count {
   padding-right: 0;
+  margin-top: 24px;
 }
 .e-recurrenceeditor.e-rtl .e-end-on > div,
 .e-recurrenceeditor.e-rtl .e-month-expander > div > div {
@@ -243,8 +244,8 @@
   width: 30px;
 }
 .e-recurrenceeditor .e-days .e-week-expander-label {
-  font-size: 14px;
-  font-weight: 400;
+  font-size: 12px;
+  font-weight: 500;
   margin-bottom: 8px;
 }
 .e-recurrenceeditor .e-days button {
@@ -278,13 +279,6 @@
   padding: 16px 20px 0;
   width: 50%;
 }
-.e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-label {
-  float: none;
-  font-size: 14px;
-  font-weight: 400;
-  margin-bottom: 7px;
-  padding-right: 16px;
-}
 .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 16px;
 }
@@ -292,9 +286,9 @@
   margin: 0;
 }
 .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
-  font-size: 14px;
-  font-weight: 400;
-  margin-bottom: 7px;
+  font-size: 12px;
+  font-weight: 500;
+  margin-bottom: 5px;
   padding-right: 16px;
 }
 .e-recurrenceeditor .e-input-wrapper-side .e-days .e-form-left {
@@ -337,6 +331,7 @@
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-non-week > .e-month-expander-label {
   font-size: 16px;
   margin-bottom: 0;
+  font-weight: 500;
 }
 .e-bigger .e-recurrenceeditor .e-input-wrapper-side.e-end-on .e-end-on-left {
   padding-right: 16px;
@@ -434,7 +429,7 @@
 .e-device .e-recurrenceeditor.e-end-on .e-end-on-label {
   float: none;
   font-size: 12px;
-  font-weight: 400;
+  font-weight: 500;
   margin-bottom: 7px;
 }
 .e-device .e-recurrenceeditor.e-end-on .e-end-on-left {
@@ -502,7 +497,7 @@
   }
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-non-week > .e-month-expander-label,
   .e-recurrenceeditor .e-editor .e-input-wrapper-side.e-end-on .e-end-on-label {
-    margin-bottom: 7px;
+    margin-bottom: 5px;
   }
   .e-recurrenceeditor .e-editor > div {
     margin-top: 20px;