pixel-react 1.13.43 → 1.13.44

package/lib/styles/LineChart.scss

@@ -1,93 +0,0 @@
-@use '../../../assets/styles/fonts';
-
-.ff-line-chart-container {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.ff-line-chart-text {
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  .smooth-dot {
-    transition: cx 0.2s ease, cy 0.2s ease;
-  }
-}
-.ff-line-chart-yAxisLabel-warpper {
-  position: relative;
-  min-width: 20px;
-  height: 100%;
-  .ff-line-chart-yAxisLabel {
-    position: absolute;
-    right: 0;
-    top: 50%;
-    display: flex;
-    white-space: nowrap;
-    transform: rotate(270deg) translateX(60%);
-    transform-origin: right center;
-  }
-}
-
-.ff-line-chart-text1 {
-  transform-origin: center;
-  transform: rotate(-90deg);
-  transition: transform 1s ease-in-out;
-  position: relative;
-  left: 163px;
-  min-width: 10px;
-  color: var(--drawer-title-color);
-}
-
-.ff-line-chart-tooltip {
-  position: absolute;
-  background-color: var(--tooltip-bg-color);
-  border-radius: 4px;
-  pointer-events: none;
-  display: flex;
-  flex-direction: column;
-  min-width: 30px;
-  min-height: 30px;
-  justify-content: center;
-  align-items: flex-start;
-  row-gap: 10px;
-  padding: 8px !important;
-  z-index: 99999999999999;
-}
-
-.ff-line-chart-status-dot {
-  width: 16px;
-  height: 16px;
-  border-radius: 100%;
-}
-.ff-line-chart-inner-tooltip {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  gap: 5px;
-  color: var(--arrow-button-bg-color);
-  @extend .fontSm;
-}
-
-.ff--line-chart-x-line-data {
-  @extend .fontSm;
-}
-.ff-line-chart-y-axis-text {
-  @extend .fontSm;
-}
-
-.ff-line-chart-date {
-  height: 100%;
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: flex-start;
-  border-bottom: 1px solid var(--arrow-button-bg-color);
-  color: var(--arrow-button-bg-color);
-  @extend .fontSm;
-}
-.ff-line-chart-x-axis-label {
-  @extend .font-size-8;
-  font-weight: 600;
-}

package/lib/styles/LineLoader.scss

@@ -1,68 +0,0 @@
-@use '../../assets/styles/mixins' as *;
-
-.overlay-loader {
-  position: fixed;
-  inset: 0;
-  z-index: 1000000;
-  display: grid;
-  place-items: center;
-  .loader-container {
-    @include center-vertical;
-    gap: 50px;
-    justify-content: center;
-    flex-direction: column;
-    padding: 10px;
-    z-index: 99999;
-
-    .line_loader {
-      height: 2px;
-      width: 286px;
-      background-color: var(--line-loader-bg-color);
-      position: relative;
-      overflow: hidden;
-      box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.5);
-    }
-
-    .line_loader::before {
-      content: '';
-      position: absolute;
-      height: 100%;
-      width: 0%;
-      background: linear-gradient(to right, transparent, var(--base-bg-color));
-      animation: loadingEffect 7s infinite linear;
-    }
-
-    @keyframes loadingEffect {
-      0% {
-        width: 0%;
-        left: 0%;
-      }
-      40% {
-        width: 100%;
-        left: 0%;
-      }
-      70% {
-        width: 200%;
-        left: 0%;
-        background-color: var(--line-loader-bg-color); /* Fully filled */
-      }
-      80% {
-        width: 0%;
-        left: 0%;
-        background-color: var(--line-loader-bg-color); /* Stay filled */
-      }
-      90% {
-        width: 0%;
-        left: 0%;
-      }
-      100% {
-        width: 0%;
-        left: 0%;
-        background-color: var(--line-loader-bg-color);
-      }
-    }
-  }
-  &.overlay {
-    background: var(--line-loader-background-overlay);
-  }
-}

package/lib/styles/Link.scss

