@syncfusion/ej2-navigations 20.2.50 → 20.3.47

package/styles/breadcrumb/_layout.scss

@@ -1,4 +1,5 @@
 @include export-module('breadcrumb-layout') {
+
   /*! breadcrumb layout */
   .e-breadcrumb {
     display: block;
@@ -216,7 +217,7 @@
     }
 
     @if $breadcrumb-skin == 'bootstrap5' {
-      .e-icon-item  + .e-breadcrumb-separator {
+      .e-icon-item + .e-breadcrumb-separator {
         padding-left: $breadcrumb-icon-only-item-next-separator-padding-left;
       }
     }
@@ -342,8 +343,8 @@
         display: flex;
         flex-grow: 1;
         justify-content: flex-end;
-     }
-   }
+      }
+    }
 
     &.e-rtl.e-icon-right .e-breadcrumb-icon,
     &.e-rtl .e-icon-right .e-breadcrumb-icon {

package/styles/breadcrumb/_theme.scss

@@ -1,4 +1,5 @@
 @include export-module('breadcrumb-theme') {
+
   /*! breadcrumb theme */
   .e-breadcrumb {
     .e-breadcrumb-item {

package/styles/breadcrumb/icons/_bootstrap-dark.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-bootstrap-dark-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_bootstrap.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-bootstrap-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_bootstrap4.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-bootstrap4-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_bootstrap5.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-bootstrap5-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_fabric-dark.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-fabric-dark-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_fabric.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-fabric-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_fluent.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-fluent-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_fusionnew.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-fusionnew-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_highcontrast-light.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-highcontrast-light-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_highcontrast.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-highcontrast-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_material-dark.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-material-dark-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_material.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-material-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_material3.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-material3-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_tailwind-dark.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-tailwind-dark-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/breadcrumb/icons/_tailwind.scss

@@ -1,5 +1,5 @@
-
 @include export-module('breadcrumb-tailwind-icons') {
+
   /*! breadcrumb icons */
   .e-breadcrumb {
     .e-breadcrumb-collapsed::before,

package/styles/carousel/_all.scss

@@ -1,2 +1,2 @@
-@import 'layout.scss';
+@import 'layout.scss';
 @import 'theme.scss';

package/styles/carousel/_layout.scss

@@ -7,7 +7,8 @@
     padding: 0;
     position: relative;
 
-    .e-carousel-items {
+    .e-carousel-items,
+    .e-carousel-slide-container {
       height: 100%;
       margin: 0;
       overflow: hidden;
@@ -16,7 +17,45 @@
       width: 100%;
     }
 
-    &.e-carousel-slide-animation {
+    &.e-partial {
+      .e-carousel-slide-container {
+        padding: 0 100px;
+
+        @media screen and (max-width: 480px) {
+          padding: 0 75px;
+        }
+
+        @media screen and (max-width: 320px) {
+          padding: 0 50px;
+        }
+      }
+
+      .e-carousel-items {
+        width: calc(var(--carousel-items-count) * 100%);
+        display: flex;
+        flex-direction: row;
+        transition-property: transform;
+        transition-duration: $carousel-animation-duration;
+        transition-timing-function: $carousel-animation-timing-function;
+      }
+
+      .e-carousel-item {
+        height: 100%;
+        overflow: hidden;
+        padding: 0;
+        position: relative;
+        width: calc(100% / var(--carousel-items-count));
+      }
+    }
+
+    &.e-blazor-carousel.e-partial {
+      .e-carousel-items {
+        transform: translateX(calc(-100% / var(--carousel-items-count) * (var(--carousel-items-current))));
+        transition: transform $carousel-animation-duration $carousel-animation-timing-function;
+      }
+    }
+
+    &.e-carousel-slide-animation:not(.e-partial) {
       .e-carousel-item {
         backface-visibility: hidden;
         display: none;
@@ -45,7 +84,7 @@
       }
     }
 
-    &.e-carousel-fade-animation {
+    &.e-carousel-fade-animation:not(.e-partial) {
       .e-carousel-item {
         backface-visibility: hidden;
         display: block;
@@ -65,7 +104,7 @@
       }
     }
 
-    &.e-carousel-animation-none {
+    &.e-carousel-animation-none:not(.e-partial) {
       .e-carousel-item {
         display: none;
         height: 100%;
@@ -77,7 +116,7 @@
       }
     }
 
-    &.e-carousel-custom-animation {
+    &.e-carousel-custom-animation:not(.e-partial) {
       .e-carousel-item {
         display: block;
         height: 100%;

package/styles/carousel/bootstrap-dark.css

@@ -25,7 +25,8 @@
   padding: 0;
   position: relative;
 }
-.e-carousel .e-carousel-items {
+.e-carousel .e-carousel-items,
+.e-carousel .e-carousel-slide-container {
   height: 100%;
   margin: 0;
   overflow: hidden;
@@ -33,7 +34,41 @@
   position: relative;
   width: 100%;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item {
+.e-carousel.e-partial .e-carousel-slide-container {
+  padding: 0 100px;
+}
+@media screen and (max-width: 480px) {
+  .e-carousel.e-partial .e-carousel-slide-container {
+    padding: 0 75px;
+  }
+}
+@media screen and (max-width: 320px) {
+  .e-carousel.e-partial .e-carousel-slide-container {
+    padding: 0 50px;
+  }
+}
+.e-carousel.e-partial .e-carousel-items {
+  width: calc(var(--carousel-items-count) * 100%);
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-direction: row;
+      flex-direction: row;
+  transition-property: transform;
+  transition-duration: 0.6s;
+  transition-timing-function: ease-in-out;
+}
+.e-carousel.e-partial .e-carousel-item {
+  height: 100%;
+  overflow: hidden;
+  padding: 0;
+  position: relative;
+  width: calc(100% / var(--carousel-items-count));
+}
+.e-carousel.e-blazor-carousel.e-partial .e-carousel-items {
+  transform: translateX(calc(-100% / var(--carousel-items-count) * (var(--carousel-items-current))));
+  transition: transform 0.6s ease-in-out;
+}
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item {
   backface-visibility: hidden;
   display: none;
   float: left;
@@ -43,16 +78,16 @@
   transition: transform 0.6s ease-in-out;
   width: 100%;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-prev, .e-carousel.e-carousel-slide-animation .e-carousel-item.e-next, .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-prev, .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-next, .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active {
   display: block;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-next:not(.e-transition-start), .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active.e-transition-end {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-next:not(.e-transition-start), .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active.e-transition-end {
   transform: translateX(100%);
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-prev:not(.e-transition-end), .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active.e-transition-start {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-prev:not(.e-transition-end), .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active.e-transition-start {
   transform: translateX(-100%);
 }
-.e-carousel.e-carousel-fade-animation .e-carousel-item {
+.e-carousel.e-carousel-fade-animation:not(.e-partial) .e-carousel-item {
   backface-visibility: hidden;
   display: block;
   float: left;
@@ -64,19 +99,19 @@
   width: 100%;
   z-index: 0;
 }
-.e-carousel.e-carousel-fade-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-fade-animation:not(.e-partial) .e-carousel-item.e-active {
   opacity: 1;
   z-index: 1;
 }
-.e-carousel.e-carousel-animation-none .e-carousel-item {
+.e-carousel.e-carousel-animation-none:not(.e-partial) .e-carousel-item {
   display: none;
   height: 100%;
   width: 100%;
 }
-.e-carousel.e-carousel-animation-none .e-carousel-item.e-active {
+.e-carousel.e-carousel-animation-none:not(.e-partial) .e-carousel-item.e-active {
   display: block;
 }
-.e-carousel.e-carousel-custom-animation .e-carousel-item {
+.e-carousel.e-carousel-custom-animation:not(.e-partial) .e-carousel-item {
   display: block;
   height: 100%;
   left: 0;
@@ -86,7 +121,7 @@
   top: 0;
   width: 100%;
 }
-.e-carousel.e-carousel-custom-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-custom-animation:not(.e-partial) .e-carousel-item.e-active {
   opacity: 1;
   pointer-events: visible;
 }

package/styles/carousel/bootstrap.css

@@ -25,7 +25,8 @@
   padding: 0;
   position: relative;
 }
-.e-carousel .e-carousel-items {
+.e-carousel .e-carousel-items,
+.e-carousel .e-carousel-slide-container {
   height: 100%;
   margin: 0;
   overflow: hidden;
@@ -33,7 +34,41 @@
   position: relative;
   width: 100%;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item {
+.e-carousel.e-partial .e-carousel-slide-container {
+  padding: 0 100px;
+}
+@media screen and (max-width: 480px) {
+  .e-carousel.e-partial .e-carousel-slide-container {
+    padding: 0 75px;
+  }
+}
+@media screen and (max-width: 320px) {
+  .e-carousel.e-partial .e-carousel-slide-container {
+    padding: 0 50px;
+  }
+}
+.e-carousel.e-partial .e-carousel-items {
+  width: calc(var(--carousel-items-count) * 100%);
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-direction: row;
+      flex-direction: row;
+  transition-property: transform;
+  transition-duration: 0.6s;
+  transition-timing-function: ease-in-out;
+}
+.e-carousel.e-partial .e-carousel-item {
+  height: 100%;
+  overflow: hidden;
+  padding: 0;
+  position: relative;
+  width: calc(100% / var(--carousel-items-count));
+}
+.e-carousel.e-blazor-carousel.e-partial .e-carousel-items {
+  transform: translateX(calc(-100% / var(--carousel-items-count) * (var(--carousel-items-current))));
+  transition: transform 0.6s ease-in-out;
+}
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item {
   backface-visibility: hidden;
   display: none;
   float: left;
@@ -43,16 +78,16 @@
   transition: transform 0.6s ease-in-out;
   width: 100%;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-prev, .e-carousel.e-carousel-slide-animation .e-carousel-item.e-next, .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-prev, .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-next, .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active {
   display: block;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-next:not(.e-transition-start), .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active.e-transition-end {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-next:not(.e-transition-start), .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active.e-transition-end {
   transform: translateX(100%);
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-prev:not(.e-transition-end), .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active.e-transition-start {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-prev:not(.e-transition-end), .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active.e-transition-start {
   transform: translateX(-100%);
 }
-.e-carousel.e-carousel-fade-animation .e-carousel-item {
+.e-carousel.e-carousel-fade-animation:not(.e-partial) .e-carousel-item {
   backface-visibility: hidden;
   display: block;
   float: left;
@@ -64,19 +99,19 @@
   width: 100%;
   z-index: 0;
 }
-.e-carousel.e-carousel-fade-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-fade-animation:not(.e-partial) .e-carousel-item.e-active {
   opacity: 1;
   z-index: 1;
 }
-.e-carousel.e-carousel-animation-none .e-carousel-item {
+.e-carousel.e-carousel-animation-none:not(.e-partial) .e-carousel-item {
   display: none;
   height: 100%;
   width: 100%;
 }
-.e-carousel.e-carousel-animation-none .e-carousel-item.e-active {
+.e-carousel.e-carousel-animation-none:not(.e-partial) .e-carousel-item.e-active {
   display: block;
 }
-.e-carousel.e-carousel-custom-animation .e-carousel-item {
+.e-carousel.e-carousel-custom-animation:not(.e-partial) .e-carousel-item {
   display: block;
   height: 100%;
   left: 0;
@@ -86,7 +121,7 @@
   top: 0;
   width: 100%;
 }
-.e-carousel.e-carousel-custom-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-custom-animation:not(.e-partial) .e-carousel-item.e-active {
   opacity: 1;
   pointer-events: visible;
 }

package/styles/carousel/bootstrap4.css

@@ -25,7 +25,8 @@
   padding: 0;
   position: relative;
 }
-.e-carousel .e-carousel-items {
+.e-carousel .e-carousel-items,
+.e-carousel .e-carousel-slide-container {
   height: 100%;
   margin: 0;
   overflow: hidden;
@@ -33,7 +34,41 @@
   position: relative;
   width: 100%;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item {
+.e-carousel.e-partial .e-carousel-slide-container {
+  padding: 0 100px;
+}
+@media screen and (max-width: 480px) {
+  .e-carousel.e-partial .e-carousel-slide-container {
+    padding: 0 75px;
+  }
+}
+@media screen and (max-width: 320px) {
+  .e-carousel.e-partial .e-carousel-slide-container {
+    padding: 0 50px;
+  }
+}
+.e-carousel.e-partial .e-carousel-items {
+  width: calc(var(--carousel-items-count) * 100%);
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-direction: row;
+      flex-direction: row;
+  transition-property: transform;
+  transition-duration: 0.6s;
+  transition-timing-function: ease-in-out;
+}
+.e-carousel.e-partial .e-carousel-item {
+  height: 100%;
+  overflow: hidden;
+  padding: 0;
+  position: relative;
+  width: calc(100% / var(--carousel-items-count));
+}
+.e-carousel.e-blazor-carousel.e-partial .e-carousel-items {
+  transform: translateX(calc(-100% / var(--carousel-items-count) * (var(--carousel-items-current))));
+  transition: transform 0.6s ease-in-out;
+}
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item {
   backface-visibility: hidden;
   display: none;
   float: left;
@@ -43,16 +78,16 @@
   transition: transform 0.6s ease-in-out;
   width: 100%;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-prev, .e-carousel.e-carousel-slide-animation .e-carousel-item.e-next, .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-prev, .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-next, .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active {
   display: block;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-next:not(.e-transition-start), .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active.e-transition-end {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-next:not(.e-transition-start), .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active.e-transition-end {
   transform: translateX(100%);
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-prev:not(.e-transition-end), .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active.e-transition-start {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-prev:not(.e-transition-end), .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active.e-transition-start {
   transform: translateX(-100%);
 }
-.e-carousel.e-carousel-fade-animation .e-carousel-item {
+.e-carousel.e-carousel-fade-animation:not(.e-partial) .e-carousel-item {
   backface-visibility: hidden;
   display: block;
   float: left;
@@ -64,19 +99,19 @@
   width: 100%;
   z-index: 0;
 }
-.e-carousel.e-carousel-fade-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-fade-animation:not(.e-partial) .e-carousel-item.e-active {
   opacity: 1;
   z-index: 1;
 }
-.e-carousel.e-carousel-animation-none .e-carousel-item {
+.e-carousel.e-carousel-animation-none:not(.e-partial) .e-carousel-item {
   display: none;
   height: 100%;
   width: 100%;
 }
-.e-carousel.e-carousel-animation-none .e-carousel-item.e-active {
+.e-carousel.e-carousel-animation-none:not(.e-partial) .e-carousel-item.e-active {
   display: block;
 }
-.e-carousel.e-carousel-custom-animation .e-carousel-item {
+.e-carousel.e-carousel-custom-animation:not(.e-partial) .e-carousel-item {
   display: block;
   height: 100%;
   left: 0;
@@ -86,7 +121,7 @@
   top: 0;
   width: 100%;
 }
-.e-carousel.e-carousel-custom-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-custom-animation:not(.e-partial) .e-carousel-item.e-active {
   opacity: 1;
   pointer-events: visible;
 }

package/styles/carousel/bootstrap5-dark.css

@@ -25,7 +25,8 @@
   padding: 0;
   position: relative;
 }
-.e-carousel .e-carousel-items {
+.e-carousel .e-carousel-items,
+.e-carousel .e-carousel-slide-container {
   height: 100%;
   margin: 0;
   overflow: hidden;
@@ -33,7 +34,41 @@
   position: relative;
   width: 100%;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item {
+.e-carousel.e-partial .e-carousel-slide-container {
+  padding: 0 100px;
+}
+@media screen and (max-width: 480px) {
+  .e-carousel.e-partial .e-carousel-slide-container {
+    padding: 0 75px;
+  }
+}
+@media screen and (max-width: 320px) {
+  .e-carousel.e-partial .e-carousel-slide-container {
+    padding: 0 50px;
+  }
+}
+.e-carousel.e-partial .e-carousel-items {
+  width: calc(var(--carousel-items-count) * 100%);
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-direction: row;
+      flex-direction: row;
+  transition-property: transform;
+  transition-duration: 0.6s;
+  transition-timing-function: ease-in-out;
+}
+.e-carousel.e-partial .e-carousel-item {
+  height: 100%;
+  overflow: hidden;
+  padding: 0;
+  position: relative;
+  width: calc(100% / var(--carousel-items-count));
+}
+.e-carousel.e-blazor-carousel.e-partial .e-carousel-items {
+  transform: translateX(calc(-100% / var(--carousel-items-count) * (var(--carousel-items-current))));
+  transition: transform 0.6s ease-in-out;
+}
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item {
   backface-visibility: hidden;
   display: none;
   float: left;
@@ -43,16 +78,16 @@
   transition: transform 0.6s ease-in-out;
   width: 100%;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-prev, .e-carousel.e-carousel-slide-animation .e-carousel-item.e-next, .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-prev, .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-next, .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active {
   display: block;
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-next:not(.e-transition-start), .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active.e-transition-end {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-next:not(.e-transition-start), .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active.e-transition-end {
   transform: translateX(100%);
 }
-.e-carousel.e-carousel-slide-animation .e-carousel-item.e-prev:not(.e-transition-end), .e-carousel.e-carousel-slide-animation .e-carousel-item.e-active.e-transition-start {
+.e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-prev:not(.e-transition-end), .e-carousel.e-carousel-slide-animation:not(.e-partial) .e-carousel-item.e-active.e-transition-start {
   transform: translateX(-100%);
 }
-.e-carousel.e-carousel-fade-animation .e-carousel-item {
+.e-carousel.e-carousel-fade-animation:not(.e-partial) .e-carousel-item {
   backface-visibility: hidden;
   display: block;
   float: left;
@@ -64,19 +99,19 @@
   width: 100%;
   z-index: 0;
 }
-.e-carousel.e-carousel-fade-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-fade-animation:not(.e-partial) .e-carousel-item.e-active {
   opacity: 1;
   z-index: 1;
 }
-.e-carousel.e-carousel-animation-none .e-carousel-item {
+.e-carousel.e-carousel-animation-none:not(.e-partial) .e-carousel-item {
   display: none;
   height: 100%;
   width: 100%;
 }
-.e-carousel.e-carousel-animation-none .e-carousel-item.e-active {
+.e-carousel.e-carousel-animation-none:not(.e-partial) .e-carousel-item.e-active {
   display: block;
 }
-.e-carousel.e-carousel-custom-animation .e-carousel-item {
+.e-carousel.e-carousel-custom-animation:not(.e-partial) .e-carousel-item {
   display: block;
   height: 100%;
   left: 0;
@@ -86,7 +121,7 @@
   top: 0;
   width: 100%;
 }
-.e-carousel.e-carousel-custom-animation .e-carousel-item.e-active {
+.e-carousel.e-carousel-custom-animation:not(.e-partial) .e-carousel-item.e-active {
   opacity: 1;
   pointer-events: visible;
 }