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

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

@@ -1,43 +0,0 @@
-.ApiKey-apiKey {
-  font-size: 18px;
-  font-weight: bold;
-  padding-top: 4px;
-}
-
-.ApiKeyConfig-value.CIG-row {
-  display: none;
-}
-
-.ApiKey-value {
-  margin-right: 4px;
-}
-
-.ApiKey-copy {
-  margin-right: 4px;
-  position: relative;
-  top: -2px;
-}
-
-.ApiKey-copyConfirmed {
-  color: var(--color-green5);
-  display: none;
-
-  .ApiKey-copy:state(btu-copy-to-clipboard-copied) + & {
-    display: inline-block;
-  }
-}
-
-// Hides the read-only field/method that only exists to display a better/friendlier note
-.CIG[data-type='com.psddev.cms.api.ApiClient']
-  > .CIG-row[data-field-name='getClientId']
-  > .CIG-small {
-  display: none;
-}
-
-// Hides the add button on the deprecated API Keys field
-.CIG[data-type='com.psddev.cms.api.ApiClient']
-  > .CIG-row[data-field='keys']
-  > .RCIG
-  > .RCIG-controls {
-  display: none;
-}

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

@@ -1,36 +0,0 @@
-@import url('./TextInput.less');
-
-.AutoExpand {
-  display: grid;
-  grid-template-columns: 100%;
-  width: 100%;
-
-  &::before,
-  > .AutoExpand-shim,
-  > textarea {
-    grid-area: ~'1 / 1 / 2 / 2';
-  }
-
-  &::before,
-  > .AutoExpand-shim {
-    .TextInput;
-
-    content: attr(data-value) ' ';
-    overflow-wrap: break-word;
-    visibility: hidden;
-    white-space: pre-wrap;
-  }
-
-  > btu-textarea-input > textarea,
-  > textarea {
-    field-sizing: content; /* stylelint-disable-line property-no-unknown */
-    overflow: hidden;
-  }
-
-  &.is-noShim {
-    &::before,
-    > .AutoExpand-shim {
-      display: none;
-    }
-  }
-}

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

@@ -1,30 +0,0 @@
-:root {
-  --Avatar-size: var(--gap-xl);
-}
-
-.Avatar {
-  align-items: center;
-  background-color: var(--avatar-bg-color, var(--color-gray2));
-  border-radius: 50%;
-  color: var(--color-black);
-  display: flex;
-  font-size: calc(var(--Avatar-size) / 3);
-  height: var(--Avatar-size);
-  justify-content: center;
-  position: relative;
-  text-transform: uppercase;
-  user-select: none;
-  width: var(--Avatar-size);
-
-  img {
-    border-radius: 50%;
-    bottom: 0;
-    height: 100%;
-    left: 0;
-    object-fit: cover;
-    position: absolute;
-    right: 0;
-    top: 0;
-    width: 100%;
-  }
-}

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

@@ -1,52 +0,0 @@
-.BackgroundTasks {
-  .Button {
-    &.is-red {
-      background: var(--color-red6);
-      border-color: var(--color-red6);
-      color: var(--color-white);
-      float: right;
-
-      &:hover,
-      &:focus {
-        background: var(--color-red7);
-        border-color: var(--color-red7);
-        color: var(--color-white);
-      }
-    }
-
-    &.is-taskaction {
-      margin-left: var(--gap-m);
-    }
-  }
-
-  .TaskDisplay {
-    align-items: center;
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-
-    form {
-      display: flex;
-    }
-  }
-
-  .visibilityLabel {
-    &.is-green {
-      background: var(--color-green5);
-      border-color: var(--color-green5);
-      color: var(--color-white);
-    }
-
-    &.is-yellow {
-      background: var(--color-yellow3);
-      border-color: var(--color-yellow3);
-      color: var(--color-black);
-    }
-
-    &.is-red {
-      background: var(--color-red6);
-      border-color: var(--color-red6);
-      color: var(--color-white);
-    }
-  }
-}

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

@@ -1,10 +0,0 @@
-.Badge {
-  background: var(--color-gray6);
-  border-radius: calc(var(--Text-height) / 2);
-  color: var(--color-white);
-  display: inline-block;
-  margin-left: var(--gap-s);
-  min-width: var(--Text-height);
-  padding: 0 var(--gap-s);
-  text-align: center;
-}

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

