@syncfusion/ej2-angular-navigations 22.1.34-ngcc → 22.1.34

package/styles/accordion/_tailwind-definition.scss

@@ -0,0 +1,180 @@
+//default
+/*! component's theme wise override tailwind-definitions and variables */
+$acrdn-skin: 'tailwind' !default;
+$acrdn-slct-header-font-weight: $font-weight-medium;
+
+$acrdn-nrml-header-minheight: 38px !default;
+$acrdn-bgr-header-minheight: 48px !default;
+$acrdn-nrml-header-lineheight: 22px !default;
+$acrdn-bgr-header-lineheight: 24px !default;
+$acrdn-nrml-header-paddingpix: 16px !default;
+$acrdn-bgr-header-paddingpix: 16px !default;
+$acrdn-icon-font-size: $text-lg !default;
+$acrdn-content-line-height: 1.5 !default;
+$acrdn-tab-highlight-color:  rgba(0, 0, 0, 0) !default;
+
+$acrdn-item-hdr-con-lineheight: 22px !default;
+$acrdn-item-selected-first-child-border-top: 1px none $border-light !default;
+$acrdn-item-selected-last-child-border-bottom: 1px solid $border-light !default;
+$acrdn-item-border-radius: 4px 4px 0 0 !default;
+$acrdn-item-margin-top: 0 !default;
+$acrdn-item-nested-panel-item-select-margin: 0 !default;
+$acrdn-item-overflow: hidden !default;
+$acrdn-item-hover-focus-hdr-con-text-decoration: none !default;
+$acrdn-item-hdr-border-radius: 0 !default;
+$acrdn-item-tgl-icon-display: table !default;
+$acrdn-item-arrow-icon-font-size: $text-lg !default;
+$acrdn-opacity: .5 !default;
+
+// Header, Nested header and RTL mode Padding
+$acrdn-nest-nrml-header-padding: 8px 0 8px 26px !default;
+$acrdn-nest-bgr-header-padding: 12px 0 12px 28px !default;
+$acrdn-nest-second-nrml-header-padding: 8px 0 8px 38px !default;
+$acrdn-nest-second-bgr-header-padding: 12px 0 12px 40px !default;
+$acrdn-nrml-header-padding: 8px 12px !default;
+$acrdn-bgr-header-padding: 12px 16px !default;
+$acrdn-rtl-nrml-header-padding: 7px 12px !default;
+$acrdn-rtl-bgr-header-padding: 11px 17px !default;
+$acrdn-rtl-nest-nrml-header-padding: 8px 26px 8px 0 !default;
+$acrdn-rtl-nest-bgr-header-padding: 12px 28px 12px 0 !default;
+$acrdn-rtl-nest-second-nrml-header-padding: 8px 38px 8px 0 !default;
+$acrdn-rtl-nest-second-bgr-header-padding: 12px 40px 12px 0 !default;
+$acrdn-nested-item-header-focus-box-shadow: none !default;
+
+// Content, Nested content and RTL mode Padding
+$acrdn-nrml-content-padding: 12px !default;
+$acrdn-bgr-content-padding: 16px !default;
+$acrdn-nest-nrml-content-padding: 16px 16px 16px 26px !default;
+$acrdn-nest-bgr-content-padding: 20px 20px 20px 28px !default;
+$acrdn-nest-second-nrml-content-padding: 20px 20px 20px 38px !default;
+$acrdn-nest-second-bgr-content-padding: 24px 24px 24px 40px !default;
+$acrdn-rtl-nest-nrml-content-padding: 16px 26px 16px 16px !default;
+$acrdn-rtl-nest-bgr-content-padding: 20px 28px 20px 20px !default;
+$acrdn-rtl-nest-second-nrml-content-padding: 20px 38px 20px 20px !default;
+$acrdn-rtl-nest-second-bgr-content-padding: 24px 40px 24px 24px !default;
+
+$acrdn-nrml-header-icon-padding: 8px !default;
+$acrdn-bgr-header-icon-padding: 12px !default;
+$acrdn-nrml-icn-minwidth: 22px !default;
+$acrdn-bgr-icn-minwidth: 24px !default;
+$acrdn-active-bg: $content-bg-color !default;
+$acrdn-bg-color: $content-bg-color-alt1 !default;
+$acrdn-default-bg-color: $acrdn-bg-color !default;
+$acrdn-active-bg-color: $acrdn-active-bg !default;
+$acrdn-selected-header-font-color: $primary !default;
+$acrdn-selected-header-color: $content-bg-color !default;
+$acrdn-icon-color: $icon-color !default;
+$acrdn-selected-icon-color: $primary !default;
+$acrdn-content-color: $content-text-color !default;
+$acrdn-header-font: $content-text-color !default;
+$acrdn-nested-header-font: $content-text-color !default;
+$acrdn-header-font-weight: $font-weight-medium !default;
+$acrdn-header-font-size: $text-sm !default;
+$acrdn-nest-header-font-size: $text-sm !default;
+$acrdn-nest-header-content-font-size: $acrdn-nest-header-font-size !default;
+$acrdn-nest-header-content-font-weight: $font-weight-normal !default;
+$acrdn-content-font-size: $text-sm !default;
+$acrdn-header-font-bgr-size: $text-base !default;
+$acrdn-content-font-bgr-size: $text-base !default;
+$acrdn-selected-border-size: 1px !default;
+$acrdn-item-padding-size: 0 !default;
+$acrdn-selected-border-type: none !default;
+$acrdn-selected-border-color: $border-light !default;
+$acrdn-default-border: $acrdn-selected-border-color !default;
+$acrdn-header-focus-bg: $content-bg-color-focus !default;
+$acrdn-header-hover-bg: $content-bg-color-hover !default;
+$acrdn-header-active-bg: $content-bg-color-pressed !default;
+
+$acrdn-border-type: solid !default;
+$acrdn-border-size: 1px !default;
+$acrdn-border-radius: 0 !default;
+$acrdn-bgr-arrow-icon-font-size: $text-xl;
+$acrdn-bgr-item-header-content-font-size: $text-base !default;
+$acrdn-icon-font-size: $text-lg !default;
+$acrdn-item-icon-disable-color: $icon-color-disabled;
+$acrdn-text-disable-color: $content-text-color-disabled;
+
+$acrdn-item-border-color: $acrdn-default-border !default;
+$acrdn-item-border-nav-type: solid !default;
+$acrdn-item-border-size: 0 0 1px 0 !default;
+$acrdn-item-select-last-child-border-bottom: 0 !default;
+$acrdn-item-select-last-child-border-radius: 0 0 4px 4px !default;
+$acrdn-item-first-child-hdr-focus-border-radius: 0 !default;
+$acrdn-item-last-child-border-bottom: 1px solid $acrdn-default-border !default;
+$acrdn-item-last-child-not-exp-hdr-focus-border-radius: 0 !default;
+$acrdn-item-focus-border-color: $acrdn-default-border !default;
+$acrdn-item-focus-border-size: 0 0 1px 0 !default;
+$acrdn-item-focus-selected-exp-border-top: 1px none $acrdn-default-border !default;
+$acrdn-item-focus-selected-exp-hdr-focus-border-color: $acrdn-default-border !default;
+$acrdn-item-focus-selected-exp-hdr-focus-border-type: solid !default;
+$acrdn-item-focus-selected-exp-hdr-focus-border-size: 0 !default;
+$acrdn-item-focus-exp-hdr-hover-focus-bg-color: $content-bg-color-hover !default;
+$acrdn-item-focus-exp-hdr-hover-focus-color:$acrdn-selected-header-font-color !default;
+$acrdn-item-focus-selected-hdr-icons-font: $acrdn-selected-icon-color !default;
+$acrdn-item-focus-exp-hdricon-hover-font: $acrdn-selected-header-font-color !default;
+$acrdn-item-focus-selected-exp-border-color: $acrdn-default-border !default;
+$acrdn-item-exp-select-border-color: $acrdn-default-border !default;
+$acrdn-item-exp-select-border-size: 0 0 1px 0 !default;
+$acrdn-item-header-border: 0 !default;
+$acrdn-item-select-exp-hdr-con-disable-font: $content-text-color-disabled !default;
+$acrdn-item-header-content-disable-color: $content-text-color !default;
+$acrdn-item-hdr-con-text-disabled-font: $content-text-color-disabled !default;
+$acrdn-item-selected-exp-hdr-focus-border-color: $acrdn-default-border !default;
+$acrdn-item-selected-exp-hdr-focus-border-type: solid !default;
+$acrdn-item-selected-exp-hdr-focus-border-size: 0 !default;
+$acrdn-item-selected-exp-hdr-focus-bg: $content-bg-color-focus !default;
+$acrdn-item-selected-exp-hdr-hover-bg: $content-bg-color !default;
+$acrdn-item-selected-exp-hdr-active-bg: $content-bg-color !default;
+$acrdn-item-nes-pan-con-last-child-border-bottom: 1px none $acrdn-selected-border-color !default;
+$acrdn-item-select-bg: none !default;
+$acrdn-item-select-border-color: $acrdn-selected-border-color !default;
+$acrdn-item-select-border-size: 0 0 1px 0 !default;
+$acrdn-item-panel-content-select-bg: none !default;
+$acrdn-item-panel-content-select-border-top: 0 !default;
+$acrdn-item-panel-content-select-border-bottom: 0 !default;
+$acrdn-item-header-hover-border: 0 !default;
+$acrdn-item-header-hover-bg: $content-bg-color-focus !default;
+$acrdn-item-header-hover-border-color: initial !default;
+$acrdn-item-header-active-border: 0 !default;
+$acrdn-item-header-active-border-color: initial !default;
+$acrdn-item-header-focus-border: 0 !default;
+$acrdn-item-header-focus-box-shadow: none !default;
+$acrdn-item-header-focus-bg: $content-bg-color-focus !default;
+$acrdn-item-header-focus-active-color: $content-text-color !default;
+$acrdn-item-select-exp-hdr-hover-color: $content-text-color !default;
+$acrdn-item-selected-exp-hdr-border-color: initial !default;
+$acrdn-item-selected-exp-hdr-border-size: 0 !default;
+$acrdn-item-selected-exp-hdr-bg: $content-bg-color !default;
+$acrdn-item-selected-exp-hdr-hover-color: $primary !default;
+$acrdn-item-selected-exp-hdr-hover-focus-color: $primary !default;
+$acrdn-item-selected-exp-hdr-icon-color: $primary !default;
+$acrdn-item-selected-exp-hdr-hover-border-color: initial !default;
+$acrdn-item-selected-tgl-icon-color: $primary !default;
+$acrdn-item-selected-hdr-font: $primary !default;
+$acrdn-item-select-hdr-focus-border-color: $acrdn-selected-border-color !default;
+$acrdn-item-selected-border-color: $acrdn-selected-border-color !default;
+$acrdn-item-selected-border-size: 0 0 1px 0 !default;
+$acrdn-item-selected-select-last-border-bottom: 1px none $acrdn-selected-border-color !default;
+$acrdn-item-selected-selected-border-color: $acrdn-selected-border-color !default;
+$acrdn-item-selected-selected-border-size: 0 0 1px 0 !default;
+$acrdn-item-selected-header-background: none !default;
+$acrdn-item-selected-hdr-border-color: initial !default;
+$acrdn-item-selected-hdr-border-size: 0 !default;
+$acrdn-item-selected-header-border-radius: 0 !default;
+$acrdn-item-selected-hdr-con-font: $content-text-color !default;
+$acrdn-item-selected-select-border-color: $acrdn-selected-border-color !default;
+$acrdn-item-selected-select-border-size: 0 0 1px 0 !default;
+$acrdn-item-selected-hdr-icon-font: $icon-color !default;
+$acrdn-item-selected-exp-hdr-con-hover-color: $primary !default;
+$acrdn-item-selected-exp-hdr-icon-hover-color: $primary !default;
+$acrdn-item-selected-select-active-bg: $content-bg-color !default;
+$acrdn-item-nes-pan-exp-hdr-color: $primary !default;
+$acrdn-item-selected-hdr-hover-border-color: initial !default;
+$acrdn-item-selected-hdr-tgl-icon-hover-font: $icon-color !default;
+$acrdn-item-nes-selected-exp-hover-hdr-icons-font: $primary !default;
+$acrdn-item-nes-selected-exp-hover-hdr-con-font: $primary !default;
+$acrdn-item-exp-not-selected-hdr-focus-bg: $content-bg-color-focus !default;
+$acrdn-item-exp-not-selected-hdr-focus-border: 0 !default;
+$acrdn-item-exp-not-selected-hdr-focus-border-color: initial !default;
+
+//enddefault