@@ -1,173 +0,0 @@
-@use '../../assets/styles/fonts';
-@use '../../assets/styles/mixins';
-
-.ff-link-input-fieldset {
-  display: inline-block;
-  border: none;
-  padding: 0;
-  margin: 0;
-  width: 100%;
-  border: 1px solid var(--input-default-border-color);
-  border-radius: 4px;
-  outline: none;
-  line-height: 18px;
-  border-radius: 4px;
-  height: 32px;
-
-  &--disabled {
-    border: 1px solid var(--input-default-border-color);
-    background: var(--input-disabled-background-color);
-    border-radius: 4px;
-    opacity: 0.5;
-  }
-  .ff-link-input-container {
-    @include mixins.horizontal-space-between();
-    position: relative;
-    width: 100%;
-    display: flex;
-    .ff-link-input {
-      padding: 6px 8px;
-      border-top-right-radius: 4px;
-      margin-left: 2px;
-      border: none;
-      outline: none;
-      line-height: 18px;
-      width: 100%;
-      @extend .fontSm;
-      &--medium {
-        padding: 10px 9px;
-      }
-      &:disabled {
-        cursor: not-allowed;
-        border: none;
-        background: transparent;
-      }
-      &::placeholder {
-        opacity: 0;
-        @extend .fontXs;
-        line-height: 15px;
-      }
-      &--danger {
-        border-color: var(--input-error-text-color);
-      }
-      &--transparentBackground {
-        background: transparent;
-      }
-      &--no-border {
-        border: none;
-      }
-      &--placeholder {
-        &::placeholder {
-          opacity: 1;
-        }
-      }
-    }
-
-    .ff-link-input-label-container {
-      @extend .ff-link-input;
-      width: auto;
-      display: flex;
-      gap: 2px;
-      position: absolute;
-      border: none;
-      outline: none;
-      line-height: 18px;
-      margin-top: 1px;
-      transition: all 0.3s ease-in-out;
-      &--medium {
-        line-height: 25px;
-      }
-      .ff-link-input-label {
-        color: var(--input-default-label-color);
-        &--danger {
-          color: var(--input-error-text-color);
-        }
-        &--disabled {
-          color: var(--input-default-border-color);
-          background-color: var(--input-label-bg-color);
-        }
-      }
-
-      .required-asterisk {
-        color: var(--input-error-text-color);
-      }
-    }
-    &:hover {
-      .ff-link-input-label {
-        color: var(--input-default-label-color);
-        &--no-hover {
-          color: var(--input-default-label-color);
-        }
-        &--disabled {
-          color: var(--input-default-border-color);
-        }
-        &--danger {
-          color: var(--input-error-text-color);
-        }
-      }
-      .ff-link-input {
-        &--disabled {
-          background: transparent;
-        }
-      }
-    }
-    &:focus-within {
-      .ff-link-input-label-container {
-        top: -9px;
-        @extend .fontXs;
-        background-color: var(--input-label-bg-color);
-        line-height: 15px;
-        padding: 0px 2px;
-        margin-left: 10px;
-      }
-      .ff-link-input-label {
-        &--primary {
-          color: var(--brand-color);
-        }
-        &--danger {
-          color: var(--input-error-text-color);
-        }
-      }
-      .ff-link-input {
-
-        &::placeholder {
-          opacity: 1;
-          margin-bottom: 1px;
-        }
-      }
-      .input-link-link-icon {
-        width: 24px;
-        height: 24px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-      }
-    }
-
-    &--float {
-      .ff-link-input-label-container {
-        top: -9px;
-        font-size: 10px;
-        background-color: var(--input-label-bg-color);
-        line-height: 15px;
-        padding: 0px 2px;
-        margin-left: 10px;
-      }
-      &--disabled {
-        cursor: not-allowed;
-        .ff-link-input-label-container {
-          cursor: not-allowed;
-        }
-      }
-    }
-  }
-  .ff-link-input-message {
-    @extend .fontXs;
-    padding: 0px 4px;
-    margin-left: 8px;
-    line-height: 15px;
-    &--danger {
-      color: var(--input-error-text-color);
-    }
-  }
-}

package/lib/styles/MachineInputField.scss

