@syncfusion/ej2-angular-layouts 24.1.41 → 24.2.3

package/styles/splitter/_tailwind-definition.scss

@@ -1,31 +0,0 @@
-//Layout Variables Start
-$splitpane-font-size: $text-sm !default;
-$splitpane-font-weight: $font-weight-normal !default;
-$splitpane-font-family: $font-family !default;
-$splitbar-icon-size: 14px !default;
-$splitbar-icon-gap: 18px !default;
-$bigger-splitbar-icon-gap: 20px !default;
-$bigger-splitpane-font-size: $text-base !default;
-$bigger-splitbar-icon-size: 16px !default;
-
-//Layout Variables End
-
-//Theme Variables Start
-$navigation-arrow-background: $transparent !default;
-$navigation-icon-background-hover: $primary !default;
-$navigation-icon-border-hover: $primary !default;
-$splitter-border-color: $border-light !default;
-$splitter-background-color: $primary-text-color !default;
-$splitpane-font-color: $content-text-color !default;
-$splitbar-border-color: $border-light !default;
-$splitbar-hover-border-color: $primary !default;
-$resize-icon-hover-color: $splitbar-hover-border-color !default;
-$splitbar-icon-color: $icon-color !default;
-$collapse-icon-bg-color: $primary-text-color !default;
-$resize-icon-bg-color: $content-bg-color !default;
-$split-bar-border-left: 1px solid $border-light !default;
-$split-bar-border-right: 1px solid $border-light !default;
-$split-bar-hover-border-left: 1px solid $splitbar-hover-border-color !default;
-$split-bar-hover-border-right: 1px solid $splitbar-hover-border-color !default;
-
-//Theme Variables End

package/styles/splitter/_theme.scss