package/styles/accordion/_theme.scss

@@ -0,0 +1,397 @@
+@include export-module('accordion-theme') {
+
+  /*! accordion theme */
+  /* stylelint-disable property-no-vendor-prefix */
+  .e-accordion {
+    -webkit-tap-highlight-color: $acrdn-tab-highlight-color;
+    background: $acrdn-default-bg-color;
+    border: $acrdn-border-size $acrdn-border-type $acrdn-default-border;
+    border-radius: $acrdn-border-radius;
+
+    .e-acrdn-item {
+      border-color: $acrdn-item-border-color;
+      border-style: $acrdn-item-border-nav-type;
+      border-width: $acrdn-item-border-size;
+      border-radius: $acrdn-item-border-radius;
+
+      &.e-active {
+        background: $acrdn-active-bg-color;
+      }
+
+      &.e-select:last-child {
+        border-bottom: $acrdn-item-select-last-child-border-bottom;
+        border-radius: $acrdn-item-select-last-child-border-radius;
+      }
+
+      &:first-child .e-acrdn-header:focus {
+        border-radius: $acrdn-item-first-child-hdr-focus-border-radius;
+      }
+
+      @if ($skin-name == 'Material3') {
+        &:first-child.e-selected.e-select > .e-acrdn-header:focus {
+          border-radius: $acrdn-item-first-child-hdr-focus-border-radius;
+        }
+      }
+
+      &:last-child {
+        border-bottom: $acrdn-item-last-child-border-bottom;
+
+        &:not(.e-expand-state) .e-acrdn-header:focus {
+          border-radius: $acrdn-item-last-child-not-exp-hdr-focus-border-radius;
+        }
+
+        &.e-selected .e-acrdn-header:focus {
+          border-radius: $acrdn-item-hdr-border-radius;
+        }
+      }
+
+      &.e-item-focus {
+        border-color: $acrdn-item-focus-border-color;
+        border-style: $acrdn-item-border-nav-type;
+        border-width: $acrdn-item-focus-border-size;
+      }
+
+      &.e-item-focus.e-select.e-selected.e-expand-state {
+        border-top: $acrdn-item-focus-selected-exp-border-top;
+
+        .e-acrdn-header:focus {
+          border-color: $acrdn-item-focus-selected-exp-hdr-focus-border-color;
+          border-style: $acrdn-item-focus-selected-exp-hdr-focus-border-type;
+          border-width: $acrdn-item-focus-selected-exp-hdr-focus-border-size;
+        }
+
+        .e-acrdn-header:hover:focus {
+          background: $acrdn-item-focus-exp-hdr-hover-focus-bg-color;
+
+          .e-acrdn-header-content {
+            color: $acrdn-item-focus-exp-hdr-hover-focus-color;
+          }
+
+          .e-icons {
+            color: $acrdn-item-focus-selected-hdr-icons-font;
+          }
+
+          .e-acrdn-header-icon .e-icons {
+            color: $acrdn-item-focus-exp-hdricon-hover-font;
+          }
+        }
+      }
+
+      &.e-item-focus.e-expand-state.e-select,
+      &.e-item-focus.e-select.e-selected.e-expand-state  {
+        border-color: $acrdn-item-focus-selected-exp-border-color;
+      }
+
+      &.e-expand-state.e-select {
+        border-color: $acrdn-item-exp-select-border-color;
+        border-style: $acrdn-item-border-nav-type;
+        border-width: $acrdn-item-exp-select-border-size;
+      }
+
+      .e-acrdn-header {
+        border: $acrdn-item-header-border;
+      }
+
+      &.e-overlay.e-select.e-expand-state {
+        .e-acrdn-header {
+          .e-icons,
+          .e-acrdn-header-content {
+            color: $acrdn-item-select-exp-hdr-con-disable-font;
+          }
+        }
+      }
+
+      &.e-overlay {
+        background: $acrdn-bg-color;
+        opacity: $acrdn-opacity;
+
+        .e-acrdn-header {
+
+          .e-icons,
+          .e-acrdn-header-content {
+            color: $acrdn-item-header-content-disable-color;
+          }
+        }
+
+        &.e-overlay.e-select.e-expand-state {
+          .e-acrdn-header {
+
+            .e-icons {
+              color: $acrdn-item-icon-disable-color;
+            }
+
+            .e-acrdn-header-content {
+              color: $acrdn-item-hdr-con-text-disabled-font;
+            }
+          }
+        }
+      }
+
+      &.e-selected.e-select.e-expand-state > .e-acrdn-header {
+
+        &:focus {
+          border-color: $acrdn-item-selected-exp-hdr-focus-border-color;
+          border-style: $acrdn-item-selected-exp-hdr-focus-border-type;
+          border-width: $acrdn-item-selected-exp-hdr-focus-border-size;
+          background: $acrdn-item-selected-exp-hdr-focus-bg;
+        }
+
+        &:hover {
+          background: $acrdn-item-selected-exp-hdr-hover-bg;
+        }
+
+        &:active {
+          background: $acrdn-item-selected-exp-hdr-active-bg;
+        }
+      }
+
+      .e-acrdn-panel.e-nested {
+
+        .e-acrdn-item.e-select {
+          &.e-selected.e-expand-state > .e-acrdn-header,
+          &.e-expand-state > .e-acrdn-header {
+            .e-acrdn-header-content {
+              color: $acrdn-item-nes-pan-exp-hdr-color;
+            }
+          }
+        }
+
+        .e-acrdn-content .e-acrdn-item:last-child {
+          border-bottom: $acrdn-item-nes-pan-con-last-child-border-bottom;
+        }
+
+        .e-acrdn-header .e-acrdn-header-content {
+          color: $acrdn-header-font;
+        }
+      }
+
+      &.e-select {
+        background: $acrdn-item-select-bg;
+        border-color: $acrdn-item-select-border-color;
+        border-style: $acrdn-item-border-nav-type;
+        border-width: $acrdn-item-select-border-size;
+
+        .e-acrdn-panel .e-acrdn-content {
+          color: $acrdn-content-color;
+          background: $acrdn-item-panel-content-select-bg;
+          border-top: $acrdn-item-panel-content-select-border-top;
+          border-bottom: $acrdn-item-panel-content-select-border-bottom;
+        }
+      }
+
+      .e-acrdn-header {
+
+        .e-acrdn-header-content {
+          color: $acrdn-header-font;
+        }
+
+        .e-acrdn-header-icon {
+          color: $acrdn-icon-color;
+        }
+      }
+
+      &.e-expand-state.e-select:not(.e-selected) > .e-acrdn-header {
+
+        &:focus {
+          background: $acrdn-item-exp-not-selected-hdr-focus-bg;
+          border: $acrdn-item-exp-not-selected-hdr-focus-border;
+          border-color: $acrdn-item-exp-not-selected-hdr-focus-border-color;
+        }
+      }
+
+      .e-acrdn-header {
+
+        &:hover {
+          border: $acrdn-item-header-hover-border;
+          background: $acrdn-item-header-hover-bg;
+          border-color: $acrdn-item-header-hover-border-color;
+        }
+
+        &:active {
+          border: $acrdn-item-header-active-border;
+          border-color: $acrdn-item-header-active-border-color;
+          background: $acrdn-header-active-bg;
+        }
+
+        &:focus {
+          border: $acrdn-item-header-focus-border;
+          box-shadow: $acrdn-item-header-focus-box-shadow;
+          background: $acrdn-item-header-focus-bg;
+
+          &:active {
+
+            .e-icons,
+            .e-acrdn-header-content,
+            .e-toggle-icon {
+              color: $acrdn-item-header-focus-active-color;
+            }
+          }
+        }
+      }
+
+      &.e-select {
+
+        &.e-acrdn-item > .e-acrdn-header {
+          &:hover {
+            .e-acrdn-header-content {
+              color: $acrdn-item-select-exp-hdr-hover-color;
+            }
+
+            .e-icons {
+              color: $acrdn-item-selected-hdr-icon-font;
+            }
+
+            .e-toggle-icon .e-icons.e-tgl-collapse-icon {
+              color: $acrdn-item-selected-hdr-tgl-icon-hover-font;
+            }
+
+            &:focus .e-icons,
+            &:focus .e-acrdn-header-content {
+              color: $acrdn-item-header-focus-active-color;
+            }
+          }
+        }
+
+        &.e-selected.e-expand-state > .e-acrdn-header,
+        &.e-expand-state > .e-acrdn-header {
+          border-color: $acrdn-item-selected-exp-hdr-border-color;
+          border-style: $acrdn-item-border-nav-type;
+          border-width: $acrdn-item-selected-exp-hdr-border-size;
+          background: $acrdn-item-selected-exp-hdr-bg;
+
+          &:hover {
+            .e-icons {
+              color: $acrdn-item-selected-exp-hdr-hover-color;
+            }
+
+            .e-acrdn-header-icon .e-icons {
+              color: $acrdn-item-selected-exp-hdr-icon-hover-color;
+            }
+
+            .e-acrdn-header-content {
+              color: $acrdn-item-selected-exp-hdr-con-hover-color;
+            }
+
+            &:focus .e-icons,
+            &:focus .e-acrdn-header-content {
+              color: $acrdn-item-selected-exp-hdr-hover-focus-color;
+            }
+          }
+
+          .e-acrdn-header-icon {
+            color: $acrdn-item-selected-exp-hdr-icon-color;
+          }
+
+          &:hover {
+            border-color: $acrdn-item-selected-exp-hdr-hover-border-color;
+          }
+
+          > .e-toggle-icon {
+            color: $acrdn-item-selected-tgl-icon-color;
+          }
+
+          .e-acrdn-header-icon,
+          .e-acrdn-header-content {
+            color: $acrdn-item-selected-hdr-font;
+          }
+        }
+      }
+
+      &.e-select {
+        &.e-item-focus {
+          border-color: $acrdn-item-select-hdr-focus-border-color;
+        }
+      }
+
+      &.e-selected {
+        border-color: $acrdn-item-selected-border-color;
+        border-style: $acrdn-item-border-nav-type;
+        border-width: $acrdn-item-selected-border-size;
+
+        &.e-select {
+          border-color: $acrdn-item-selected-select-border-color;
+          border-style: $acrdn-item-border-nav-type;
+          border-width: $acrdn-item-selected-select-border-size;
+
+          &.e-active {
+            background: $acrdn-item-selected-select-active-bg;
+          }
+
+          &.e-select:last-child {
+            border-bottom: $acrdn-item-selected-select-last-border-bottom;
+          }
+        }
+
+        > .e-acrdn-header {
+
+          > .e-acrdn-header-content {
+            color: $acrdn-item-selected-hdr-con-font;
+          }
+
+          > .e-toggle-icon {
+            color: $acrdn-item-selected-hdr-icon-font;
+          }
+
+          &:focus {
+            box-shadow: $acrdn-item-header-focus-box-shadow;
+            position: relative;
+            z-index: 2;
+          }
+        }
+
+        + .e-selected {
+          border-color: $acrdn-item-selected-selected-border-color;
+          border-style: $acrdn-item-border-nav-type;
+          border-width: $acrdn-item-selected-selected-border-size;
+        }
+
+        .e-acrdn-item.e-selected.e-expand-state {
+          &:hover {
+            > .e-acrdn-header .e-icons {
+              color: $acrdn-item-nes-selected-exp-hover-hdr-icons-font;
+            }
+
+            > .e-acrdn-header .e-acrdn-header-content {
+              color: $acrdn-item-nes-selected-exp-hover-hdr-con-font;
+            }
+          }
+        }
+
+        &.e-select > .e-acrdn-header {
+          background: $acrdn-item-selected-header-background;
+          border-radius: $acrdn-item-selected-header-border-radius;
+          border-color: $acrdn-item-selected-hdr-border-color;
+          border-style: $acrdn-item-border-nav-type;
+          border-width: $acrdn-item-selected-hdr-border-size;
+
+          &:focus {
+            background: $acrdn-item-header-focus-bg;
+          }
+
+          &:hover {
+            border-color: $acrdn-item-selected-hdr-hover-border-color;
+          }
+        }
+
+        > .e-acrdn-panel {
+
+          .e-acrdn-content {
+            color: $acrdn-content-color;
+          }
+
+          .e-acrdn-header-content {
+            color: $acrdn-nested-header-font;
+          }
+        }
+      }
+
+      .e-toggle-icon {
+        color: $acrdn-icon-color;
+      }
+
+      .e-acrdn-panel {
+        font-size: $acrdn-content-font-size;
+      }
+    }
+  }
+}

