@syncfusion/ej2-angular-navigations 20.4.49 → 20.4.51-ngcc

package/styles/carousel/_fabric-definition.scss

@@ -1,22 +0,0 @@
-/*! Carousel component fabric theme definitions and variables */
-
-// COLORS VARIABLES
-$carousel-navigator-btn-bg: transparent !default;
-$carousel-navigator-btn-bg-hover: rgba($neutral-white, .4) !default;
-$carousel-navigator-icon-color: $neutral-white !default;
-$carousel-indicator-bar-bg: $neutral-white !default;
-$carousel-indicator-bar-border: 1px solid rgba($neutral-white, .4) !default;
-$carousel-indicator-bar-bg-active: $theme-primary !default;
-$carousel-indicator-border-color-focus: $neutral-black !default;
-
-// ANIMATION VARIABLES
-$carousel-animation-duration: .6s !default;
-$carousel-animation-timing-function: ease-in-out !default;
-
-// DIMENSION VARIABLES
-$carousel-navigator-btn-border-radius-hover: 50% !default;
-$carousel-indicator-padding: 6px !default;
-$carousel-indicator-height: 48px !default;
-$carousel-indicator-bar-border-radius: 50% !default;
-$carousel-indicator-bar-height: 12px !default;
-$carousel-indicator-bar-width: 12px !default;

package/styles/carousel/_fluent-dark-definition.scss

@@ -1 +0,0 @@
-@import './fluent-definition.scss';

package/styles/carousel/_fluent-definition.scss

@@ -1,22 +0,0 @@
-/*! Carousel component FluentUI theme definitions and variables */
-
-// COLORS VARIABLES
-$carousel-navigator-btn-bg: transparent !default;
-$carousel-navigator-btn-bg-hover: rgba($primary-text-color, .4) !default;
-$carousel-navigator-icon-color: $primary-text-color !default;
-$carousel-indicator-bar-bg: $primary-text-color !default;
-$carousel-indicator-bar-border: 1px solid rgba($primary-text-color, .4) !default;
-$carousel-indicator-bar-bg-active: $primary !default;
-$carousel-indicator-border-color-focus: $black !default;
-
-// ANIMATION VARIABLES
-$carousel-animation-duration: .6s !default;
-$carousel-animation-timing-function: ease-in-out !default;
-
-// DIMENSION VARIABLES
-$carousel-navigator-btn-border-radius-hover: 50% !default;
-$carousel-indicator-padding: 6px !default;
-$carousel-indicator-height: 48px !default;
-$carousel-indicator-bar-border-radius: 50% !default;
-$carousel-indicator-bar-height: 12px !default;
-$carousel-indicator-bar-width: 12px !default;

package/styles/carousel/_fusionnew-definition.scss

@@ -1,22 +0,0 @@
-/*! Carousel component bootstrap5 theme definitions and variables */
-
-// COLORS VARIABLES
-$carousel-navigator-btn-bg: transparent !default;
-$carousel-navigator-btn-bg-hover: rgba($primary-text-color, .4) !default;
-$carousel-navigator-icon-color: $primary-text-color !default;
-$carousel-indicator-bar-bg: $primary-text-color !default;
-$carousel-indicator-bar-border: 1px solid rgba($primary-text-color, .4) !default;
-$carousel-indicator-bar-bg-active: $primary !default;
-$carousel-indicator-border-color-focus: $black !default;
-
-// ANIMATION VARIABLES
-$carousel-animation-duration: .6s !default;
-$carousel-animation-timing-function: ease-in-out !default;
-
-// DIMENSION VARIABLES
-$carousel-navigator-btn-border-radius-hover: 50% !default;
-$carousel-indicator-padding: 4px !default;
-$carousel-indicator-height: 48px !default;
-$carousel-indicator-bar-border-radius: 2px !default;
-$carousel-indicator-bar-height: 5px !default;
-$carousel-indicator-bar-width: 20px !default;

package/styles/carousel/_highcontrast-definition.scss

