halleyx-ui-framework 5.4.2 → 5.4.4

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

@@ -0,0 +1,54 @@
+.tab-content {
+  font-size: 16px;
+}
+
+.tabs_header {
+  width: 100%;
+  margin-top: 0px;
+  margin-bottom: 10px;
+  list-style: none;
+  padding: 0;
+  display: flex;
+  border-bottom: 1px solid var(--hlx-border-color);
+  overflow-x: auto;
+}
+
+.tabs_header li {
+  border: 2px solid transparent;
+  font-size: 14px;
+  min-width: 100px;
+  white-space: nowrap;
+  text-align: center;
+  padding: 10px 10px;
+  margin-right: 10px;
+  cursor: pointer !important;
+  transition: 0.4s all ease-out;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.tabs_header li#top.selected {
+  border-top: 2px solid var(--hlx-color-primary);
+  color: var(--hlx-color-primary);
+}
+.tabs_header li#bottom.selected {
+  border-bottom: 2px solid var(--hlx-color-primary);
+  color: var(--hlx-color-primary);
+}
+
+.tab-arrows {
+  display: flex;
+  i {
+    cursor: pointer;
+    border-bottom: 1px solid var(--hlx-border-color);
+    height: 44px;
+    display: flex;
+    align-items: center;
+    z-index: 100;
+    position: relative;
+    font-size: var(--hlx-icon-size-md);
+  }
+}
+
+.tabs_header::-webkit-scrollbar {
+  display: none;
+}

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