@@ -1,311 +0,0 @@
-.SearchResult-dragContainer {
-  left: 0;
-  position: fixed;
-  top: 0;
-  z-index: var(--BoardContainer-zIndex, 10000);
-}
-
-.SearchResult-board {
-  height: 100%;
-  position: relative;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
-}
-
-.SearchResult-board-column {
-  --BoardColumn-minWidth: 276px;
-  --BoardColumn-maxWidth: 400px;
-  --BoardColumn-calcWidth: clamp(
-    var(--BoardColumn-minWidth),
-    calc(100% / var(--columnCount)),
-    var(--BoardColumn-maxWidth)
-  );
-
-  border-right: 1px solid var(--color-gray3);
-  display: flex;
-  left: 0;
-  min-height: 100%;
-  position: absolute;
-  top: 0;
-  width: var(--BoardColumn-calcWidth);
-  z-index: 1;
-
-  &:nth-child(6n + 1) {
-    background-color: var(--color-purple1);
-
-    .BoardView-title {
-      border-bottom: solid 2px var(--color-purple4);
-    }
-  }
-
-  &:nth-child(6n + 2) {
-    background-color: var(--color-blue1);
-
-    .BoardView-title {
-      border-bottom: solid 2px var(--color-blue4);
-    }
-  }
-
-  &:nth-child(6n + 3) {
-    background-color: var(--color-green1);
-
-    .BoardView-title {
-      border-bottom: solid 2px var(--color-green4);
-    }
-  }
-
-  &:nth-child(6n + 4) {
-    background-color: var(--color-yellow1);
-
-    .BoardView-title {
-      border-bottom: solid 2px var(--color-yellow4);
-    }
-  }
-
-  &:nth-child(6n + 5) {
-    background-color: var(--color-orange1);
-
-    .BoardView-title {
-      border-bottom: solid 2px var(--color-orange4);
-    }
-  }
-
-  &:nth-child(6n + 6) {
-    background-color: var(--color-red1);
-
-    .BoardView-title {
-      border-bottom: solid 2px var(--color-red4);
-    }
-  }
-}
-
-.SearchResult-board-columnContent {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-}
-
-.BoardView-title {
-  align-items: center;
-  background-color: var(--color-white);
-  color: var(--color-black);
-  display: flex;
-  margin: 0;
-  min-height: var(--gap-xl);
-  overflow: hidden;
-  padding: 0 var(--gap-s);
-  position: relative;
-  text-indent: var(--gap-s);
-  text-transform: capitalize;
-
-  &::after {
-    content: '(' attr(data-count) ')';
-    font-weight: normal;
-  }
-}
-
-.BoardView-listContainer {
-  flex-grow: 1;
-  overflow-y: auto;
-  position: relative;
-}
-
-.BoardView-list {
-  border-bottom: var(--gap-s) solid transparent;
-  list-style-type: none;
-  margin: 0;
-  min-height: 100%;
-  position: absolute;
-  width: 100%;
-}
-
-.BoardView-card {
-  background: var(--color-white);
-  box-shadow: var(--shadow-1);
-  list-style-type: none;
-  margin: 0 var(--gap-s) var(--gap-s) var(--gap-s);
-  min-width: calc(100% - var(--gap-s) * 2);
-  position: absolute;
-  z-index: 10;
-
-  .ContentSummary-content {
-    .ContentSummary-row {
-      display: flex;
-      flex-wrap: wrap;
-      margin-bottom: unset;
-
-      .ContentSummary-subtitle {
-        margin-bottom: unset;
-        margin-right: var(--gap-xs);
-      }
-
-      .ContentSummary-link {
-        flex: 1;
-      }
-
-      .ContentSummary-subtitle {
-        flex-basis: 100%;
-      }
-    }
-
-    .SearchResult-summary {
-      margin-bottom: var(--gap-l);
-    }
-
-    .Viewers {
-      float: right;
-    }
-  }
-}
-
-.BoardView-card.is-saving {
-  pointer-events: none;
-
-  .ContentSummary-content {
-    opacity: 0.4 !important;
-  }
-
-  &::after {
-    &:extend(.Icon);
-
-    animation: spin var(--time-xl) infinite ease-in-out;
-    content: 'sync';
-    left: calc(50% - var(--Icon-size) / 2);
-    position: absolute;
-    top: calc(50% - var(--Icon-size) / 2);
-  }
-}
-
-.BoardView-card .ContentSummary-content {
-  padding: var(--gap-m) var(--gap-m) var(--gap-l);
-}
-
-.BoardView-card.muuri-item-dragging .ContentSummary-content {
-  transform: rotateZ(0.5deg);
-  transition: transform 0.12s ease;
-}
-
-.BoardView-card.muuri-item-releasing {
-  z-index: 11;
-}
-
-.BoardView-card.muuri-item-dragging {
-  box-shadow: var(--shadow-2);
-  cursor: move;
-  z-index: 12;
-}
-
-.BoardView-card.muuri-item-hidden {
-  z-index: 8;
-}
-
-.BoardView-card.muuri-item-placeholder {
-  filter: blur(1px);
-  margin: 0;
-  opacity: 0.6;
-  z-index: 9;
-}
-
-// Overrides standard search styles, establishes grid layout
-.SearchResult-items.is-muuri {
-  display: grid;
-  grid-auto-rows: auto 1fr;
-  margin-top: unset;
-  padding: unset;
-
-  .SearchResult-views {
-    position: unset;
-  }
-
-  .SearchResult-view {
-    display: grid;
-    grid-template: 'fields fields fields' auto 'sorts sorts actions' auto 'board board board' 1fr ~'/' auto auto 1fr;
-  }
-
-  .SearchResult-actions-wrapper {
-    grid-area: actions;
-    justify-self: end;
-    padding: var(--gap-xs) var(--gap-l) var(--gap-xs) 0;
-  }
-
-  .SearchResult-sorts {
-    align-self: center;
-    grid-area: sorts;
-    padding-left: var(--gap-l);
-  }
-
-  .SearchResult-boardContainer {
-    background-color: var(--color-gray1);
-    border-top: 1px solid var(--color-gray3);
-    grid-area: board;
-    overflow-x: scroll;
-
-    .moreCards-button,
-    .moreColumns-button {
-      display: none;
-    }
-  }
-}
-
-.SearchResult-board-fields {
-  align-self: center;
-  display: flex;
-  grid-area: fields;
-  justify-self: start;
-  margin-right: var(--gap-l);
-  padding-left: var(--gap-l);
-  padding-top: var(--gap-s);
-
-  .ComboInput::before {
-    border-bottom-width: 0;
-  }
-
-  .SearchResult-fields {
-    padding-top: var(--gap-s);
-    white-space: nowrap;
-  }
-}
-
-@media (@mq-m) {
-  .SearchResult-items.is-muuri .SearchResult-view {
-    grid-template: 'fields sorts actions' auto 'board board board' 1fr ~'/' auto auto 1fr;
-
-    .SearchResult-board-fields {
-      padding-top: unset;
-    }
-
-    .SearchResult-sorts {
-      padding-left: unset;
-    }
-  }
-}
-
-.SearchResult-board-errors {
-  bottom: 0;
-  max-height: 50%;
-  max-width: 350px;
-  overflow: auto;
-  position: fixed;
-  right: 0;
-  z-index: 100;
-
-  li {
-    margin-bottom: var(--gap-m);
-  }
-}
-
-.SearchResult-board-errors-close {
-  .Text.is-l;
-
-  color: var(--color-white);
-  cursor: pointer;
-  height: var(--gap-l);
-  position: absolute;
-  right: var(--gap-s);
-  text-align: center;
-  top: var(--gap-s);
-  width: var(--gap-l);
-  z-index: 100;
-}

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

