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

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

@@ -1,193 +0,0 @@
-.DashboardWidget {
-  align-items: center;
-  background-color: var(--color-white);
-  border-top: 2px solid var(--color-gray6);
-  box-shadow: var(--shadow-1);
-  display: flex;
-  flex-wrap: wrap;
-  padding: var(--gap-l);
-  position: relative;
-
-  &::before {
-    background: var(--color-gray3);
-    content: '';
-    height: 1px;
-    left: 0;
-    position: absolute;
-    right: 0;
-    top: calc(var(--gap-m) * 2 + var(--lineHeight-m));
-  }
-
-  > * {
-    width: 100%;
-  }
-
-  > .Chart {
-    margin: -4px 0;
-  }
-
-  > .LinkList,
-  > .LinkTable {
-    margin-bottom: calc(var(--gap-xs) - var(--gap-l));
-    margin-top: calc(0px - var(--gap-l));
-  }
-
-  > .message ~ .LinkTable {
-    margin-top: 0;
-  }
-
-  > .LinkTable > thead > tr:first-child > th {
-    padding-top: var(--gap-m);
-  }
-
-  > .LinkCarousel {
-    margin: calc(0px - var(--gap-l));
-    margin-top: calc(0px - var(--gap-l));
-    position: relative;
-    width: calc(var(--gap-l) * 2 + 100%);
-  }
-
-  > .Week {
-    margin: calc(0px - var(--gap-l));
-    width: calc(var(--gap-l) * 2 + 100%);
-  }
-
-  //Dashboard Search Widget specific style rules
-  &.SearchWidget {
-    padding: 0;
-  }
-
-  .SearchWidget-result {
-    height: 100%;
-  }
-
-  &.SearchWidget::before {
-    background: none;
-  }
-
-  .SearchWidget-title {
-    display: none;
-  }
-
-  > .SearchWidget-heading {
-    display: block;
-    position: relative;
-  }
-
-  .SearchWidget-controls {
-    height: 100%;
-  }
-
-  // Create New Widget specific style rules
-  &.CreateNewWidget {
-    .CIG {
-      padding-left: 0;
-    }
-
-    .CIG-row {
-      display: block;
-    }
-
-    .CIG-title {
-      display: none;
-    }
-  }
-}
-
-.DashboardWidget-title,
-.DashboardWidget-controls,
-.DashboardWidget-pagination {
-  margin: calc(0px - var(--gap-l)) 0 calc(var(--gap-l) + 1px) 0;
-}
-
-.DashboardWidget-title {
-  .Text.is-m;
-
-  font-weight: bold;
-  margin-left: calc(0px - var(--gap-l));
-  order: -4;
-  overflow: hidden;
-  padding: var(--gap-m) var(--gap-m) var(--gap-m) var(--gap-l);
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  width: auto;
-
-  &::before {
-    display: none;
-  }
-}
-
-.DashboardWidget-heading {
-  .Text.is-s;
-
-  font-weight: bold;
-  margin: var(--gap-l) 0;
-}
-
-.DashboardWidget-controls {
-  .Icon.is-s;
-  .Link.is-black;
-
-  align-items: center;
-  display: flex;
-  order: -3;
-  width: auto;
-
-  li:not(:first-child) {
-    margin-left: var(--gap-m);
-  }
-}
-
-.DashboardWidget-pagination {
-  margin-left: auto;
-  order: -2;
-  padding-left: var(--gap-l);
-  width: auto;
-}
-
-.DashboardWidget-filters {
-  --Input-focusBackground: var(--color-gray2);
-
-  align-items: center;
-  background: var(--color-gray1);
-  border-color: var(--color-gray3);
-  border-style: solid;
-  border-width: 1px 0;
-  display: flex;
-  justify-content: flex-start;
-  margin: 0 calc(0px - var(--gap-l));
-  margin-top: -1px;
-  order: -1;
-  overflow: auto;
-  padding: 0 calc(var(--gap-l) / 2);
-  position: relative;
-  top: calc(0px - var(--gap-l));
-  width: calc(var(--gap-l) * 2 + 100%);
-
-  form {
-    align-items: center;
-    display: flex;
-    margin: 0;
-
-    > * {
-      flex-grow: 1;
-    }
-  }
-}
-
-// ActionBar padding can be removed since the Widget will already add padding.
-.DashboardWidget form > .ActionBar {
-  padding-bottom: 0;
-  padding-left: 0;
-  padding-right: 0;
-}
-
-.DashboardPage-heading {
-  font-size: 0;
-  position: absolute;
-}
-
-// Legacy.
-.scheduledEvents-date {
-  display: contents;
-}

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

@@ -1,52 +0,0 @@
-.DT {
-  width: 100%;
-
-  th,
-  td {
-    overflow-wrap: anywhere;
-    padding: var(--gap-m);
-    vertical-align: top;
-  }
-
-  > thead > tr > th {
-    .Text.is-s;
-
-    font-weight: bold;
-  }
-
-  > tbody > tr:nth-child(odd) {
-    background: var(--color-gray1);
-  }
-}
-
-.DT.is-compact {
-  > thead {
-    display: none;
-  }
-
-  > tbody > tr {
-    display: flex;
-    flex-direction: column;
-
-    > td {
-      padding-left: 0;
-      padding-right: 0;
-    }
-  }
-}
-
-.DT-wrapper.is-scrollable {
-  overflow-x: auto;
-}
-
-.DT.cell-borders {
-  th,
-  td {
-    border-bottom: solid 1px var(--color-gray3);
-    border-right: solid 1px var(--color-gray3);
-
-    &:last-child {
-      border-right: none;
-    }
-  }
-}

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