@@ -0,0 +1,102 @@
+.hlx-tag {
+  display: flex;
+  // padding: 0.2rem 0 0.2rem 0.3rem;
+  padding: 6px;
+  min-width: min-content;
+  max-height: 28px;
+  // border-radius: 4px;
+  border-radius: 6px;
+  width: -webkit-max-content;
+  width: -moz-max-content;
+  width: max-content;
+  font-weight: 500;
+  letter-spacing: 0.005em;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  align-content: center;
+  color: white;
+  background-color: var(--hlx-color-primary);
+  color: var(--hlx-color-white);
+  &:hover {
+    cursor: default;
+    // color: var(--hlx-color-primary-light);
+    background-color: var(--hlx-color-primary-dark);
+  }
+
+  & > .content {
+    font-size: 12px;
+    max-width: 10ch;
+    line-height: 2;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+  & > i {
+    font-size: 15px;
+    margin-left: 2px;
+    cursor: pointer;
+  }
+  &.info {
+    background-color: var(--hlx-color-info-light);
+    color: var(--hlx-color-info);
+    &:hover {
+      cursor: default;
+      color: var(--hlx-color-info-light);
+      background-color: var(--hlx-color-info);
+    }
+  }
+
+  &.warning {
+    background-color: var(--hlx-color-warning-light);
+    color: var(--hlx-color-warning);
+    &:hover {
+      cursor: default;
+      color: var(--hlx-color-warning-light);
+      background-color: var(--hlx-color-warning);
+    }
+  }
+
+  &.danger {
+    color: var(--hlx-color-error);
+    background-color: var(--hlx-color-error-light);
+    &:hover {
+      cursor: default;
+      background-color: var(--hlx-color-error);
+      color: var(--hlx-color-error-light);
+    }
+  }
+
+  &.success {
+    background-color: var(--hlx-color-success-light);
+    color: getCssVar('color', 'success');
+    &:hover {
+      cursor: default;
+      background-color: getCssVar('color', 'success');
+      color: var(--hlx-color-success-light);
+    }
+  }
+  &.disable {
+    background: var(--hlx-color-disable);
+    color: var(--hlx-border-color-dark);
+    &:hover {
+      cursor: default;
+      color: var(--hlx-color-disable);
+      background: var(--hlx-border-color-dark);
+    }
+  }
+
+  // &.-normal{
+  //     background-color: $primary-color;
+  // }
+  // // // Sizes
+  // &.-medium {
+  //     font-size: 1.0rem;
+  //     padding: .1rem .65rem .2rem;
+  // }
+
+  // &.-small {
+  //     font-size: .7rem;
+  //     padding: .05rem .4rem .15rem;
+  // }
+}

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

@@ -0,0 +1,279 @@
+.container1222 {
+  background-color: #ffffff;
+  width: 100%;
+  height: 100%;
+  padding: 30px 30px;
+  // font-family: Arial, Helvetica, sans-serif;
+  /* position: absolute; */
+  /* transform: translate(-50%, -50%); */
+  /* left: 50%;
+    top: 50%; */
+  border-radius: 8px;
+  border: 1px solid var(--hlx-border-color);
+  // i{
+  //   font-size: 32px;
+  // }
+  // box-shadow: 0 25px 50px rgba(7, 20, 35, 0.2);
+  .options {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    // gap: 15px;
+    font-family: Opensans;
+
+    select {
+      height: 25px;
+      padding: 0px !important;
+    }
+    // background-color: aqua;
+    .option-button {
+      height: 35px;
+      width: 35px;
+      display: grid;
+      place-items: center;
+      // justify-content: center;
+      border-radius: 3px;
+      border: none;
+      background-color: #ffffff;
+      outline: none;
+      color: var(--hlx-text-color-primary);
+      i {
+        font-size: 24px;
+      }
+
+      .bold-icon {
+        font-weight: bold;
+        font-size: 16px;
+      }
+      .italic-icon {
+        font-style: italic;
+        font-size: 16px;
+      }
+      .underline-icon {
+        text-decoration: underline;
+        font-size: 16px;
+      }
+      .strikethrough-icon {
+        text-decoration: line-through;
+        font-size: 16px;
+        // align-items: center;
+      }
+      .superscript-icon,
+      .subscript-icon {
+        font-size: 16px;
+        sub {
+          font-size: 10px;
+        }
+        sup {
+          font-size: 10px;
+        }
+      }
+    }
+    .option-button:hover {
+      background-color: var(--hlx-color-primary);
+      color: var(--hlx-color-white);
+    }
+    select {
+      padding: 7px;
+      border: 1px solid #d4d4d4;
+      border-radius: 3px;
+    }
+    option {
+      height: 50px;
+    }
+    .input-wrapper {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      label {
+        font-size: 14px;
+      }
+    }
+    input[type='color'] {
+      -webkit-appearance: none;
+      -moz-appearance: none;
+      appearance: none;
+      background-color: transparent;
+      width: 40px;
+      height: 28px;
+      border: none;
+      cursor: pointer;
+    }
+    input[type='color']::-webkit-color-swatch {
+      border-radius: 3px;
+      box-shadow: 0 0 0 2px #ffffff, 0 0 0 3px #020929;
+    }
+    input[type='color']::-moz-color-swatch {
+      border-radius: 3px;
+      box-shadow: 0 0 0 2px #ffffff, 0 0 0 3px #020929;
+    }
+    .texteditoractive {
+      background-color: #54bd95;
+      color: #ffffff;
+    }
+    .active {
+      background-color: #d8e3ff;
+      color: #1d46ff;
+    }
+  }
+
+  #text-input,
+  #text-input1 {
+    font-family: Arial, Helvetica, sans-serif;
+
+    margin-top: 10px;
+    border: 1px solid #dddddd;
+    border-radius: 7px;
+    padding: 20px;
+    height: 50vh;
+    // font-family: none !important;
+    /* overflow: hidden scroll; */
+  }
+}
+
+.hello {
+  color: #000000;
+}
+
+.icon-link-alt-regular {
+  font-size: 18px;
+}
+// #createLink {
+  // border: none;
+  // background-color: white;
+  // &:hover{
+  //   background-color: var(--hlx-color-primary);
+  //   color: var(--hlx-color-white);
+  //   border-radius: 8px;
+  // }
+// }
+
+// .text-format{
+//   height:100px;
+//   width:200px;
+//   background-color: #1d46ff;
+//   display: flex;
+
+// }
+
+.specify {
+  display: flex;
+  width: 200px;
+  justify-content: space-around;
+  border-right: 1px solid var(--hlx-border-color);
+  margin-bottom: 5px;
+}
+.specify1 {
+  display: flex;
+  width: 100px;
+  // background-color: #020929;
+  justify-content: space-evenly;
+  border-right: 1px solid var(--hlx-border-color);
+  margin-bottom: 5px;
+}
+.specify2 {
+  display: flex;
+  width: 100px;
+  justify-content: space-evenly;
+  border-right: 1px solid var(--hlx-border-color);
+  margin-bottom: 5px;
+}
+.specify3 {
+  display: flex;
+  width: 100px;
+  justify-content: space-evenly;
+  border-right: 1px solid var(--hlx-border-color);
+  margin-bottom: 5px;
+}
+
+.specify4 {
+  display: flex;
+  width: 50px;
+  justify-content: space-evenly;
+  border-right: 1px solid var(--hlx-border-color);
+  margin-bottom: 5px;
+}
+
+.specify5 {
+  display: flex;
+  width: 250px;
+  justify-content: space-evenly;
+  // border-right: 1px solid var(--hlx-border-color);
+  margin-bottom: 5px;
+}
+
+.specify7 {
+  display: flex;
+  width: 108px;
+  justify-content: space-evenly;
+  margin-bottom: 5px;
+  margin-left: 10px;
+  border-right: 1px solid var(--hlx-border-color);
+  border-left: 1px solid var(--hlx-border-color);
+}
+
+.specify8 {
+  display: flex;
+  width: 200px;
+  justify-content: space-around;
+  margin-bottom: 5px;
+  margin-right: 10px;
+}
+.specify9 {
+  display: flex;
+  width: 80px;
+  justify-content: space-around;
+  margin-bottom: 5px;
+}
+
+.strike {
+  text-decoration: line-through;
+}
+
+// select{
+//   border-color:#d4d4d4;
+// }
+
+.texteditoractive32 {
+  background-color: var(--hlx-color-primary) !important;
+  color: var(--hlx-color-white) !important;
+  border-radius: 8px;
+}
+.url-link {
+  width: 100%;
+}
+
+.link-input {
+  height: 40px;
+  width: 100%;
+  outline: none;
+  border: 1px solid var(--hlx-border-color);
+  border-radius: 5px;
+  font-family: 'OpenSans';
+}
+.link-save-button {
+  height: 40px;
+  background-color: var(--hlx-color-primary);
+  color: var(--hlx-color-white);
+  width: 30%;
+  border-radius: 5px;
+}
+
+.texteditor-head-title {
+  font-weight: bold;
+  font-size: 16px;
+  display: flex;
+  justify-content: flex-start;
+  font-family: 'QuickSand';
+}
+
+.adv-option-button {
+  height: 35px;
+  width: 35px;
+  cursor: pointer;
+  &:hover {
+    background-color: var(--hlx-color-primary);
+    color: var(--hlx-color-white);
+    border-radius: 6px;
+  }
+}