@@ -1,63 +0,0 @@
-.ff-machine-input-field-wrapper {
-  min-width: 100px;
-  height: 32px;
-  position: relative;
-  cursor: pointer;
-
-  &.cursor-event-none {
-    pointer-events: none;
-  }
-
-  .ff-machine-input-field,
-  .ff-machine-input-field-reverse {
-    height: 100%;
-    width: 100%;
-    border: 1px solid var(--ff-machine-input-field-border-color);
-    padding: 0 8px 0 0;
-    border-radius: 4px;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-
-    &:hover {
-      border-color: var(--ff-connecting-branch-color);
-    }
-
-    .ff-machine-icon-text-wrapper,
-    .ff-machine-icon-text-wrapper-reverse {
-      display: flex;
-      align-items: center;
-
-      .ff-machine-icon {
-        margin-left: 4px;
-      }
-
-      .ff-machine-text-reverse,
-      .ff-machine-text {
-        max-width: fit-content;
-      }
-
-      .ff-machine-text-reverse {
-        direction: ltr;
-      }
-    }
-
-    .ff-machine-icon-text-wrapper-reverse {
-      flex-direction: row-reverse;
-    }
-  }
-
-  .ff-machine-input-field-reverse {
-    flex-direction: row-reverse;
-  }
-
-  .ff-machine-input-label {
-    position: absolute;
-    top: -6px;
-    left: 8px;
-    background-color: var(--ff-machine-input-field-label-color);
-    border-radius: 4px;
-    padding: 1px 2px;
-    height: 12px;
-  }
-}

package/lib/styles/MediaPreview.scss

@@ -1,43 +0,0 @@
-.media-wrapper {
-  display: flex;
-  justify-content: center;
-  width: 100%;
-  height: 100%;
-
-  .ff-expand-icons {
-    position: absolute;
-    display: flex;
-    width: 25%;
-    height: 30%;
-    left: 75%;
-    gap: 8px;
-    top: 0;
-    background: var(--media-preview-corner-gradient);
-    z-index: 99;
-
-    .header-icons {
-      width: 16px;
-      height: 16px;
-      background-color: var(--ff-icon-hover-fill-color);
-      border-radius: 6px;
-      cursor: pointer;
-      position: relative;
-      left: 218px;
-      top: 16px;
-    }
-  }
-  .ff-custom-overlay {
-    opacity: 0.5;
-  }
-
-  img,
-  video {
-    border-radius: 8px;
-    width: auto;
-  }
-
-  .ff-video-preview {
-    height: 550px;
-    width: auto;
-  }
-}

package/lib/styles/MediaViewerModal.scss

@@ -1,110 +0,0 @@
-.ff-header-content {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-
-  .ff-header-title {
-    font-size: 14px;
-    font-weight: 500;
-    color: var(--text-color);
-  }
-}
-
-.ff-video-wrapper {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  aspect-ratio: 16 / 9;
-  background-color: var(--tooltip-bg-color);
-}
-
-.ff-media-video,
-.ff-media-image {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-  display: block;
-}
-
-.ff-top-right-icons {
-  position: absolute;
-  top: 10px;
-  right: 10px;
-  display: flex;
-  gap: 10px;
-  z-index: 2;
-}
-
-.ff-media-controls {
-  position: absolute;
-  bottom: 10px;
-  left: 10px;
-  right: 10px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 4px 8px;
-  border-radius: 10px;
-  background: rgba(0, 0, 0, 0.4);
-}
-
-.ff-play-pause-btn {
-  background: none;
-  border: none;
-  color: var(--primary-button-text-color);
-  font-size: 18px;
-  cursor: pointer;
-  padding: 4px;
-}
-
-.ff-progress-bar {
-  display: flex;
-  align-items: center;
-  width: 100%;
-  gap: 8px;
-
-  .ff-current-time,
-  .ff-total-time {
-    font-size: 12px;
-    min-width: 40px;
-    text-align: center;
-    color: var(--tooltip-text-color);
-  }
-
-  .ff-custom-slider {
-    flex: 1;
-    height: 20px;
-    position: relative;
-    cursor: pointer;
-    display: flex;
-    align-items: center;
-  }
-
-  .ff-slider-track {
-    width: 100%;
-    height: 10px;
-    background-color: var(--ff-bg-pearl-gray-color);
-    border-radius: 10px;
-    position: relative;
-  }
-
-  .ff-slider-progress {
-    height: 100%;
-    background-color: var(--ff-white-color);
-    border-radius: 10px;
-    transition: width 0.1s linear;
-  }
-
-  .ff-slider-thumb {
-    position: absolute;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    transition: left 2s linear , transform 0.2s linear;
-    width: 18px;
-    height: 18px;
-    background-color: var(--ff-white-color);
-    border-radius: 50%;
-    z-index: 1;
-    transition: left 0.1s linear;
-  }
-}