@@ -1,207 +0,0 @@
-@include export-module('splitter-theme') {
-  .e-splitter {
-
-    &.e-splitter-horizontal,
-    &.e-splitter-vertical {
-      border: solid 1px $splitter-border-color;
-
-      .e-pane {
-        color: $splitpane-font-color;
-
-        // sass-lint:disable nesting-depth
-        &.e-splitter {
-
-          &.e-splitter-horizontal,
-          &.e-splitter-vertical {
-            border: transparent;
-          }
-        }
-      }
-    }
-
-    .e-split-bar {
-
-      &.e-split-bar-horizontal {
-        background: $splitbar-border-color;
-        border-left: $split-bar-border-left;
-        border-right: $split-bar-border-right;
-
-        .e-resize-handler {
-          background: $resize-icon-bg-color;
-          color: $splitbar-icon-color;
-          z-index: 10;
-        }
-
-        .e-navigate-arrow:not(.e-icon-hidden) {
-          background-color: transparent;
-          border-color: transparent;
-          color: transparent;
-          transition: background-color 500ms ease-out;
-
-          &::before,
-          &::after {
-            background-color: $navigation-icon-background-hover;
-            opacity: 0;
-            transition-duration: .3s;
-            transition-timing-function: cubic-bezier(.25, .1, .25, 1);
-          }
-        }
-
-        &.e-split-bar-hover,
-        &.e-split-bar-active {
-          background: $splitbar-hover-border-color;
-          border-left: $split-bar-hover-border-left;
-          border-right: $split-bar-hover-border-right;
-
-          .e-resize-handler {
-            background: $resize-icon-bg-color;
-            color: $splitbar-hover-border-color;
-          }
-
-          .e-navigate-arrow {
-            &.e-arrow-left,
-            &.e-arrow-right {
-              background-color: $navigation-arrow-background;
-              border-color: $navigation-icon-border-hover;
-              border-width: 1px;
-              opacity: .9;
-            }
-          }
-
-          &.e-split-bar-hover,
-          &.e-split-bar-active {
-            .e-navigate-arrow::before {
-              background-color: $navigation-icon-background-hover;
-              opacity: 1;
-              transform: rotate(40deg);
-            }
-
-            .e-navigate-arrow::after {
-              background-color: $navigation-icon-background-hover;
-              opacity: 1;
-              transform: rotate(-40deg);
-            }
-          }
-        }
-
-        // left-arrow hover/active styles
-        &.e-split-bar-hover,
-        &.e-split-bar-active {
-          .e-navigate-arrow.e-arrow-right::before {
-            background-color: $navigation-icon-background-hover;
-            opacity: 1;
-            transform: rotate(-40deg);
-          }
-
-          .e-navigate-arrow.e-arrow-right::after {
-            background-color: $navigation-icon-background-hover;
-            opacity: 1;
-            transform: rotate(40deg);
-          }
-        }
-
-        &.e-split-bar-active {
-          background: $splitbar-hover-border-color;
-
-          .e-resize-handler {
-            background: $resize-icon-bg-color;
-            color: $splitbar-hover-border-color;
-          }
-        }
-      }
-
-      &.e-split-bar-vertical {
-        background: $splitbar-border-color;
-
-        .e-resize-handler {
-          background: $resize-icon-bg-color;
-          color: $splitbar-icon-color;
-          z-index: 12;
-        }
-
-        &.e-split-bar-hover,
-        &.e-split-bar-active {
-          background: $splitbar-hover-border-color;
-          border-left: $split-bar-hover-border-left;
-          border-right: $split-bar-hover-border-right;
-
-          .e-navigate-arrow {
-            &.e-arrow-up,
-            &.e-arrow-down {
-              background-color: $navigation-arrow-background;
-              border-color: $navigation-icon-border-hover;
-              border-width: 1px;
-              opacity: .9;
-            }
-          }
-
-          .e-resize-handler {
-            background: $resize-icon-bg-color;
-            color: $splitbar-hover-border-color;
-          }
-        }
-
-        &.e-split-bar-hover,
-        &.e-split-bar-active {
-          .e-navigate-arrow.e-arrow-up {
-
-            &::before {
-              background-color: $navigation-icon-background-hover;
-              opacity: 1;
-              transform: rotate(125deg);
-            }
-
-            &::after {
-              background-color: $navigation-icon-background-hover;
-              opacity: 1;
-              transform: rotate(50deg);
-            }
-          }
-
-          .e-navigate-arrow.e-arrow-down {
-            &::before {
-              background-color: $navigation-icon-background-hover;
-              opacity: 1;
-              transform: rotate(55deg);
-            }
-
-            &::after {
-              background-color: $navigation-icon-background-hover;
-              opacity: 1;
-              transform: rotate(125deg);
-            }
-          }
-        }
-
-        .e-navigate-arrow {
-          background-color: transparent;
-          border-color: transparent;
-          color: transparent;
-          transition: background-color 300ms ease-out;
-
-          &::before,
-          &::after {
-            background-color: $navigation-icon-background-hover;
-            opacity: 0;
-            transition-duration: .3s;
-            transition-timing-function: cubic-bezier(.25, .1, .25, 1);
-          }
-        }
-
-        &.e-split-bar-active {
-          background: $splitbar-hover-border-color;
-
-          .e-resize-handler {
-            background: $resize-icon-bg-color;
-            color: $splitbar-hover-border-color;
-          }
-        }
-      }
-    }
-
-    &.e-disabled {
-      opacity: .4;
-      pointer-events: none;
-    }
-  }
-}

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