@@ -1,22 +0,0 @@
-/*! Carousel component highcontrast theme definitions and variables */
-
-// COLORS VARIABLES
-$carousel-navigator-btn-bg: transparent !default;
-$carousel-navigator-btn-bg-hover: rgba($message-font, .4) !default;
-$carousel-navigator-icon-color: $message-font !default;
-$carousel-indicator-bar-bg: $message-font !default;
-$carousel-indicator-bar-border: 1px solid rgba($message-font, .4) !default;
-$carousel-indicator-bar-bg-active: $selection-border !default;
-$carousel-indicator-border-color-focus: $shadow !default;
-
-// ANIMATION VARIABLES
-$carousel-animation-duration: .6s !default;
-$carousel-animation-timing-function: ease-in-out !default;
-
-// DIMENSION VARIABLES
-$carousel-navigator-btn-border-radius-hover: 50% !default;
-$carousel-indicator-padding: 6px !default;
-$carousel-indicator-height: 48px !default;
-$carousel-indicator-bar-border-radius: 50% !default;
-$carousel-indicator-bar-height: 12px !default;
-$carousel-indicator-bar-width: 12px !default;

package/styles/carousel/_highcontrast-light-definition.scss

@@ -1,22 +0,0 @@
-/*! Carousel component highcontrast-light theme definitions and variables */
-
-// COLORS VARIABLES
-$carousel-navigator-btn-bg: transparent !default;
-$carousel-navigator-btn-bg-hover: rgba($selection-font, .4) !default;
-$carousel-navigator-icon-color: $selection-font !default;
-$carousel-indicator-bar-bg: $selection-font !default;
-$carousel-indicator-bar-border: 1px solid rgba($selection-font, .4) !default;
-$carousel-indicator-bar-bg-active: $selection-border !default;
-$carousel-indicator-border-color-focus: $message-font !default;
-
-// ANIMATION VARIABLES
-$carousel-animation-duration: .6s !default;
-$carousel-animation-timing-function: ease-in-out !default;
-
-// DIMENSION VARIABLES
-$carousel-navigator-btn-border-radius-hover: 50% !default;
-$carousel-indicator-padding: 6px !default;
-$carousel-indicator-height: 48px !default;
-$carousel-indicator-bar-border-radius: 50% !default;
-$carousel-indicator-bar-height: 12px !default;
-$carousel-indicator-bar-width: 12px !default;

package/styles/carousel/_layout.scss

@@ -1,218 +0,0 @@
-@include export-module('carousel-layout') {
-
-  /*! carousel component styles */
-  .e-carousel {
-    display: block;
-    margin: 0;
-    padding: 0;
-    position: relative;
-
-    .e-carousel-items,
-    .e-carousel-slide-container {
-      height: 100%;
-      margin: 0;
-      overflow: hidden;
-      padding: 0;
-      position: relative;
-      width: 100%;
-    }
-
-    &.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;
-        float: left;
-        height: 100%;
-        margin-right: -100%;
-        position: relative;
-        transition: transform $carousel-animation-duration $carousel-animation-timing-function;
-        width: 100%;
-
-        &.e-prev,
-        &.e-next,
-        &.e-active {
-          display: block;
-        }
-
-        &.e-next:not(.e-transition-start),
-        &.e-active.e-transition-end {
-          transform: translateX(100%);
-        }
-
-        &.e-prev:not(.e-transition-end),
-        &.e-active.e-transition-start {
-          transform: translateX(-100%);
-        }
-      }
-    }
-
-    &.e-carousel-fade-animation:not(.e-partial) {
-      .e-carousel-item {
-        backface-visibility: hidden;
-        display: block;
-        float: left;
-        height: 100%;
-        margin-right: -100%;
-        opacity: 0;
-        position: relative;
-        transition: opacity $carousel-animation-duration $carousel-animation-timing-function;
-        width: 100%;
-        z-index: 0;
-
-        &.e-active {
-          opacity: 1;
-          z-index: 1;
-        }
-      }
-    }
-
-    &.e-carousel-animation-none:not(.e-partial) {
-      .e-carousel-item {
-        display: none;
-        height: 100%;
-        width: 100%;
-
-        &.e-active {
-          display: block;
-        }
-      }
-    }
-
-    &.e-carousel-custom-animation:not(.e-partial) {
-      .e-carousel-item {
-        display: block;
-        height: 100%;
-        left: 0;
-        opacity: 0;
-        pointer-events: none;
-        position: absolute;
-        top: 0;
-        width: 100%;
-
-        &.e-active {
-          opacity: 1;
-          pointer-events: visible;
-        }
-      }
-    }
-
-    .e-carousel-navigators {
-      align-items: center;
-      display: flex;
-      height: 100%;
-      justify-content: space-between;
-      pointer-events: none;
-      position: absolute;
-      top: 0;
-      width: 100%;
-      z-index: 1;
-
-      .e-play-pause,
-      .e-previous,
-      .e-next {
-        padding: .5em;
-        pointer-events: auto;
-
-        .e-btn {
-          border: 0;
-          box-shadow: none;
-
-          &:hover {
-            border-radius: $carousel-navigator-btn-border-radius-hover;
-          }
-
-          &.e-rtl {
-            transform: rotate(180deg);
-          }
-        }
-
-        &.e-hover-arrows {
-          display: none;
-        }
-      }
-    }
-
-    .e-carousel-indicators {
-      align-items: center;
-      bottom: 0;
-      display: flex;
-      justify-content: center;
-      min-height: $carousel-indicator-height;
-      padding: 0;
-      pointer-events: none;
-      position: absolute;
-      width: 100%;
-      z-index: 1;
-
-      .e-indicator-bars {
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: center;
-        pointer-events: auto;
-
-        .e-indicator-bar {
-          padding: 0;
-
-          .e-indicator {
-            align-items: center;
-            display: flex;
-            justify-content: center;
-            padding: $carousel-indicator-padding;
-          }
-
-          .e-indicator div {
-            border: $carousel-indicator-bar-border;
-            border-radius: $carousel-indicator-bar-border-radius;
-            height: $carousel-indicator-bar-height;
-            transition-duration: $carousel-animation-duration;
-            transition-property: background-color, border-color;
-            transition-timing-function: $carousel-animation-timing-function;
-            width: $carousel-indicator-bar-width;
-          }
-
-          .e-indicator .e-ripple-element {
-            display: none;
-          }
-        }
-      }
-    }
-  }
-}

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