package/styles/accordion/bootstrap-dark.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/bootstrap-dark.scss';
+@import 'ej2-base/styles/bootstrap-dark-definition.scss';
+@import 'bootstrap-dark-definition.scss';
+@import 'icons/bootstrap-dark.scss';
+@import 'all.scss';

package/styles/accordion/bootstrap.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/bootstrap.scss';
+@import 'ej2-base/styles/bootstrap-definition.scss';
+@import 'bootstrap-definition.scss';
+@import 'icons/bootstrap.scss';
+@import 'all.scss';

package/styles/accordion/bootstrap4.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/bootstrap4.scss';
+@import 'ej2-base/styles/bootstrap4-definition.scss';
+@import 'bootstrap4-definition.scss';
+@import 'icons/bootstrap4.scss';
+@import 'all.scss';

package/styles/accordion/bootstrap5-dark.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/bootstrap5-dark.scss';
+@import 'ej2-base/styles/bootstrap5-dark-definition.scss';
+@import 'bootstrap5-dark-definition.scss';
+@import 'icons/bootstrap5-dark.scss';
+@import 'all.scss';

package/styles/accordion/bootstrap5.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/bootstrap5.scss';
+@import 'ej2-base/styles/bootstrap5-definition.scss';
+@import 'bootstrap5-definition.scss';
+@import 'icons/bootstrap5.scss';
+@import 'all.scss';

