@syncfusion/ej2-schedule 32.1.24 → 32.1.25-810416

package/styles/recurrence-editor/_layout.scss

@@ -1,425 +1,426 @@
-@use 'ej2-base/styles/common/mixin' as *;
-@include export-module('recurrence-editor-layout') {
-  .e-recurrenceeditor {
-    .e-editor {
-      display: flex;
-      flex-flow: row wrap;
-      margin: $recurrence-spacing-0 auto;
-      max-width: 1240px;
-    }
-
-    .e-recurrence-table {
-      table-layout: fixed;
-      width: 100%;
-
-      &.e-repeat-content-wrapper td:last-child {
-        width: 27%;
-      }
-
-      &.e-month-expand-wrapper td:first-child {
-        width: 24%;
-      }
-
-      .e-repeat-content {
-        display: inline-block;
-        font-weight: $recurrence-font-weight-normal;
-        padding: $recurrence-spacing-18 $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-8;
-      }
-
-      .e-input-wrapper {
-        float: none;
-        width: 100%;
-      }
-
-      .e-week-position {
-        min-width: $recurrence-week-position-min-width;
-        position: relative;
-        right: 20px;
-      }
-
-      .e-day-position {
-        min-width: 120px;
-      }
-
-      .e-monthday-element {
-        padding-left: $recurrence-spacing-10;
-      }
-    }
-
-    .e-input-wrapper-side.e-form-left {
-      padding: $recurrence-left-padding;
-    }
-
-    .e-form-left {
-      padding: $recurrence-spacing-0 $recurrence-spacing-8 $recurrence-spacing-16 $recurrence-spacing-0;
-    }
-
-    .e-form-right,
-    .e-input-wrapper-side.e-form-right {
-      padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10;
-    }
-
-    .e-input-wrapper {
-      float: left;
-      width: 50%;
-
-      div {
-        margin-bottom: $recurrence-spacing-2-5;
-      }
-    }
-
-    .e-input-wrapper.e-end-on-date,
-    .e-input-wrapper.e-end-on-count {
-      padding-right: $recurrence-spacing-0;
-      margin-top: $recurrence-end-on-date-margin-top;
-    }
-
-    &.e-rtl {
-      .e-end-on > div,
-      .e-month-expander > div > div {
-        float: right;
-      }
-
-      .e-form-left,
-      .e-input-wrapper-side.e-form-left {
-        padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10 $recurrence-spacing-8;
-      }
-
-      .e-form-right,
-      .e-input-wrapper-side.e-form-right {
-        padding: $recurrence-spacing-0 $recurrence-spacing-8 $recurrence-spacing-10 $recurrence-spacing-0;
-      }
-
-      .e-recurrence-table .e-monthday-element {
-        position: relative;
-        right: 10px;
-      }
-
-      .e-week-position {
-        left: 20px;
-        right: 0;
-      }
-
-      .e-input-wrapper-side.e-end-on .e-end-on-label,
-      .e-input-wrapper-side.e-non-week > .e-month-expander-label {
-        padding-right: $recurrence-spacing-0;
-      }
-
-      .e-end-on-label {
-        margin-bottom: $recurrence-spacing-5;
-      }
-
-      .e-input-wrapper-side.e-end-on .e-end-on-left {
-        padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-8;
-      }
-
-      .e-input-wrapper.e-end-on-date,
-      .e-input-wrapper.e-end-on-count {
-        padding: $recurrence-spacing-0 $recurrence-spacing-8 $recurrence-spacing-0 $recurrence-spacing-0;
-      }
-
-      .e-recurrence-table .e-day-position {
-        margin-right: $recurrence-spacing-20;
-      }
-
-      .e-recurrenceeditor {
-        .e-recurrence-table {
-          &.e-month-expand-wrapper td:first-child {
-            width: 30px;
-          }
-        }
-      }
-    }
-
-    .e-days {
-      .e-week-expander-label {
-        font-size: $recurrence-label-font-nrml-size;
-        font-weight: $recurrence-label-font-weight;
-        margin-bottom: $recurrence-spacing-8;
-      }
-
-      button {
-        border-radius: $recurrence-radius-50;
-        flex-flow: row wrap;
-        height: $recurrence-height-35;
-        margin: $recurrence-spacing-0 $recurrence-spacing-8 $recurrence-spacing-10;
-        width: 35px;
-      }
-    }
-
-    .e-hide-recurrence-element {
-      display: none;
-    }
-
-    .e-half-space {
-      width: 20%;
-    }
-
-    .e-year-expander {
-      margin-bottom: $recurrence-spacing-11;
-    }
-
-    .e-month-expander tr:first-child .e-input-wrapper {
-      padding-bottom: $recurrence-spacing-11;
-    }
-
-    .e-month-expander-checkbox-wrapper.e-input-wrapper {
-      padding-top: $recurrence-spacing-3;
-
-      .e-month-type .e-label {
-        display: none;
-      }
-    }
-
-    .e-input-wrapper.e-month-expander-checkbox-wrapper.e-repeat-on-week-selector {
-      min-width: 30px;
-      margin-bottom: $recurrence-repeat-on-week-selector-margin-bottom;
-    }
-
-    .e-input-wrapper-side {
-      float: left;
-      padding: $recurrence-spacing-16 $recurrence-spacing-20 $recurrence-spacing-0;
-      width: 50%;
-
-      &.e-end-on {
-        .e-end-on-left {
-          padding-right: $recurrence-spacing-16;
-        }
-      }
-
-      &.e-non-week > .e-input-wrapper {
-        margin: $recurrence-spacing-0;
-      }
-
-      &.e-non-week > .e-month-expander-label {
-        font-size: $recurrence-label-font-nrml-size;
-        font-weight: $recurrence-label-font-weight;
-        margin-bottom: $recurrence-month-label-bottom;
-        padding-right: $recurrence-spacing-16;
-      }
-    }
-
-    .e-input-wrapper-side .e-days .e-form-left {
-      padding-bottom: $recurrence-spacing-6;
-    }
-
-    .e-input-wrapper-side .e-non-week .e-form-left {
-      padding-bottom: $recurrence-spacing-12;
-    }
-
-    .e-input-wrapper-side.e-form-right {
-      margin-bottom: $recurrence-spacing-11;
-    }
-  }
-
-  .e-device {
-    .e-recurrenceeditor {
-      .e-recurrence-table {
-        &.e-repeat-content-wrapper td:last-child {
-          width: 25%;
-        }
-
-        &.e-month-expand-wrapper td:first-child {
-          width: 20%;
-        }
-      }
-
-      .e-week-expander-label {
-        margin-bottom: $recurrence-spacing-6;
-      }
-
-      .e-month-expander-label {
-        font-size: $recurrence-label-font-nrml-size;
-        margin-bottom: $recurrence-spacing-5;
-      }
-
-      .e-footer-content {
-        padding: $recurrence-spacing-12;
-      }
-
-      .e-form-left,
-      .e-input-wrapper-side.e-form-left {
-        padding: $recurrence-spacing-0 $recurrence-spacing-3 $recurrence-spacing-10 $recurrence-spacing-0;
-      }
-
-      .e-form-right,
-      .e-input-wrapper-side.e-form-right {
-        padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10 $recurrence-spacing-3;
-      }
-
-      .e-input-wrapper.e-end-on-date,
-      .e-input-wrapper.e-end-on-count {
-        padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10;
-      }
-
-      .e-input-wrapper-side.e-end-on .e-end-on-left {
-        padding-right: $recurrence-spacing-10;
-      }
-
-      &.e-end-on {
-        padding-right: $recurrence-spacing-0;
-
-        .e-end-on-label {
-          float: none;
-          font-size: $recurrence-label-font-nrml-size;
-          font-weight: $recurrence-label-font-weight;
-          margin-bottom: $recurrence-label-bottom;
-        }
-
-        .e-end-on-left {
-          padding-right: $recurrence-spacing-0;
-        }
-      }
-
-      .e-recurrence-table .e-monthday-element,
-      .e-recurrence-table .e-day-position {
-        padding-left: $recurrence-spacing-20;
-      }
-
-      .e-recurrence-table .e-monthday-element {
-        margin-left: $recurrence-spacing-20;
-      }
-
-      .e-week-position {
-        right: 0;
-        padding-right: $recurrence-spacing-10;
-      }
-
-      &.e-rtl {
-        .e-input-wrapper-side.e-end-on .e-end-on-left {
-          padding-right: $recurrence-spacing-0;
-        }
-
-        .e-input-wrapper.e-end-on-date,
-        .e-input-wrapper.e-end-on-count {
-          padding: $recurrence-spacing-0 $recurrence-spacing-10 $recurrence-spacing-0 $recurrence-spacing-0;
-        }
-
-        .e-recurrence-table .e-monthday-element {
-          padding: $recurrence-spacing-0 $recurrence-spacing-20 $recurrence-spacing-0 $recurrence-spacing-0;
-        }
-
-        .e-recurrence-table .e-day-position {
-          padding: $recurrence-spacing-0 $recurrence-spacing-50 $recurrence-spacing-0 $recurrence-spacing-0;
-        }
-
-        .e-week-position {
-          left: 0;
-        }
-      }
-    }
-
-    &.e-recurrence-dialog {
-      .e-dlg-header-content {
-        background: none;
-        box-shadow: none;
-        padding-bottom: $recurrence-spacing-10;
-      }
-
-      .e-editor {
-        .e-input-wrapper-side.e-end-on .e-end-on-label {
-          margin-bottom: $recurrence-label-bottom;
-        }
-      }
-
-      .e-footer-content {
-        padding: $recurrence-spacing-16 $recurrence-spacing-8;
-      }
-    }
-  }
-
-  @media (max-width: 1024px) {
-    .e-recurrenceeditor {
-
-      .e-editor {
-
-        .e-input-wrapper-side.e-end-on {
-          width: 100%;
-        }
-
-        .e-input-wrapper-side.e-non-week {
-          width: 65%;
-        }
-      }
-    }
-  }
-
-  @media (max-width: 580px) {
-    .e-recurrenceeditor {
-      margin-left: auto;
-      margin-right: auto;
-      width: 100%;
-
-      .e-editor {
-        flex-direction: column;
-
-        >.e-input-wrapper.e-form-left {
-          margin-top: $recurrence-spacing-0;
-        }
-
-        .e-input-wrapper-side.e-non-week > .e-month-expander-label,
-        .e-input-wrapper-side.e-end-on .e-end-on-label {
-          margin-bottom: $recurrence-month-label-bottom;
-        }
-
-        > div {
-          margin-top: $recurrence-spacing-20;
-        }
-
-        > .e-input-wrapper {
-          width: 100%;
-        }
-
-        .e-input-wrapper-side.e-end-on {
-          width: 100%;
-
-          .e-input-wrapper {
-            width: 50%;
-          }
-        }
-
-        .e-form-left,
-        .e-input-wrapper-side.e-form-left {
-          padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10;
-        }
-
-        .e-input-wrapper.e-end-on-date,
-        .e-input-wrapper.e-end-on-count {
-          padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10;
-        }
-
-        .e-input-wrapper-side.e-end-on .e-end-on-left {
-          padding-right: $recurrence-spacing-10;
-        }
-
-        .e-form-right,
-        .e-input-wrapper-side.e-form-right {
-          padding-left: $recurrence-spacing-0;
-        }
-
-        .e-input-wrapper-side.e-days {
-          width: 100%;
-        }
-
-        .e-input-wrapper-side.e-non-week {
-          width: 65%;
-        }
-
-        .e-recurrence-table .e-day-position {
-          padding-left: $recurrence-spacing-59;
-        }
-      }
-
-      &.e-rtl {
-        .e-input-wrapper-side.e-end-on .e-end-on-left {
-          padding-right: $recurrence-spacing-0;
-        }
-
-        .e-input-wrapper.e-end-on-date,
-        .e-input-wrapper.e-end-on-count {
-          padding: $recurrence-spacing-0 $recurrence-spacing-10 $recurrence-spacing-0 $recurrence-spacing-0;
-        }
-      }
-    }
-  }
-}
+@use 'ej2-base/styles/common/mixin' as *;
+@use './theme-variables' as *;
+@include export-module('recurrence-editor-layout') {
+  .e-recurrenceeditor {
+    .e-editor {
+      display: flex;
+      flex-flow: row wrap;
+      margin: $recurrence-spacing-0 auto;
+      max-width: 1240px;
+    }
+
+    .e-recurrence-table {
+      table-layout: fixed;
+      width: 100%;
+
+      &.e-repeat-content-wrapper td:last-child {
+        width: 27%;
+      }
+
+      &.e-month-expand-wrapper td:first-child {
+        width: 24%;
+      }
+
+      .e-repeat-content {
+        display: inline-block;
+        font-weight: $recurrence-font-weight-normal;
+        padding: $recurrence-spacing-18 $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-8;
+      }
+
+      .e-input-wrapper {
+        float: none;
+        width: 100%;
+      }
+
+      .e-week-position {
+        min-width: $recurrence-week-position-min-width;
+        position: relative;
+        right: 20px;
+      }
+
+      .e-day-position {
+        min-width: 120px;
+      }
+
+      .e-monthday-element {
+        padding-left: $recurrence-spacing-10;
+      }
+    }
+
+    .e-input-wrapper-side.e-form-left {
+      padding: $recurrence-left-padding;
+    }
+
+    .e-form-left {
+      padding: $recurrence-spacing-0 $recurrence-spacing-8 $recurrence-spacing-16 $recurrence-spacing-0;
+    }
+
+    .e-form-right,
+    .e-input-wrapper-side.e-form-right {
+      padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10;
+    }
+
+    .e-input-wrapper {
+      float: left;
+      width: 50%;
+
+      div {
+        margin-bottom: $recurrence-spacing-2-5;
+      }
+    }
+
+    .e-input-wrapper.e-end-on-date,
+    .e-input-wrapper.e-end-on-count {
+      padding-right: $recurrence-spacing-0;
+      margin-top: $recurrence-end-on-date-margin-top;
+    }
+
+    &.e-rtl {
+      .e-end-on > div,
+      .e-month-expander > div > div {
+        float: right;
+      }
+
+      .e-form-left,
+      .e-input-wrapper-side.e-form-left {
+        padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10 $recurrence-spacing-8;
+      }
+
+      .e-form-right,
+      .e-input-wrapper-side.e-form-right {
+        padding: $recurrence-spacing-0 $recurrence-spacing-8 $recurrence-spacing-10 $recurrence-spacing-0;
+      }
+
+      .e-recurrence-table .e-monthday-element {
+        position: relative;
+        right: 10px;
+      }
+
+      .e-week-position {
+        left: 20px;
+        right: 0;
+      }
+
+      .e-input-wrapper-side.e-end-on .e-end-on-label,
+      .e-input-wrapper-side.e-non-week > .e-month-expander-label {
+        padding-right: $recurrence-spacing-0;
+      }
+
+      .e-end-on-label {
+        margin-bottom: $recurrence-spacing-5;
+      }
+
+      .e-input-wrapper-side.e-end-on .e-end-on-left {
+        padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-8;
+      }
+
+      .e-input-wrapper.e-end-on-date,
+      .e-input-wrapper.e-end-on-count {
+        padding: $recurrence-spacing-0 $recurrence-spacing-8 $recurrence-spacing-0 $recurrence-spacing-0;
+      }
+
+      .e-recurrence-table .e-day-position {
+        margin-right: $recurrence-spacing-20;
+      }
+
+      .e-recurrenceeditor {
+        .e-recurrence-table {
+          &.e-month-expand-wrapper td:first-child {
+            width: 30px;
+          }
+        }
+      }
+    }
+
+    .e-days {
+      .e-week-expander-label {
+        font-size: $recurrence-label-font-nrml-size;
+        font-weight: $recurrence-label-font-weight;
+        margin-bottom: $recurrence-spacing-8;
+      }
+
+      button {
+        border-radius: $recurrence-radius-50;
+        flex-flow: row wrap;
+        height: $recurrence-height-35;
+        margin: $recurrence-spacing-0 $recurrence-spacing-8 $recurrence-spacing-10;
+        width: 35px;
+      }
+    }
+
+    .e-hide-recurrence-element {
+      display: none;
+    }
+
+    .e-half-space {
+      width: 20%;
+    }
+
+    .e-year-expander {
+      margin-bottom: $recurrence-spacing-11;
+    }
+
+    .e-month-expander tr:first-child .e-input-wrapper {
+      padding-bottom: $recurrence-spacing-11;
+    }
+
+    .e-month-expander-checkbox-wrapper.e-input-wrapper {
+      padding-top: $recurrence-spacing-3;
+
+      .e-month-type .e-label {
+        display: none;
+      }
+    }
+
+    .e-input-wrapper.e-month-expander-checkbox-wrapper.e-repeat-on-week-selector {
+      min-width: 30px;
+      margin-bottom: $recurrence-repeat-on-week-selector-margin-bottom;
+    }
+
+    .e-input-wrapper-side {
+      float: left;
+      padding: $recurrence-spacing-16 $recurrence-spacing-20 $recurrence-spacing-0;
+      width: 50%;
+
+      &.e-end-on {
+        .e-end-on-left {
+          padding-right: $recurrence-spacing-16;
+        }
+      }
+
+      &.e-non-week > .e-input-wrapper {
+        margin: $recurrence-spacing-0;
+      }
+
+      &.e-non-week > .e-month-expander-label {
+        font-size: $recurrence-label-font-nrml-size;
+        font-weight: $recurrence-label-font-weight;
+        margin-bottom: $recurrence-month-label-bottom;
+        padding-right: $recurrence-spacing-16;
+      }
+    }
+
+    .e-input-wrapper-side .e-days .e-form-left {
+      padding-bottom: $recurrence-spacing-6;
+    }
+
+    .e-input-wrapper-side .e-non-week .e-form-left {
+      padding-bottom: $recurrence-spacing-12;
+    }
+
+    .e-input-wrapper-side.e-form-right {
+      margin-bottom: $recurrence-spacing-11;
+    }
+  }
+
+  .e-device {
+    .e-recurrenceeditor {
+      .e-recurrence-table {
+        &.e-repeat-content-wrapper td:last-child {
+          width: 25%;
+        }
+
+        &.e-month-expand-wrapper td:first-child {
+          width: 20%;
+        }
+      }
+
+      .e-week-expander-label {
+        margin-bottom: $recurrence-spacing-6;
+      }
+
+      .e-month-expander-label {
+        font-size: $recurrence-label-font-nrml-size;
+        margin-bottom: $recurrence-spacing-5;
+      }
+
+      .e-footer-content {
+        padding: $recurrence-spacing-12;
+      }
+
+      .e-form-left,
+      .e-input-wrapper-side.e-form-left {
+        padding: $recurrence-spacing-0 $recurrence-spacing-3 $recurrence-spacing-10 $recurrence-spacing-0;
+      }
+
+      .e-form-right,
+      .e-input-wrapper-side.e-form-right {
+        padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10 $recurrence-spacing-3;
+      }
+
+      .e-input-wrapper.e-end-on-date,
+      .e-input-wrapper.e-end-on-count {
+        padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10;
+      }
+
+      .e-input-wrapper-side.e-end-on .e-end-on-left {
+        padding-right: $recurrence-spacing-10;
+      }
+
+      &.e-end-on {
+        padding-right: $recurrence-spacing-0;
+
+        .e-end-on-label {
+          float: none;
+          font-size: $recurrence-label-font-nrml-size;
+          font-weight: $recurrence-label-font-weight;
+          margin-bottom: $recurrence-label-bottom;
+        }
+
+        .e-end-on-left {
+          padding-right: $recurrence-spacing-0;
+        }
+      }
+
+      .e-recurrence-table .e-monthday-element,
+      .e-recurrence-table .e-day-position {
+        padding-left: $recurrence-spacing-20;
+      }
+
+      .e-recurrence-table .e-monthday-element {
+        margin-left: $recurrence-spacing-20;
+      }
+
+      .e-week-position {
+        right: 0;
+        padding-right: $recurrence-spacing-10;
+      }
+
+      &.e-rtl {
+        .e-input-wrapper-side.e-end-on .e-end-on-left {
+          padding-right: $recurrence-spacing-0;
+        }
+
+        .e-input-wrapper.e-end-on-date,
+        .e-input-wrapper.e-end-on-count {
+          padding: $recurrence-spacing-0 $recurrence-spacing-10 $recurrence-spacing-0 $recurrence-spacing-0;
+        }
+
+        .e-recurrence-table .e-monthday-element {
+          padding: $recurrence-spacing-0 $recurrence-spacing-20 $recurrence-spacing-0 $recurrence-spacing-0;
+        }
+
+        .e-recurrence-table .e-day-position {
+          padding: $recurrence-spacing-0 $recurrence-spacing-50 $recurrence-spacing-0 $recurrence-spacing-0;
+        }
+
+        .e-week-position {
+          left: 0;
+        }
+      }
+    }
+
+    &.e-recurrence-dialog {
+      .e-dlg-header-content {
+        background: none;
+        box-shadow: none;
+        padding-bottom: $recurrence-spacing-10;
+      }
+
+      .e-editor {
+        .e-input-wrapper-side.e-end-on .e-end-on-label {
+          margin-bottom: $recurrence-label-bottom;
+        }
+      }
+
+      .e-footer-content {
+        padding: $recurrence-spacing-16 $recurrence-spacing-8;
+      }
+    }
+  }
+
+  @media (max-width: 1024px) {
+    .e-recurrenceeditor {
+
+      .e-editor {
+
+        .e-input-wrapper-side.e-end-on {
+          width: 100%;
+        }
+
+        .e-input-wrapper-side.e-non-week {
+          width: 65%;
+        }
+      }
+    }
+  }
+
+  @media (max-width: 580px) {
+    .e-recurrenceeditor {
+      margin-left: auto;
+      margin-right: auto;
+      width: 100%;
+
+      .e-editor {
+        flex-direction: column;
+
+        >.e-input-wrapper.e-form-left {
+          margin-top: $recurrence-spacing-0;
+        }
+
+        .e-input-wrapper-side.e-non-week > .e-month-expander-label,
+        .e-input-wrapper-side.e-end-on .e-end-on-label {
+          margin-bottom: $recurrence-month-label-bottom;
+        }
+
+        > div {
+          margin-top: $recurrence-spacing-20;
+        }
+
+        > .e-input-wrapper {
+          width: 100%;
+        }
+
+        .e-input-wrapper-side.e-end-on {
+          width: 100%;
+
+          .e-input-wrapper {
+            width: 50%;
+          }
+        }
+
+        .e-form-left,
+        .e-input-wrapper-side.e-form-left {
+          padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10;
+        }
+
+        .e-input-wrapper.e-end-on-date,
+        .e-input-wrapper.e-end-on-count {
+          padding: $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-0 $recurrence-spacing-10;
+        }
+
+        .e-input-wrapper-side.e-end-on .e-end-on-left {
+          padding-right: $recurrence-spacing-10;
+        }
+
+        .e-form-right,
+        .e-input-wrapper-side.e-form-right {
+          padding-left: $recurrence-spacing-0;
+        }
+
+        .e-input-wrapper-side.e-days {
+          width: 100%;
+        }
+
+        .e-input-wrapper-side.e-non-week {
+          width: 65%;
+        }
+
+        .e-recurrence-table .e-day-position {
+          padding-left: $recurrence-spacing-59;
+        }
+      }
+
+      &.e-rtl {
+        .e-input-wrapper-side.e-end-on .e-end-on-left {
+          padding-right: $recurrence-spacing-0;
+        }
+
+        .e-input-wrapper.e-end-on-date,
+        .e-input-wrapper.e-end-on-count {
+          padding: $recurrence-spacing-0 $recurrence-spacing-10 $recurrence-spacing-0 $recurrence-spacing-0;
+        }
+      }
+    }
+  }
+}