@@ -1,22 +0,0 @@
-/*! Carousel component material-dark theme definitions and variables */
-
-// COLORS VARIABLES
-$carousel-navigator-btn-bg: transparent !default;
-$carousel-navigator-btn-bg-hover: rgba($grey-white, .4) !default;
-$carousel-navigator-icon-color: $grey-white !default;
-$carousel-indicator-bar-bg: $grey-white !default;
-$carousel-indicator-bar-border: 1px solid rgba($grey-white, .4) !default;
-$carousel-indicator-bar-bg-active: $accent !default;
-$carousel-indicator-border-color-focus: $grey-black !default;
-
-// ANIMATION VARIABLES
-$carousel-animation-duration: .6s !default;
-$carousel-animation-timing-function: ease-in-out !default;
-
-// DIMENSION VARIABLES
-$carousel-navigator-btn-border-radius-hover: 50% !default;
-$carousel-indicator-padding: 6px !default;
-$carousel-indicator-height: 48px !default;
-$carousel-indicator-bar-border-radius: 50% !default;
-$carousel-indicator-bar-height: 12px !default;
-$carousel-indicator-bar-width: 12px !default;

package/styles/carousel/_material-definition.scss

@@ -1,22 +0,0 @@
-/*! Carousel component material theme definitions and variables */
-
-// COLORS VARIABLES
-$carousel-navigator-btn-bg: transparent !default;
-$carousel-navigator-btn-bg-hover: rgba($grey-white, .4) !default;
-$carousel-navigator-icon-color: $grey-white !default;
-$carousel-indicator-bar-bg: $grey-white !default;
-$carousel-indicator-bar-border: 1px solid rgba($grey-white, .4) !default;
-$carousel-indicator-bar-bg-active: $accent !default;
-$carousel-indicator-border-color-focus: $grey-black !default;
-
-// ANIMATION VARIABLES
-$carousel-animation-duration: .6s !default;
-$carousel-animation-timing-function: ease-in-out !default;
-
-// DIMENSION VARIABLES
-$carousel-navigator-btn-border-radius-hover: 50% !default;
-$carousel-indicator-padding: 6px !default;
-$carousel-indicator-height: 48px !default;
-$carousel-indicator-bar-border-radius: 50% !default;
-$carousel-indicator-bar-height: 12px !default;
-$carousel-indicator-bar-width: 12px !default;