package/styles/accordion/fabric-dark.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/fabric-dark.scss';
+@import 'ej2-base/styles/fabric-dark-definition.scss';
+@import 'fabric-dark-definition.scss';
+@import 'icons/fabric-dark.scss';
+@import 'all.scss';

package/styles/accordion/fabric.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/fabric.scss';
+@import 'ej2-base/styles/fabric-definition.scss';
+@import 'fabric-definition.scss';
+@import 'icons/fabric.scss';
+@import 'all.scss';

package/styles/accordion/fluent-dark.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/fluent-dark.scss';
+@import 'ej2-base/styles/fluent-dark-definition.scss';
+@import 'fluent-dark-definition.scss';
+@import 'icons/fluent-dark.scss';
+@import 'all.scss';

package/styles/accordion/fluent.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/fluent.scss';
+@import 'ej2-base/styles/fluent-definition.scss';
+@import 'fluent-definition.scss';
+@import 'icons/fluent.scss';
+@import 'all.scss';

package/styles/accordion/highcontrast-light.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/highcontrast-light.scss';
+@import 'ej2-base/styles/highcontrast-light-definition.scss';
+@import 'highcontrast-light-definition.scss';
+@import 'icons/highcontrast-light.scss';
+@import 'all.scss';

package/styles/accordion/highcontrast.scss

@@ -1 +1,4 @@
-@import 'ej2-navigations/styles/accordion/highcontrast.scss';
+@import 'ej2-base/styles/highcontrast-definition.scss';
+@import 'highcontrast-definition.scss';
+@import 'icons/highcontrast.scss';
+@import 'all.scss';

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

@@ -0,0 +1,17 @@
+@include export-module('accordion-bootstrap-dark-icons') {
+
+  /*! accordion icons */
+  #{&}.e-accordion {
+
+    .e-tgl-collapse-icon {
+
+      &::before {
+        content: '\e916';
+      }
+
+      &.e-expand-icon {
+        transform: rotate(-180deg);
+      }
+    }
+  }
+}

package/styles/accordion/icons/_bootstrap.scss

@@ -0,0 +1,17 @@
+@include export-module('accordion-bootstrap-icons') {
+
+  /*! accordion icons */
+  #{&}.e-accordion {
+
+    .e-tgl-collapse-icon {
+
+      &::before {
+        content: '\e916';
+      }
+
+      &.e-expand-icon {
+        transform: rotate(-180deg);
+      }
+    }
+  }
+}