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

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

@@ -1,322 +0,0 @@
-.Widget[name='diff'] {
-  margin: 0;
-  padding: 0;
-}
-
-.Diff {
-  --RevisionCompare-titleHeight: calc(var(--gap-m) * 2 + var(--Icon-size));
-
-  position: relative;
-
-  .TabBar {
-    left: 0;
-    margin: 0;
-    padding: 0;
-    position: sticky;
-  }
-
-  .CIG-row {
-    border-right: 1px solid var(--color-gray3);
-  }
-}
-
-.Diff-row {
-  display: flex;
-  flex-flow: row nowrap;
-
-  .CIG-label {
-    padding-bottom: var(--gap-l);
-  }
-}
-
-.Diff-heading,
-.Diff-current,
-.Diff-comparison {
-  min-width: 400px;
-  overflow: hidden;
-  width: 50%;
-}
-
-.Diff-title {
-  .Link;
-  .Popup-heading;
-
-  position: sticky;
-  text-align: start;
-  top: 0;
-  width: 100%;
-  z-index: 1;
-
-  &:hover {
-    cursor: pointer;
-  }
-}
-
-.Diff-container {
-  max-height: 100vh;
-  overflow: scroll;
-  position: relative;
-}
-
-.Diff-diff {
-  max-width: 100vw;
-  overflow-y: scroll;
-  padding: 0;
-
-  .Message {
-    margin-left: 0;
-    width: 100%;
-  }
-}
-
-.Diff-heading {
-  min-width: 400px;
-  overflow: hidden;
-  width: 50%;
-}
-
-.Diff-heading {
-  &:first-child {
-    border-right: 1px solid var(--color-gray3);
-  }
-
-  &.Revision .Message.is-live {
-    --Revision-revisionBackgroundColor: var(--color-green1);
-  }
-
-  &.Revision .Message .ContentEdit-revisionInfo {
-    margin-bottom: 0;
-  }
-
-  .Message {
-    border-bottom: solid 4px var(--Revision-revisionColor);
-  }
-}
-
-.Diff-message {
-  .Text.is-m;
-
-  margin: 0;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.Diff-revisionDate,
-.Diff-revisionUser {
-  &::before {
-    content: '\22C5';
-    margin: 0 var(--gap-xs);
-  }
-}
-
-.Diff-current,
-.Diff-comparison {
-  padding: var(--gap-l) var(--gap-xl);
-
-  img {
-    height: auto;
-    width: 100%;
-  }
-}
-
-.Diff-current {
-  border-right: 1px solid var(--color-gray3);
-  padding-right: var(--gap-l);
-}
-
-.Diff-field {
-  ins *,
-  del * {
-    background-color: inherit;
-  }
-
-  .Diff-insert,
-  ins .Diff-enhancement,
-  ins {
-    background-color: var(--color-green3);
-  }
-
-  .Diff-delete,
-  del .Diff-enhancement,
-  del {
-    background-color: var(--color-red3);
-    color: var(--color-red6);
-    text-decoration: line-through;
-  }
-
-  del .Diff-enhancement {
-    text-decoration: none;
-  }
-
-  dt::after {
-    content: ':';
-  }
-
-  dd {
-    display: inline-block;
-    margin-bottom: var(--gap-m);
-    margin-left: var(--gap-m);
-  }
-
-  a,
-  b,
-  i,
-  em,
-  code,
-  u,
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  s {
-    all: revert;
-  }
-
-  ul,
-  ol {
-    all: revert;
-    background-color: inherit;
-    list-style-position: inside;
-    margin-left: var(--gap-xl);
-  }
-
-  table {
-    background-color: inherit;
-    min-width: 100%;
-
-    .Diff-enhancement {
-      border: solid 2px var(--color-gray3);
-    }
-  }
-
-  td {
-    border: solid 1px var(--color-gray3);
-    padding: var(--gap-s);
-  }
-
-  [data-diff-state] {
-    cursor: pointer;
-    position: relative;
-
-    &::after {
-      .Icon;
-
-      bottom: auto;
-      color: var(--color-black);
-      content: 'info';
-      display: block;
-      opacity: 1;
-      position: absolute;
-      right: var(--gap-s);
-      top: var(--gap-s);
-    }
-  }
-
-  .Diff-enhancement {
-    background-color: var(--color-gray1);
-    display: inline-block;
-    margin: var(--gap-m) 0;
-    padding: var(--gap-s);
-  }
-
-  .Diff-enhancement.block {
-    display: block;
-  }
-
-  .Diff-enhancement img {
-    max-height: 300px;
-    object-fit: contain;
-  }
-
-  .Diff-enhancementLabel {
-    display: inline-block;
-    font-size: small;
-    font-style: italic;
-    margin-bottom: var(--gap-s);
-    margin-right: var(--gap-s);
-  }
-
-  .Diff-enhancement {
-    &.rte2-style-brightspot-core-carousel-CarouselRichTextElement,
-    &.rte2-style-brightspot-core-image-ImageRichTextElement,
-    &.rte2-style-brightspot-core-module-ModuleRichTextElement,
-    &.rte2-style-brightspot-core-video-VideoRichTextElement,
-    &.rte2-style-brightspot-core-playlist-PlaylistRichTextElement,
-    &.rte2-style-brightspot-media-podcast-PodcastRichTextElement,
-    &.rte2-style-com-psddev-cms-rte-ExternalContentRichTextElement,
-    &.rte2-style-brightspot-core-quote-QuoteRichTextElement {
-      &::before {
-        .Icon;
-
-        margin-right: var(--gap-xs);
-      }
-    }
-
-    &.rte2-style-brightspot-core-carousel-CarouselRichTextElement::before {
-      content: 'photo_library';
-    }
-
-    &.rte2-style-brightspot-core-image-ImageRichTextElement::before {
-      content: 'photo';
-    }
-
-    &.rte2-style-brightspot-core-module-ModuleRichTextElement::before {
-      content: 'view_module';
-    }
-
-    &.rte2-style-brightspot-core-video-VideoRichTextElement::before {
-      content: 'ondemand_video';
-    }
-
-    &.rte2-style-brightspot-core-playlist-PlaylistRichTextElement::before {
-      content: 'playlist_play';
-    }
-
-    &.rte2-style-brightspot-media-podcast-PodcastRichTextElement::before {
-      content: 'music_note';
-    }
-
-    &.rte2-style-brightspot-core-quote-QuoteRichTextElement::before {
-      content: 'format_quote';
-    }
-
-    &.rte2-style-com-psddev-cms-rte-ExternalContentRichTextElement::before {
-      content: 'settings_ethernet';
-    }
-  }
-}
-
-.Diff-embed {
-  background: var(--color-yellow1);
-  padding-left: var(--gap-m);
-
-  .CIG-row {
-    background: var(--color-white);
-    border-right: none;
-    padding-left: var(--gap-s);
-  }
-}
-
-@media (@mq-m) {
-  .Diff-container {
-    display: flex;
-    justify-content: space-between;
-    max-height: unset;
-    overflow: auto;
-  }
-
-  .Diff-diff {
-    height: calc(
-      100vh -
-        calc(var(--RevisionCompare-titleHeight) + var(--Page-headerHeight))
-    );
-    overflow-y: scroll;
-  }
-
-  .Diff-diff {
-    align-content: flex-start;
-    width: 100%;
-  }
-}

package/src/legacy/tool-ui/src/main/webapp/v4/Downloads.css

@@ -1,11 +0,0 @@
-.downloadableItems {
-  .action-upload,
-  .ContentSummary-info,
-  .objectId-edit {
-    display: none;
-  }
-
-  .RCS.is-grid > ol > .RCS-item .ContentSelector-search figure figcaption {
-    overflow: visible;
-  }
-}

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

@@ -1,42 +0,0 @@
-// A list of possible draggable classnames can be found here: https://github.com/Shopify/draggable/tree/master/src/Draggable#classes
-.draggable--is-dragging {
-  user-select: none;
-
-  .ContentEdit-preview {
-    pointer-events: none;
-  }
-
-  &.is-collapsed {
-    box-shadow: var(--shadow-3);
-  }
-}
-
-.draggable--over {
-  z-index: 1;
-}
-
-.draggable-mirror {
-  background: rgb(238 246 250 / 50%) !important;
-  border: solid 1px var(--color-blue5);
-  box-shadow: var(--shadow-3);
-  list-style: none;
-  z-index: 301;
-}
-
-.draggable-source--is-dragging {
-  border: solid 1px var(--color-blue5) !important;
-  opacity: 0.5;
-}
-
-// Hide literally everything. Even the pseudo elements.
-.draggable-mirror::after,
-.draggable-mirror::before,
-.draggable-mirror > * {
-  display: none !important;
-}
-
-.draggable-mirror {
-  &.Sortable-item {
-    list-style: none;
-  }
-}

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

@@ -1,76 +0,0 @@
-.Dropdown {
-  .Link.is-black;
-
-  --Dropdown-markerSize: 0px;
-  --Link-hoverDecoration: none;
-
-  background: var(--color-white);
-  box-shadow: var(--shadow-3);
-  max-height: 45vh;
-  max-width: 45vw;
-  opacity: 0;
-  overflow: auto;
-  padding: var(--gap-s) 0;
-  position: fixed;
-  transform: scaleY(0);
-  transform-origin: top;
-  transition:
-    opacity var(--time-xs) var(--ease-in),
-    transform var(--time-s) var(--ease-out),
-    visibility var(--time-s);
-  visibility: hidden;
-  z-index: 2000000;
-
-  &[data-tether-rx='l'] {
-    left: var(--Tether-rl) /*rtl:ignore*/;
-  }
-
-  &[data-tether-rx='r'] {
-    right: calc(100vw - var(--Tether-rl) - var(--Tether-rw)) /*rtl:ignore*/;
-  }
-
-  &[data-tether-ry='t'] {
-    max-height: calc(
-      100vh - var(--Tether-rt) - var(--Tether-rh) - var(--gap-xl)
-    );
-    top: calc(var(--Tether-rt) + var(--Tether-rh) + var(--Dropdown-markerSize));
-    transform-origin: top;
-  }
-
-  &[data-tether-ry='b'] {
-    bottom: calc(100vh - var(--Tether-rt) + var(--Dropdown-markerSize));
-    max-height: calc(
-      var(--Tether-rt) - var(--Page-headerBottom) - var(--gap-xl)
-    );
-    transform-origin: bottom;
-  }
-}
-
-.Dropdown.is-open {
-  opacity: 1;
-  transform: none;
-  visibility: visible;
-
-  /*
-  When mouse is not hovered within menu, place accent color on whichever menu item has 
-  keyboard focus.
-  */
-  &:not(:hover) {
-    [role='menuitem']:focus {
-      background: var(--color-dominant1);
-    }
-  }
-}
-
-.Dropdown-item {
-  background: transparent;
-  display: block;
-  font-size: inherit;
-  padding: var(--gap-s) var(--gap-l);
-  text-align: left;
-  width: 100%;
-
-  &:hover {
-    background: var(--color-dominant1);
-  }
-}

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

@@ -1,141 +0,0 @@
-.EIG {
-  --EIG-itemHeight: calc(var(--gap-m) * 2 + var(--Text-height));
-  --EIG-addSize: calc(var(--gap-s) * 2 + var(--Text-height));
-
-  background: var(--color-white);
-  margin-top: var(--gap-s);
-  position: relative;
-}
-
-.EIG-item {
-  &::before {
-    bottom: 0;
-    box-shadow: var(--shadow-3);
-    content: '';
-    left: 0;
-    opacity: 0;
-    pointer-events: none;
-    position: absolute;
-    right: 0;
-    top: 0;
-    transition: opacity var(--time-s);
-  }
-
-  &.is-collapsed,
-  &.is-removing {
-    border: 1px solid var(--color-gray3);
-    height: var(--EIG-itemHeight);
-    overflow: hidden;
-
-    .EIG-title {
-      &::before {
-        content: 'expand_more';
-      }
-
-      &:hover,
-      &:focus {
-        background: var(--color-gray2);
-      }
-    }
-  }
-
-  &:not(.is-collapsed, .is-removing) {
-    z-index: 10;
-
-    &::before {
-      opacity: 1;
-    }
-  }
-}
-
-.EIG-item.is-removing {
-  background: var(--color-red1);
-  border: 1px solid var(--color-gray3);
-  height: var(--EIG-itemHeight);
-  overflow: hidden;
-
-  > .EIG-title {
-    color: var(--color-red6);
-    pointer-events: none;
-    text-decoration: line-through;
-
-    &::before {
-      content: ' ';
-    }
-  }
-
-  > .EIG-remove {
-    .Link.is-blue;
-
-    --IconButton-name: 'add';
-  }
-}
-
-.EIG-add {
-  .IconButton.no-Fill;
-  .Link.is-black;
-
-  --IconButton-name: 'add';
-
-  margin-right: var(--gap-l);
-}
-
-.EIG-search {
-  .IconButton.no-Fill;
-  .Link.is-black;
-
-  --IconButton-name: 'search';
-
-  margin-right: var(--gap-l);
-}
-
-.EIG-swap {
-  .IconButton;
-
-  --IconButton-name: 'swap_horiz';
-
-  font-size: 0;
-  position: absolute;
-  right: calc(var(--gap-l) + var(--gap-m));
-  right: calc(var(--EIG-itemHeight) / 2 + var(--Icon-size) / 2 + var(--gap-s));
-  top: calc(
-    var(--gap-m) + var(--Text-height) / 2 - var(--Icon-size) / 2 - var(--gap-s)
-  );
-}
-
-.EIG-title {
-  cursor: pointer;
-  height: var(--EIG-itemHeight);
-  overflow: hidden;
-  padding: var(--gap-m) 0;
-  padding-right: calc(var(--gap-xl) * 2);
-  text-overflow: ellipsis;
-  white-space: nowrap;
-
-  &::before {
-    .Icon;
-
-    content: 'expand_less';
-    display: inline-block;
-    margin-right: var(--gap-s);
-    text-align: center;
-    width: var(--EIG-addSize);
-  }
-}
-
-.EIG-item:not(.is-collapsed, .is-removing) > .EIG-title {
-  background: var(--color-gray2);
-}
-
-.EIG-remove {
-  .IconButton;
-  .IconButton.is-red;
-
-  --IconButton-name: 'remove';
-
-  position: absolute;
-  right: calc((var(--EIG-itemHeight) - var(--Icon-size)) / 2 - var(--gap-s));
-  top: calc(
-    var(--gap-m) + var(--Text-height) / 2 - var(--Icon-size) / 2 - var(--gap-s)
-  );
-}