halleyx-ui-framework 5.4.0 → 5.4.2

package/dist/src/assets/styles/treeSelect.scss

@@ -1,286 +0,0 @@
-#hlx-tree-select-0133.hlx-tree-select-wrapper {
-  width: 100%;
-  min-width: 250px;
-  overflow: auto;
-  position: relative;
-  border-radius: 3px;
-  --color: var(--hlx-text-color-secondary);
-  color: var(--color);
-  margin: 0;
-  list-style-type: none;
-  overflow: auto;
-  border-radius: 6px;
-  background: inherit;
-  padding: 0 1.25rem;
-  &.background-enabled {
-    padding: 1rem 1.25rem 1.25rem;
-    background: #fff;
-    min-height: 260px;
-    max-height: 360px;
-    box-shadow: 0 0 10px -1px rgba(0, 0, 0, 0.11);
-    --color: var(--hlx-text-color-primary);
-    color: var(--color);
-    border: 1px solid #dee2e6;
-  }
-  & > .hlx-tree-select {
-    list-style: none;
-    // cursor: pointer;
-    user-select: none;
-    padding: 0;
-    margin: 0;
-    color: var(--color);
-    position: relative;
-    box-sizing: border-box;
-
-    &.show-tree {
-      li {
-        .label-wrapper {
-          &.shepherd {
-            pointer-events: none;
-            cursor: pointer;
-            user-select: none;
-          }
-          &.selected-tree {
-            background-color: #265e4b;
-          }
-          &:not(.selected-tree):hover {
-            background: var(--hlx-color-primary);
-            color: #222222 !important;
-            cursor: pointer;
-          }
-          &:hover i,
-          &:hover &.only-child {
-            // background: getCssVar('color', 'primary');
-            color: #222222;
-            cursor: pointer;
-          }
-          margin-top: -2px;
-          &.only-child:not(.no-icon) {
-            color: var(--color);
-            padding-left: 30px;
-          }
-        }
-      }
-    }
-    &:not(.show-tree) > li {
-      .label-wrapper {
-        // &:active{
-        //   background-color: red;
-        // }
-        &:hover {
-          background: var(--hlx-color-primary);
-          color: #222222;
-          cursor: pointer;
-          i {
-            color: #222222;
-            font-weight: 500;
-          }
-        }
-
-        &.selected-tree {
-          background-color: #265e4b;
-        }
-      }
-    }
-    & li {
-      font-size: 0.95em;
-      box-sizing: border-box;
-      transition: all 0.4s ease;
-      position: relative;
-      padding: 0.5rem;
-      .label-wrapper {
-        display: flex;
-        transition: box-shadow 0.2s;
-        border-radius: 6px;
-        height: 35px;
-        padding: 4px 7px 4px 10px;
-        align-items: center;
-        justify-content: flex-start;
-        &.selected-tree {
-          background-color: #265e4b;
-          color: white !important;
-          &:hover i {
-            color: var(--hlx-color-white);
-          }
-          i {
-            color: white;
-          }
-          // .child-label {
-          //   // color: getCssVar('color', 'primary','dark');
-          // }
-        }
-        .label-icon-wrapper {
-          min-width: -1px;
-          margin-right: 7px;
-        }
-        &.selected-tree:not(ul):has(.show-tree) {
-          // .child-label {
-          //   color: getCssVar('color', 'primary');
-          // }
-          i {
-            color: white;
-          }
-          background-color: getCssVar('color', 'primary', 'light');
-        }
-        & > i {
-          margin-left: 4px;
-          font-size: var(--hlx-icon-size-xs);
-        }
-        &.only-child:not(.no-icon) {
-          color: var(--color);
-          padding-left: 55px;
-        }
-        &.only-child.no-icon {
-          color: var(--color);
-          &.expanded-tree {
-            padding-left: 10px;
-          }
-          padding-left: 26px;
-          & > span {
-            margin-left: 9px;
-          }
-        }
-        & > span.edit-tool-bar {
-          margin-left: auto;
-          display: none;
-          gap: 7px;
-          & > i:hover {
-            // color: getCssVar('color', 'primary');
-            font-weight: bold;
-            transform: scale(1.1);
-          }
-        }
-        .child-label {
-          // margin-left: 4px;
-          width: 100%;
-          display: flex;
-          flex-direction: row;
-          flex-wrap: wrap;
-          align-items: center;
-        }
-        // &:not(ul.show-tree):hover {
-        //   background: getCssVar('color', 'primary','light');
-        //   color: getCssVar('color', 'primary');
-        //   cursor: pointer;
-        // }
-        &:hover:not(ul) .edit-tool-bar {
-          // background: getCssVar('color', 'primary','light');
-          // color: getCssVar('color', 'primary');
-          display: flex;
-          cursor: pointer;
-        }
-        &:hover:not(ul) .child-label {
-          // background: getCssVar('color', 'primary','light');
-          // color: getCssVar('color', 'primary');
-          display: flex;
-          cursor: pointer;
-        }
-      }
-      padding: 3px;
-      & i {
-        font-size: var(--hlx-icon-size-xs);
-        color: var(--hlx-color-primary);
-      }
-      & ul {
-        padding-left: 10px;
-        & > li {
-          .label-wrapper {
-            margin-left: 0.1em;
-          }
-          ul > li {
-            .label-wrapper {
-              margin-left: 0.3em;
-            }
-            .label-wrapper.only-child {
-              margin-left: 0.4em;
-            }
-            ul > li {
-              .label-wrapper {
-                margin-left: 0.4em;
-              }
-              .label-wrapper.only-child {
-                margin-left: 0.4em;
-              }
-            }
-          }
-        }
-      }
-
-      & ul li {
-        display: block;
-      }
-    } //li end
-    & ul:not(.show-tree) {
-      display: none;
-      position: relative;
-    }
-    &.show-tree .arrow {
-      display: none;
-    }
-    & .arrow {
-      transition: all 0.4s ease;
-      display: flex;
-      align-items: center;
-      margin-right: 0.7rem;
-      i {
-        color: var(--color);
-        transition: all 0.4s ease;
-        font-size: var(--hlx-icon-size-xs);
-        &:hover i {
-          color: var(--color);
-        }
-      }
-    }
-    // &
-    // & li.current-selected-tree {
-    //   // background-color: rgb(145, 255, 0);
-    //   // border: solid;
-    //   // &>ul.guide:before {
-    //   //   position: absolute;
-    //   //   content: "";
-    //   //   left: 22px;
-    //   //   top: 3px;
-    //   //   width: 2px;
-    //   //   height: 99%;
-    //   //   background-color: transparent;
-    //   //   border-left: dashed 1px #c2c2c2 !important;
-    //   //   border-bottom: dashed 1px #c2c2c2 !important;
-    //   // }
-    // }
-    & li {
-      // background-color: rgb(145, 255, 0);
-      // border: solid;
-      & > ul.guide.guide-current:before {
-        position: absolute;
-        content: '';
-        left: 22px;
-        top: 3px;
-        width: 2px;
-        height: 99%;
-        background-color: transparent;
-        border-left: dashed 1px #c2c2c2 !important;
-        border-bottom: dashed 1px #c2c2c2 !important;
-      }
-    }
-    & li.expanded > ul {
-      display: block;
-
-      &.guide:before {
-        position: absolute;
-        content: '';
-        left: 22px;
-        top: 3px;
-        width: 2px;
-        height: 99%;
-        background-color: transparent;
-        border-left: dashed 1px #c2c2c245;
-        border-bottom: dashed 1px #c2c2c2a2;
-      }
-    }
-    & li.expanded > .arrow,
-    & li.expanded > span > .arrow,
-    & span.expanded > span .arrow {
-      transform: rotate(90deg);
-    }
-  }
-}