@@ -1,148 +0,0 @@
-.DateStringCalendarEmbedded {
-  display: inline-block;
-  max-width: 100%;
-  vertical-align: top;
-  width: calc(320px - var(--gap-l) * 2);
-}
-
-.DateStringCalendar {
-  input,
-  .ComboInput {
-    min-width: 10%;
-  }
-
-  .ComboInput:not(:first-of-type) {
-    margin-left: var(--gap-s);
-  }
-
-  .DateStringCalendarForm {
-    margin-bottom: var(--gap-m);
-  }
-
-  .DateStringCalendarForm-previous,
-  .DateStringCalendarForm-next {
-    .IconButton;
-
-    border: none;
-    padding: 0;
-
-    &:focus-visible {
-      z-index: 1;
-    }
-  }
-
-  .DateStringCalendarForm-previous {
-    --IconButton-name: 'chevron_left';
-  }
-
-  .DateStringCalendarForm-next {
-    --IconButton-name: 'chevron_right';
-  }
-
-  .DateStringCalendarForm-month {
-    & + .ComboInput {
-      &,
-      .ComboInput-filter {
-        width: calc(5.5em + var(--gap-s) * 2 + var(--Icon-size));
-      }
-    }
-  }
-
-  .DateStringCalendarForm-year {
-    margin-left: var(--gap-s);
-    vertical-align: middle;
-    width: 4.5em;
-  }
-
-  .DateStringCalendarDate {
-    margin-bottom: var(--gap-m);
-
-    .Calendar-day {
-      cursor: pointer;
-      padding: var(--gap-l);
-      text-align: center;
-      width: calc(100% / 7);
-
-      &.is-selected {
-        background: var(--color-gray6);
-        color: var(--color-white);
-      }
-    }
-  }
-
-  .DateStringCalendarTime {
-    margin-bottom: var(--gap-m);
-  }
-
-  .DateStringCalendarTime {
-    .ComboInput {
-      &,
-      .ComboInput-filter {
-        width: calc(1.2em + var(--gap-s) * 2 + var(--Icon-size));
-      }
-    }
-
-    &-select + .ComboInput {
-      &,
-      .ComboInput-filter {
-        width: calc(
-          1.2em * 3 + 1.8em + var(--gap-s) * 11 + var(--Icon-size) * 4
-        );
-      }
-    }
-
-    &-meridiem + .ComboInput {
-      &,
-      .ComboInput-filter {
-        width: calc(1.8em + var(--gap-s) * 2 + var(--Icon-size));
-      }
-    }
-
-    &-zoneOffset + .ComboInput,
-    &-zoneId + .ComboInput {
-      &,
-      .ComboInput-filter {
-        margin-left: 0;
-        width: calc(
-          1.2em * 3 + 1.8em + var(--gap-s) * 11 + var(--Icon-size) * 4
-        );
-      }
-    }
-  }
-
-  .DateStringCalendarAction {
-    align-items: center;
-    display: flex;
-    flex-direction: row;
-    margin-top: var(--gap-m);
-    vertical-align: bottom;
-
-    &-set {
-      .Button;
-      .Button.is-dominant;
-    }
-
-    &-now {
-      .Button;
-
-      margin-right: auto;
-    }
-
-    &-clear {
-      .Link;
-      .Link.is-red;
-
-      margin-right: var(--gap-s);
-    }
-  }
-
-  .is-hidden {
-    display: none;
-  }
-}
-
-@media (@mq-l) {
-  .DateStringCalendarEmbedded {
-    width: calc(400px - var(--gap-l) * 2);
-  }
-}

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

@@ -1,58 +0,0 @@
-.DateTimeInput {
-  background: transparent;
-  border-width: 0;
-  color: var(--color-black);
-  cursor: pointer;
-  display: inline-block;
-  font-size: 100%;
-  font-weight: normal;
-  padding: var(--gap-s) calc(var(--gap-s) * 2 + var(--Icon-size)) var(--gap-s) 0;
-  position: relative;
-  text-align: left;
-  text-decoration: none;
-  text-transform: none;
-
-  &::before {
-    border-color: var(--Input-borderColor);
-    border-style: solid;
-    border-width: 0 0 1px;
-    bottom: 0;
-    content: '';
-    left: 0;
-    pointer-events: none;
-    position: absolute;
-    right: 0;
-    top: 0;
-  }
-
-  &::after {
-    .Icon;
-
-    bottom: calc(var(--gap-s) + (var(--Text-height) - var(--Icon-size)) / 2);
-    color: var(--color-black);
-    content: 'date_range';
-    pointer-events: none;
-    position: absolute;
-    right: var(--gap-s);
-    top: auto;
-  }
-
-  &:hover,
-  &:focus {
-    color: var(--color-black);
-    text-decoration: none;
-
-    &::before {
-      border-color: var(--Input-focusColor);
-    }
-
-    &::after {
-      color: var(--Input-focusColor);
-    }
-  }
-
-  &.is-empty {
-    color: var(--color-gray5);
-    font-style: italic;
-  }
-}