package/styles/carousel/_material3-definition.scss

@@ -1,22 +0,0 @@
-/*! Carousel component bootstrap5 theme definitions and variables */
-
-// COLORS VARIABLES
-$carousel-navigator-btn-bg: transparent !default;
-$carousel-navigator-btn-bg-hover: rgba($primary-text-color, .4) !default;
-$carousel-navigator-icon-color: $primary-text-color !default;
-$carousel-indicator-bar-bg: $primary-text-color !default;
-$carousel-indicator-bar-border: 1px solid rgba($primary-text-color, .4) !default;
-$carousel-indicator-bar-bg-active: $primary !default;
-$carousel-indicator-border-color-focus: $black !default;
-
-// ANIMATION VARIABLES
-$carousel-animation-duration: .6s !default;
-$carousel-animation-timing-function: ease-in-out !default;
-
-// DIMENSION VARIABLES
-$carousel-navigator-btn-border-radius-hover: 50% !default;
-$carousel-indicator-padding: 4px !default;
-$carousel-indicator-height: 48px !default;
-$carousel-indicator-bar-border-radius: 2px !default;
-$carousel-indicator-bar-height: 5px !default;
-$carousel-indicator-bar-width: 20px !default;

package/styles/carousel/_tailwind-dark-definition.scss

@@ -1 +0,0 @@
-@import './tailwind-definition.scss';

package/styles/carousel/_tailwind-definition.scss

@@ -1,22 +0,0 @@
-/*! Carousel component tailwind theme definitions and variables */
-
-// COLORS VARIABLES
-$carousel-navigator-btn-bg: transparent !default;
-$carousel-navigator-btn-bg-hover: rgba($white, .4) !default;
-$carousel-navigator-icon-color: $white !default;
-$carousel-indicator-bar-bg: $white !default;
-$carousel-indicator-bar-border: 1px solid rgba($white, .4) !default;
-$carousel-indicator-bar-bg-active: $primary !default;
-$carousel-indicator-border-color-focus: $black !default;
-
-// ANIMATION VARIABLES
-$carousel-animation-duration: .6s !default;
-$carousel-animation-timing-function: ease-in-out !default;
-
-// DIMENSION VARIABLES
-$carousel-navigator-btn-border-radius-hover: 50% !default;
-$carousel-indicator-padding: 6px !default;
-$carousel-indicator-height: 48px !default;
-$carousel-indicator-bar-border-radius: 50% !default;
-$carousel-indicator-bar-height: 12px !default;
-$carousel-indicator-bar-width: 12px !default;

package/styles/carousel/_theme.scss

@@ -1,56 +0,0 @@
-@include export-module('carousel-theme') {
-
-  /*! carousel component theme */
-  .e-carousel {
-    .e-carousel-navigators {
-
-      .e-previous .e-btn:not(:disabled),
-      .e-next .e-btn:not(:disabled),
-      .e-play-pause .e-btn:not(:disabled) {
-        background-color: $carousel-navigator-btn-bg;
-
-        .e-btn-icon {
-          color: $carousel-navigator-icon-color;
-        }
-
-        &:active,
-        &:focus,
-        &:hover {
-          background-color: $carousel-navigator-btn-bg-hover;
-          outline: none;
-        }
-      }
-    }
-
-    .e-carousel-indicators .e-indicator-bar {
-      .e-indicator {
-        background-color: transparent;
-        border-color: transparent;
-        box-shadow: none;
-
-        div {
-          background-color: $carousel-indicator-bar-bg;
-          border-color: $carousel-indicator-bar-bg;
-        }
-
-        &:active,
-        &:focus,
-        &:hover {
-          background-color: transparent;
-          border-color: transparent;
-          box-shadow: none;
-          outline: none;
-        }
-
-        &:focus-visible {
-          border-color: $carousel-indicator-border-color-focus;
-        }
-      }
-
-      &.e-active .e-indicator div {
-        background-color: $carousel-indicator-bar-bg-active;
-        border-color: $carousel-indicator-bar-bg-active;
-      }
-    }
-  }
-}

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