package/dist/src/assets/styles/variables.scss

@@ -1,77 +0,0 @@
-@use 'sass:map';
-@use './mixins/var' as *;
-@use './mixins/functions.scss' as *;
-@import './common/var.scss';
-
-:root {
-  /*Basic*/
-  --hlx-color-black: #{$--color-black};
-  --hlx-color-white: #{$--color-white};
-
-  /*Primary*/
-  --hlx-color-primary-dark: #{$--color-primary-dark};
-  --hlx-color-primary: #{$--color-primary};
-  --hlx-color-primary-light: #{$--color-primary-light};
-  --hlx-color-primary-lighter: #{$--color-primary-lighter};
-
-  /*success*/
-  --hlx-color-success-dark: #{$--color-success-dark};
-  --hlx-color-success: #{$--color-success};
-  --hlx-color-success-light: #{$--color-success-light};
-
-  /*warning*/
-  --hlx-color-warning-dark: #{$--color-warning-dark};
-  --hlx-color-warning: #{$--color-warning};
-  --hlx-color-warning-light: #{$--color-warning-light};
-
-  /*error*/
-  --hlx-color-error-dark: #{$--color-error-dark};
-  --hlx-color-error: #{$--color-error};
-  --hlx-color-error-light: #{$--color-error-light};
-
-  /*info*/
-  --hlx-color-info-dark: #{$--color-info-dark};
-  --hlx-color-info: #{$--color-info};
-  --hlx-color-info-light: #{$--color-info-light};
-
-  /*link*/
-  --hlx-color-link-dark: #{$--color-link-dark};
-  --hlx-color-link: #{$--color-link};
-  --hlx-color-link-light: #{$--color-link-light};
-
-  /*disable*/
-  --hlx-color-disable-dark: #{$--color-disable-dark};
-  --hlx-color-disable: #{$--color-disable};
-  --hlx-color-disable-text: #{$--color-disable-text};
-  --hlx-font-type-content: #{$--font-type-content};
-  --hlx-font-type-title: #{$--font-type-title};
-  //  @each $type in (primary, success, warning, error, info,link) {
-  //   @include set-css-color-rgb($type);
-  // }
-  @each $type
-    in (primary, success, warning, error, info, link, disable, sidebar)
-  {
-    @include set-css-color-rgb($type);
-  }
-  @each $type in (sidebar) {
-    @include set-css-color-type($type);
-  }
-  //  @each $type in (light) {
-  //   @include set-css-border-color-rgb($type);
-  // }
-  @each $type in (primary, secondary, tree, disable) {
-    @include set-css-text-type($type);
-  }
-  @each $type in (header-size, content-size) {
-    @include set-css-font-type($type);
-  }
-  @each $type in (dark, light, lighter, '') {
-    @include set-css-border-type($type);
-  }
-  @each $type in (sm, xs, lg, '', xl, xxl) {
-    @include set-css-line-height-type($type);
-  }
-  @each $type in (sm, xs, lg, xl, md) {
-    @include set-css-icon-type($type);
-  }
-}