@@ -1,52 +0,0 @@
-@include export-module('splitter-bootstrap-icons') {
-  .e-splitter {
-    .e-split-bar {
-      &.e-split-bar-horizontal {
-        .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-
-      &.e-split-bar-vertical {
-        & .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-          transform: rotate(90deg);
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-    }
-  }
-
-  .e-bigger {
-    .e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-
-    &.e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-  }
-}

package/styles/splitter/icons/_bootstrap.scss

@@ -1,52 +0,0 @@
-@include export-module('splitter-bootstrap-icons') {
-  .e-splitter {
-    .e-split-bar {
-      &.e-split-bar-horizontal {
-        .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-
-      &.e-split-bar-vertical {
-        & .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-          transform: rotate(90deg);
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-    }
-  }
-
-  .e-bigger {
-    .e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-
-    &.e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-  }
-}

package/styles/splitter/icons/_bootstrap4.scss

@@ -1,51 +0,0 @@
-@include export-module('splitter-bootstrap4-icons') {
-  .e-splitter {
-    .e-split-bar {
-      &.e-split-bar-horizontal {
-        .e-resize-handler::before {
-          content: '\e781';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-
-      &.e-split-bar-vertical {
-        & .e-resize-handler::before {
-          content: '\e71b';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-    }
-  }
-
-  .e-bigger {
-    .e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-
-    &.e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-  }
-}

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

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

package/styles/splitter/icons/_bootstrap5.scss

@@ -1,39 +0,0 @@
-@include export-module('splitter-material-icons') {
-  .e-splitter {
-    .e-split-bar {
-      &.e-split-bar-horizontal {
-        .e-resize-handler::before {
-          content: '\e7e3';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-      }
-
-      &.e-split-bar-vertical {
-        & .e-resize-handler::before {
-          content: '\e7fd';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-      }
-    }
-  }
-
-  .e-bigger {
-    .e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-
-    &.e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-  }
-}

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

@@ -1,52 +0,0 @@
-@include export-module('splitter-fabric-icons') {
-  .e-splitter {
-    .e-split-bar {
-      &.e-split-bar-horizontal {
-        .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-
-      &.e-split-bar-vertical {
-        & .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-          transform: rotate(90deg);
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-    }
-  }
-
-  .e-bigger {
-    .e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-
-    &.e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-  }
-}

package/styles/splitter/icons/_fabric.scss

@@ -1,52 +0,0 @@
-@include export-module('splitter-fabric-icons') {
-  .e-splitter {
-    .e-split-bar {
-      &.e-split-bar-horizontal {
-        .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-
-      &.e-split-bar-vertical {
-        & .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-          transform: rotate(90deg);
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-    }
-  }
-
-  .e-bigger {
-    .e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-
-    &.e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-  }
-}

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

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

package/styles/splitter/icons/_fluent.scss

@@ -1,39 +0,0 @@
-@include export-module('splitter-material-icons') {
-  .e-splitter {
-    .e-split-bar {
-      &.e-split-bar-horizontal {
-        .e-resize-handler::before {
-          content: '\e7e3';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-      }
-
-      &.e-split-bar-vertical {
-        & .e-resize-handler::before {
-          content: '\e7fd';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-      }
-    }
-  }
-
-  .e-bigger {
-    .e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-
-    &.e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-  }
-}

package/styles/splitter/icons/_fusionnew.scss

@@ -1,39 +0,0 @@
-@include export-module('splitter-material-icons') {
-  .e-splitter {
-    .e-split-bar {
-      &.e-split-bar-horizontal {
-        .e-resize-handler::before {
-          content: '\e7e3';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-      }
-
-      &.e-split-bar-vertical {
-        & .e-resize-handler::before {
-          content: '\e7fd';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-      }
-    }
-  }
-
-  .e-bigger {
-    .e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-
-    &.e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-  }
-}

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

@@ -1,52 +0,0 @@
-@include export-module('splitter-highcontrast-icons') {
-  .e-splitter {
-    .e-split-bar {
-      &.e-split-bar-horizontal {
-        .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-
-      &.e-split-bar-vertical {
-        & .e-resize-handler::before {
-          content: '\e984';
-          font-family: 'e-icons';
-          font-size: $splitbar-icon-size;
-          transform: rotate(90deg);
-        }
-
-        .e-resize-handler {
-          &.e-template-resize-handler::before {
-            content: '';
-          }
-        }
-      }
-    }
-  }
-
-  .e-bigger {
-    .e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-
-    &.e-splitter {
-      .e-split-bar {
-        .e-resize-handler::before {
-          font-size: $bigger-splitbar-icon-size;
-        }
-      }
-    }
-  }
-}