@@ -1,17 +0,0 @@
-.BulletedList {
-  list-style-type: disc;
-  padding-left: var(--gap-l);
-
-  > li {
-    &:not(:last-child) {
-      margin-bottom: var(--gap-xs);
-    }
-
-    &.is-selected {
-      background: var(--color-gray3);
-      list-style-type: none;
-      margin-left: calc(0px - var(--gap-l));
-      padding-left: var(--gap-l);
-    }
-  }
-}

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

@@ -1,105 +0,0 @@
-.Button {
-  align-items: center;
-  -webkit-appearance: none;
-  background: var(--color-white);
-  border: 1px solid var(--Link-color);
-  color: var(--Link-color);
-  cursor: pointer;
-  display: inline-flex;
-  font-size: var(--fontSize-s);
-  font-weight: bold;
-  justify-content: center;
-  padding: calc(var(--gap-s) - 1px) var(--gap-m);
-  position: relative;
-  text-align: center;
-  text-decoration: none;
-  text-transform: uppercase;
-  transition-duration: var(--time-xs);
-  transition-property: background-color, border-color, color;
-  transition-timing-function: ease-in-out;
-  user-select: none;
-  vertical-align: middle;
-
-  .is-submitting &.is-clicked {
-    pointer-events: none;
-
-    &:not(.Link) {
-      &::before {
-        background: rgb(255 255 255 / 70%);
-        bottom: -1px;
-        content: '';
-        left: -1px;
-        position: absolute;
-        right: -1px;
-        top: -1px;
-      }
-
-      &::after {
-        .Icon;
-
-        animation: spin var(--time-xl) infinite ease-in-out;
-        color: var(--color-black);
-        content: 'autorenew';
-        left: calc(50% - var(--Icon-size) / 2);
-        position: absolute;
-        top: calc(50% - var(--Icon-size) / 2);
-      }
-    }
-  }
-}
-
-.Button.is-focused {
-  border-color: var(--Link-hoverColor);
-  color: var(--Link-hoverColor);
-  text-decoration: none;
-}
-
-.Button {
-  &:hover {
-    .Button.is-focused;
-  }
-}
-
-button,
-input[type='submit'] {
-  &:extend(.Button all);
-}
-
-.Button.is-dominant {
-  background: var(--Link-color);
-  border-color: var(--Link-color);
-  color: var(--color-white);
-
-  &:hover,
-  &:focus {
-    background: var(--Link-hoverColor);
-    border-color: var(--Link-hoverColor);
-    color: var(--color-white);
-  }
-}
-
-.Button.is-green {
-  background: var(--color-green5);
-  border-color: var(--color-green5);
-  color: var(--color-white);
-
-  &:hover,
-  &:focus {
-    background: var(--color-green6);
-    border-color: var(--color-green6);
-    color: var(--color-white);
-  }
-}
-
-.Button.is-yellow {
-  background: var(--color-yellow3);
-  border-color: var(--color-yellow3);
-  color: var(--color-black);
-
-  &:hover,
-  &:focus {
-    background: var(--color-yellow3);
-    border-color: var(--color-yellow5);
-    color: var(--color-black);
-  }
-}

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

