@brightspot/ui 3.0.1-cms-ui-migration.4 → 3.0.1

package/src/legacy/tool-ui/src/main/webapp/v4/rte/ProseMirrorContainer.less

@@ -1,29 +0,0 @@
-.ProseMirrorContainer {
-  border: 1px solid var(--Input-borderColor);
-  margin-bottom: var(--gap-m);
-  opacity: 1;
-  position: relative;
-  transition: all 1s var(--ease-out);
-
-  &.hide {
-    opacity: 0;
-  }
-
-  &:hover {
-    border-color: var(--Input-focusColor);
-  }
-
-  &:focus-within {
-    border-color: var(--Input-focusColor);
-  }
-
-  .CodeMirror {
-    border-width: 0;
-  }
-}
-
-&.is-htmlMode {
-  .CIG-wordCount {
-    display: none;
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/rte/plugins/ai_inline_manager/views/AIInline.less

@@ -1,244 +0,0 @@
-@import (reference) url('../../../../Dropdown.less');
-@import (reference) url('../../../../Icon.less');
-@import (reference) url('../../../../IconButton.less');
-
-// AI Inline Container
-.ProseMirrorAIInline-container {
-  background: var(--color-white);
-  border: 1px solid var(--color-gray3);
-  border-radius: var(--borderRadius-s);
-  box-shadow: var(--shadow-s);
-  left: 0;
-  order: 5;
-  overflow: hidden;
-  padding: var(--gap-s) var(--gap-s) 0;
-  position: relative;
-  right: 0;
-  z-index: var(--zIndex-dropdown);
-
-  &.collapsed,
-  &.is-loading,
-  &.has-suggestions {
-    display: none;
-  }
-
-  // Input Container
-  &-inputContainer {
-    align-items: center;
-    display: flex;
-    gap: var(--gap-s);
-    padding-bottom: var(--gap-s);
-
-    &-input {
-      border-radius: var(--fontSize-s);
-    }
-
-    &-submitButton {
-      .Icon;
-
-      background-color: var(--color-blue7);
-      border: none;
-      border-radius: var(--borderRadius-s);
-      color: var(--color-white);
-      cursor: pointer;
-      font-size: var(--Icon-size);
-
-      &::before {
-        content: 'send';
-      }
-
-      &.is-loading {
-        background-color: var(--color-red7);
-        color: var(--color-red3);
-
-        &::before {
-          content: 'stop_circle';
-        }
-      }
-    }
-  }
-
-  // Accept/Reject Container
-  &-acceptRejectContainer {
-    .Dropdown;
-
-    &:not([hidden]) {
-      .Dropdown.is-open;
-    }
-
-    &[hidden] {
-      display: none;
-    }
-  }
-
-  // Actions Menu
-  &-actions {
-    display: flex;
-    flex-direction: column;
-
-    &-accept,
-    &-rejectAll,
-    &-tryAgain {
-      border: none;
-      margin: 0;
-      padding: 0;
-
-      &-icon {
-        .Icon;
-
-        margin-right: var(--gap-xs);
-      }
-
-      > button {
-        align-items: center;
-        all: unset;
-        border-radius: var(--borderRadius-s);
-        box-sizing: border-box;
-        cursor: pointer;
-        display: flex;
-        gap: var(--gap-xs);
-        padding: var(--gap-s) var(--gap-m);
-        text-align: left;
-        width: 100%;
-
-        &:hover {
-          background-color: var(--color-gray3);
-        }
-      }
-    }
-
-    &-accept-icon::before {
-      content: 'check_circle';
-    }
-
-    &-rejectAll-icon::before {
-      content: 'cancel';
-    }
-
-    &-tryAgain-icon::before {
-      content: 'refresh';
-    }
-  }
-
-  // Suggestion Item
-  &-suggestion-item {
-    background: none;
-    border: none;
-    color: var(--color-gray9);
-    cursor: pointer;
-    font-size: var(--fontSize-s);
-    padding: var(--spacing-s) var(--spacing-m);
-    text-align: left;
-    transition: background-color var(--transition-fast);
-
-    &:hover {
-      background-color: var(--color-gray3);
-    }
-  }
-
-  // Suggestions Dropdown
-  &-suggestions {
-    &-dropdown {
-      border-top: 1px solid var(--color-gray3);
-      margin-left: calc(-1 * var(--gap-s));
-      margin-right: calc(-1 * var(--gap-s));
-      margin-top: var(--gap-s);
-      width: calc(100% + 2 * var(--gap-s));
-
-      &[hidden] {
-        display: none;
-      }
-    }
-
-    &-list {
-      display: flex;
-      flex-direction: column;
-
-      &-item {
-        padding-left: var(--gap-m);
-
-        > button {
-          all: unset;
-          background: transparent;
-          box-sizing: border-box;
-          cursor: pointer;
-          display: block;
-          text-align: left;
-          width: 100%;
-
-          &:disabled,
-          &.is-disabled {
-            cursor: default;
-            opacity: 0.5;
-          }
-        }
-
-        &.is-empty {
-          cursor: default;
-          padding: var(--gap-s) var(--gap-m);
-          pointer-events: none;
-        }
-      }
-    }
-
-    &-title {
-      color: var(--color-gray5);
-      font-size: var(--fontSize-s);
-      margin: var(--gap-m) var(--gap-m) var(--gap-s);
-    }
-  }
-}
-
-// Loading Overlay
-.ProseMirrorAIInline-loadingOverlay {
-  background-color: var(--color-white);
-  border-top: 1px solid var(--color-gray3);
-  display: none;
-  flex-direction: column;
-  order: 5;
-  padding: var(--gap-s) var(--gap-s) 0;
-
-  &.is-loading {
-    display: flex;
-  }
-
-  &-prompt {
-    color: var(--color-gray5);
-    font-size: var(--fontSize-s);
-    margin: 0 0 var(--gap-s);
-  }
-
-  &-spinner {
-    display: flex;
-    padding: var(--gap-s) 0;
-
-    &-icon {
-      .Icon;
-
-      animation: spin 1s linear infinite;
-      height: var(--Icon-size);
-      margin-top: 0;
-      width: var(--Icon-size);
-
-      &::before {
-        content: 'refresh';
-      }
-    }
-
-    &-text {
-      color: var(--color-gray5);
-      font-size: var(--fontSize-s);
-      margin: 0 var(--gap-m) 0 var(--gap-xs);
-    }
-  }
-}
-
-@keyframes spin {
-  0% {
-    transform: rotate(0deg);
-  }
-
-  100% {
-    transform: rotate(360deg);
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/rte/plugins/collab_manager/views/AvatarView.less

@@ -1,11 +0,0 @@
-.ProseMirrorAvatarWrapper {
-  position: absolute;
-  right: 0;
-  top: calc(var(--gap-l) * -2);
-
-  .ToolUserAvatar {
-    border: 1px solid var(--color-white);
-    float: left;
-    margin-left: calc(var(--gap-m) * -1);
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/rte/plugins/collab_manager/views/CollabEditing.less

@@ -1,18 +0,0 @@
-@import (reference) url('../../../../Text.less');
-
-.CollabEditing {
-  &-message {
-    margin-top: var(--gap-s);
-
-    &-isLocked {
-      .Text.is-s;
-
-      background-color: var(--color-yellow1);
-      border-left: var(--gap-m) solid var(--color-yellow6);
-      color: var(--color-yellow6);
-      display: block;
-      padding-left: var(--gap-m);
-      width: 100%;
-    }
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/rte/plugins/custom_keyboard/CustomKeyboard.less

@@ -1,21 +0,0 @@
-.CustomKeyboard {
-  li {
-    display: inline-block;
-
-    button {
-      margin-bottom: var(--gap-s);
-      margin-right: var(--gap-s);
-      min-height: 24px;
-      min-width: 48px;
-      text-transform: none;
-
-      &:hover {
-        box-shadow: calc(var(--gap-s) / 2) calc(var(--gap-xs) / 2)
-          calc(var(--gap-xs) / 2) var(--color-gray4);
-        position: relative;
-        transform: scale(1.5);
-        z-index: 99;
-      }
-    }
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/rte/plugins/enhancement_manager/views/Enhancement.less

@@ -1,67 +0,0 @@
-@import (reference) url('../../../../Reset.less');
-
-.Enhancement {
-  margin: var(--Text-height) 0;
-  position: relative;
-
-  &.readOnly {
-    .Icon.is-s;
-    .Text.is-s;
-
-    background: var(--color-gray1);
-    margin: var(--Text-height) calc(0px - var(--gap-m));
-    padding: var(--gap-m);
-
-    ::selection,
-    &.ProseMirror-selectednode {
-      color: var(--color-black);
-    }
-
-    &.ProseMirror-selectednode {
-      background: var(--color-dominant2);
-    }
-  }
-
-  &-initialBody {
-    display: block;
-    font-style: italic;
-  }
-
-  &.is-locked {
-    cursor: auto;
-  }
-
-  &.block {
-    display: block;
-  }
-
-  &.inPlay {
-    opacity: 0.2;
-  }
-
-  .rte2-block-preview {
-    .rte2-style-ins-delete & {
-      margin: 0;
-    }
-
-    .rte2-style-ins-insert & {
-      margin: 0;
-    }
-
-    .rte2-style-ins-ai & {
-      margin: 0;
-    }
-  }
-
-  .rte2-style-ins-delete & {
-    background: var(--color-red3);
-  }
-
-  .rte2-style-ins-insert & {
-    background: var(--color-green3);
-  }
-
-  .rte2-style-ins-ai & {
-    background: var(--color-blue3);
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/rte/plugins/enhancement_manager/views/PreviewView.less

@@ -1,45 +0,0 @@
-@import (reference) url('../../../../Text.less');
-
-.Enhancement {
-  &.hasPreview {
-    ::selection {
-      background: transparent;
-    }
-  }
-
-  &.readOnly.ProseMirror-selectednode.block .Enhancement-preview {
-    background: var(--color-dominant2);
-  }
-
-  &:focus {
-    background-color: transparent;
-  }
-
-  &-preview {
-    .Text.is-m;
-
-    background: var(--color-gray1);
-    margin-left: calc(var(--gap-m) * -1);
-    margin-right: calc(var(--gap-m) * -1);
-    padding: var(--gap-s) var(--gap-m);
-
-    &-label {
-      font-style: italic;
-    }
-  }
-
-  &:not(.block) .Enhancement-preview {
-    background: transparent;
-  }
-
-  .rte2-block-preview {
-    margin-top: var(--gap-m);
-
-    img {
-      display: block;
-      height: auto;
-      max-height: 30vh;
-      max-width: 100%;
-    }
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/rte/plugins/enhancement_manager/views/ProsemirrorEnhancementMenu.less

@@ -1,113 +0,0 @@
-@import (reference) url('../../../../Icon.less');
-@import (reference) url('../../../../IconButton.less');
-@import (reference) url('../../../../Reset.less');
-
-.ProsemirrorEnhancementMenuContainer {
-  display: none;
-  max-width: 50vw;
-  position: absolute;
-  z-index: 2;
-
-  @media (@mq-l) {
-    max-width: 31vw;
-  }
-
-  &.open {
-    display: block;
-  }
-}
-
-.ProsemirrorEnhancementMenu:not(:first-child) {
-  margin-top: var(--gap-xs);
-}
-
-.ProsemirrorEnhancementMenu {
-  margin-bottom: 0;
-
-  &.open {
-    opacity: 1;
-    visibility: visible;
-  }
-
-  &-container {
-    align-items: center;
-    background: var(--color-white);
-    box-shadow: var(--shadow-3);
-    display: flex;
-    font-size: var(--fontSize-s);
-    line-height: var(--lineHeight-s);
-    margin-bottom: 0;
-    position: relative;
-    white-space: nowrap;
-
-    --Text-height: var(--lineHeight-s);
-
-    &-link,
-    &-link-goto {
-      color: var(--Input-placeholderColor);
-      cursor: pointer;
-      line-height: 28px;
-    }
-
-    &-link,
-    &-link-goto {
-      margin-right: 10px;
-      text-decoration: underline;
-    }
-
-    &-link {
-      display: none;
-      max-width: 15vw;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-
-      @media (@mq-l) {
-        display: inline-block;
-      }
-    }
-
-    &-link-goto {
-      margin-right: 10px;
-      text-decoration: underline;
-
-      @media (@mq-l) {
-        display: none;
-      }
-    }
-
-    &-label {
-      background: var(--color-dominant1);
-      font-weight: 700;
-      height: calc(var(--Icon-size) + 2 * var(--gap-s));
-      line-height: var(--Icon-size);
-      margin-right: 5px;
-      padding: var(--gap-s) var(--gap-m);
-    }
-
-    &-button {
-      .IconButton;
-
-      &::before {
-        content: attr(data-icon);
-      }
-
-      &.remove {
-        .IconButton.is-red;
-      }
-    }
-
-    &.is-block {
-      background: transparent;
-      box-shadow: none;
-      position: absolute;
-      right: calc(var(--gap-m) - var(--gap-s));
-      top: calc(var(--gap-m) - var(--gap-s));
-      z-index: 3;
-    }
-
-    .open & {
-      visibility: visible;
-    }
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/rte/plugins/find_replace_manager/views/ProseMirrorFindReplace.less

@@ -1,174 +0,0 @@
-@import (reference) url('../../../../IconButton.less');
-@import (reference) url('../../../../Icon.less');
-@import (reference) url('../../../../Reset.less');
-
-.ProseMirrorFindReplace {
-  &-found {
-    background-color: var(--color-yellow2);
-  }
-
-  &-found {
-    &.active {
-      background-color: var(--color-yellow4);
-    }
-  }
-
-  &-findContainer {
-    background-color: var(--color-gray1);
-    display: block;
-    margin-bottom: -1px;
-    order: 5;
-    padding: var(--gap-m);
-
-    &.collapsed {
-      display: none;
-    }
-
-    &-replaceContainer,
-    &-inputContainer {
-      align-items: center;
-      display: flex;
-    }
-
-    &-input,
-    &-replace-input {
-      background-color: var(--color-white);
-      border: none;
-      border-radius: var(--gap-l);
-      flex: 1 0 48%;
-      margin-right: var(--gap-m);
-      max-width: 48%;
-      padding-left: var(--gap-m);
-
-      &:focus {
-        background-color: var(--color-white);
-      }
-    }
-
-    &-more {
-      .Icon;
-
-      cursor: pointer;
-
-      [dir='rtl'] & {
-        left: 0;
-        right: auto;
-      }
-
-      &::before {
-        content: 'keyboard_arrow_down';
-      }
-
-      &.open {
-        &::before {
-          content: 'keyboard_arrow_up';
-        }
-      }
-    }
-
-    &-pagination {
-      flex: 1 0 0;
-      font-size: var(--fontSize-s);
-
-      [dir='rtl'] & {
-        left: 10%;
-        right: auto;
-      }
-
-      &-prev,
-      &-next {
-        .Icon;
-        .Link.is-black;
-
-        background: transparent;
-        border: none;
-        cursor: pointer;
-        padding: unset;
-
-        &.disabled {
-          cursor: auto;
-          opacity: 0.3;
-          pointer-events: none;
-        }
-      }
-
-      &-prev::before {
-        content: 'keyboard_arrow_left';
-        margin-right: var(--gap-m);
-      }
-
-      &-next::before {
-        content: 'keyboard_arrow_right';
-        margin-left: var(--gap-m);
-      }
-    }
-
-    &-replaceContainer {
-      align-items: start;
-      display: flex;
-      flex-flow: column wrap;
-      height: auto;
-      max-height: 600px;
-      overflow: hidden;
-      transition: max-height 0.8s;
-
-      > * {
-        margin-top: var(--gap-m);
-      }
-
-      &.collapsed {
-        max-height: 0;
-      }
-    }
-
-    &-options {
-      flex: 1 0 30%;
-
-      label {
-        font-weight: 500;
-        margin-right: var(--gap-m);
-        white-space: nowrap;
-      }
-
-      input[type] {
-        margin-right: var(--gap-s);
-        vertical-align: bottom;
-      }
-    }
-
-    &-actions {
-      button {
-        &:first-child {
-          background-color: var(--Link-color);
-          color: var(--color-white);
-          margin-right: var(--gap-m);
-        }
-
-        &:disabled {
-          cursor: auto;
-          opacity: 0.3;
-          pointer-events: none;
-        }
-      }
-    }
-  }
-}
-
-@media (@mq-s) {
-  .ProseMirrorFindReplace-findContainer-replaceContainer {
-    align-items: center;
-    flex-direction: row;
-  }
-
-  .ProseMirrorFindReplace-findContainer-actions {
-    text-align: right;
-    width: 100%;
-  }
-}
-
-@media (@mq-m) {
-  .ProseMirrorFindReplace-findContainer-actions {
-    text-align: left;
-    width: auto;
-  }
-}