@@ -1,30 +0,0 @@
-@include export-module('carousel-bootstrap-icons') {
-  .e-carousel {
-
-    .e-previous-icon::before {
-      content: '\e904';
-    }
-
-    .e-next-icon::before {
-      content: '\e826';
-    }
-
-    .e-play-icon::before {
-      content: '\e328';
-    }
-
-    .e-pause-icon::before {
-      content: '\e329';
-    }
-
-    &.e-rtl {
-      .e-previous-icon::before {
-        content: '\e826';
-      }
-
-      .e-next-icon::before {
-        content: '\e904';
-      }
-    }
-  }
-}

package/styles/carousel/icons/_bootstrap.scss

@@ -1,30 +0,0 @@
-@include export-module('carousel-bootstrap-icons') {
-  .e-carousel {
-
-    .e-previous-icon::before {
-      content: '\e904';
-    }
-
-    .e-next-icon::before {
-      content: '\e826';
-    }
-
-    .e-play-icon::before {
-      content: '\e328';
-    }
-
-    .e-pause-icon::before {
-      content: '\e329';
-    }
-
-    &.e-rtl {
-      .e-previous-icon::before {
-        content: '\e826';
-      }
-
-      .e-next-icon::before {
-        content: '\e904';
-      }
-    }
-  }
-}

package/styles/carousel/icons/_bootstrap4.scss

@@ -1,30 +0,0 @@
-@include export-module('carousel-bootstrap4-icons') {
-  .e-carousel {
-
-    .e-previous-icon::before {
-      content: '\e70d';
-    }
-
-    .e-next-icon::before {
-      content: '\e76a';
-    }
-
-    .e-play-icon::before {
-      content: '\e72d';
-    }
-
-    .e-pause-icon::before {
-      content: '\e757';
-    }
-
-    &.e-rtl {
-      .e-previous-icon::before {
-        content: '\e76a';
-      }
-
-      .e-next-icon::before {
-        content: '\e70d';
-      }
-    }
-  }
-}

package/styles/carousel/icons/_bootstrap5-dark.scss

@@ -1 +0,0 @@
-@import './bootstrap5.scss';

package/styles/carousel/icons/_bootstrap5.scss

@@ -1,30 +0,0 @@
-@include export-module('carousel-bootstrap5-icons') {
-  .e-carousel {
-
-    .e-previous-icon::before {
-      content: '\e765';
-    }
-
-    .e-next-icon::before {
-      content: '\e748';
-    }
-
-    .e-play-icon::before {
-      content: '\e70c';
-    }
-
-    .e-pause-icon::before {
-      content: '\e77b';
-    }
-
-    &.e-rtl {
-      .e-previous-icon::before {
-        content: '\e748';
-      }
-
-      .e-next-icon::before {
-        content: '\e765';
-      }
-    }
-  }
-}

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

@@ -1,30 +0,0 @@
-@include export-module('carousel-fabric-icons') {
-  .e-carousel {
-
-    .e-previous-icon::before {
-      content: '\e654';
-    }
-
-    .e-next-icon::before {
-      content: '\e219';
-    }
-
-    .e-play-icon::before {
-      content: '\e327';
-    }
-
-    .e-pause-icon::before {
-      content: '\e325';
-    }
-
-    &.e-rtl {
-      .e-previous-icon::before {
-        content: '\e219';
-      }
-
-      .e-next-icon::before {
-        content: '\e654';
-      }
-    }
-  }
-}

package/styles/carousel/icons/_fabric.scss

@@ -1,30 +0,0 @@
-@include export-module('carousel-fabric-icons') {
-  .e-carousel {
-
-    .e-previous-icon::before {
-      content: '\e654';
-    }
-
-    .e-next-icon::before {
-      content: '\e219';
-    }
-
-    .e-play-icon::before {
-      content: '\e327';
-    }
-
-    .e-pause-icon::before {
-      content: '\e325';
-    }
-
-    &.e-rtl {
-      .e-previous-icon::before {
-        content: '\e219';
-      }
-
-      .e-next-icon::before {
-        content: '\e654';
-      }
-    }
-  }
-}

package/styles/carousel/icons/_fluent-dark.scss

@@ -1 +0,0 @@
-@import './fluent.scss';