@@ -1,55 +0,0 @@
-btu-cig-cluster {
-  .CIG-title {
-    padding: 0;
-  }
-
-  &:state(btu-error) {
-    .CIG-title {
-      color: var(--color-red6);
-
-      .CIG-titleText::after {
-        .Icon;
-
-        content: 'error';
-        margin-left: var(--gap-s);
-        vertical-align: middle;
-      }
-    }
-  }
-
-  button {
-    background: transparent;
-    border: 0;
-    color: inherit;
-    display: flex;
-    justify-content: space-between;
-    padding: 0 var(--gap-m);
-    text-transform: none;
-    width: 100%;
-
-    .CIG-titleToggle {
-      .IconButton;
-
-      --IconButton-name: 'keyboard_arrow_up';
-
-      position: absolute;
-      right: calc(var(--CIG-padding) - var(--gap-l) - var(--gap-s));
-      top: calc(50% - var(--Icon-size) / 2 - var(--gap-s));
-      transform: rotate(180deg);
-      transition: transform var(--time-xs);
-    }
-
-    &:hover,
-    &:focus {
-      color: inherit;
-
-      .CIG-titleToggle {
-        .IconButton.is-focus;
-      }
-    }
-
-    &[aria-expanded='true'] > .CIG-titleToggle {
-      transform: none;
-    }
-  }
-}

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

@@ -1,53 +0,0 @@
-.Card {
-  background: var(--color-white);
-  box-shadow: var(--shadow-1);
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  width: 100%;
-
-  &:hover {
-    box-shadow: var(--shadow-2);
-  }
-}
-
-.Card-media {
-  align-items: center;
-  display: flex;
-  justify-content: center;
-
-  img {
-    display: block;
-    height: auto;
-    width: 100%;
-  }
-
-  // Supply a max size because in some instances the image is not constrained by a wrapping element.
-  > img {
-    max-width: 120px;
-  }
-}
-
-.Card-media.is-missing {
-  margin: auto;
-  min-height: 75px;
-
-  &::before {
-    .Icon;
-
-    color: var(--color-gray3);
-    content: 'widgets';
-    display: flex;
-    font-size: var(--fontSize-xxl);
-    text-decoration: none;
-  }
-
-  &:hover {
-    text-decoration: none;
-  }
-}
-
-.Card-title {
-  background: var(--color-gray2);
-  padding: var(--gap-m) var(--gap-l);
-}