@elliemae/ds-basic 3.50.1-next.8 → 3.51.0-next.0

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-modal/v2/DSModal.scss

@@ -1,291 +0,0 @@
-$base: #{$prefix}-modal-v2;
-$header: #{$base}__modal-header;
-$header-decision: #{$header}--decision;
-$header-selection: #{$header}--selection;
-$header-right: #{$base}__modal-header-close;
-$header-right-form: #{$base}__modal-header-close--form;
-$overlay: #{$base}-overlay;
-$overlay-center: #{$base}--center;
-$overlay-top: #{$base}--top;
-
-.#{$base} {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  width: auto;
-  pointer-events: auto;
-  background-color: color(neutral, 000);
-  background-clip: padding-box;
-  min-width: 300px;
-  box-shadow: 0 10px 20px 0 #697489;
-  margin: 24px;
-  left: calc(50% - 24px);
-  transform: translateX(-50%);
-
-  &:focus {
-    outline: none;
-  }
-  max-width: space(xxl) * 9;
-
-  &.#{$base}-type-information,
-  &.#{$base}-type-decision,
-  &.#{$base}-type-form {
-    max-width: space(xxl) * 6.1;
-  }
-}
-
-// header
-.#{$header-decision} {
-  display: flex;
-  width: 100%;
-  justify-content: flex-end;
-  padding-right: space(s);
-}
-
-.#{$header} {
-  height: space(m);
-  &--with-close {
-    height: space(xl);
-  }
-}
-
-.#{$header-selection} {
-  height: space(xl);
-  // background: color(neutral, 050);
-  display: flex;
-  align-items: flex-start;
-  border-bottom: $border-style color(neutral, 080);
-  padding-top: 10px;
-  padding-left: space(s);
-  padding-right: space(s);
-  flex: 0 0 auto;
-  width: calc(100% - 1px);
-  .#{$header-right} {
-    background: color(neutral, 0);
-    margin-left: auto;
-  }
-  .#{$header-right-form} {
-    background: none;
-    height: calc(#{space(m)} * 1.16);
-    align-items: center;
-    display: flex;
-  }
-}
-
-body.ReactModal__Body--open {
-  overflow: hidden;
-}
-
-.#{$overlay} {
-  position: fixed;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  outline: 0;
-  background-color: rgba(37, 41, 47, 0.5);
-  overflow: auto;
-  @include transition(duration(slower) easing(out));
-
-  &[class*='after-open'] {
-    opacity: 1;
-  }
-
-  &[class*='before-close'] {
-    opacity: 0;
-  }
-
-  &.#{$overlay-top} {
-    .#{$base} {
-      margin-top: 20vh;
-    }
-  }
-
-  &.#{$overlay-center} {
-    display: flex;
-    align-items: center;
-  }
-}
-
-// ********************************************
-// modifiers
-$el-size-xsmall: #{$base}--x-small;
-$el-size-small: #{$base}--small;
-$el-size-medium: #{$base}--medium;
-$el-size-large: #{$base}--large;
-$el-size-xlarge: #{$base}--x-large;
-$el-size-xxlarge: #{$base}--xx-large;
-$el-fluid-actions: #{$base}--fluid-actions;
-$el-loading-actions: #{$base}--loading;
-$el-center: #{$base}--center;
-
-.#{$base}.#{$el-size-small} {
-  max-width: 320px;
-  width: 100%;
-}
-
-.#{$base}.#{$el-size-medium} {
-  max-width: 656px;
-  width: 100%;
-}
-
-.#{$base}.#{$el-size-large} {
-  max-width: 848px;
-  width: 100%;
-}
-
-.#{$base}.#{$el-size-xlarge} {
-  max-width: 1024px;
-  width: 100%;
-}
-
-.#{$base}.#{$el-size-xxlarge} {
-  max-width: 1600px;
-  width: calc(100% - 48px);
-}
-
-// ********************************************
-// feedback
-$feedback: #{$base}__modal-feedback;
-$feedback-icon: #{$prefix}-icon;
-
-.#{$feedback} {
-  text-align: center;
-  padding-bottom: space(s);
-
-  .#{$feedback-icon} {
-    height: space(xxl);
-    width: space(xxl);
-  }
-
-  &--information {
-    .#{$icon-selector} {
-      svg,
-      svg:not([fill]) {
-        @include icon-color(color(brand-primary, 700));
-      }
-    }
-  }
-
-  &--warning {
-    .#{$icon-selector} {
-      svg,
-      svg:not([fill]) {
-        @include icon-color(color(warning, 600));
-      }
-    }
-  }
-
-  &--error {
-    .#{$icon-selector} {
-      svg,
-      svg:not([fill]) {
-        @include icon-color(color(danger, 900));
-      }
-    }
-  }
-
-  &--success {
-    .#{$icon-selector} {
-      svg,
-      svg:not([fill]) {
-        @include icon-color(color(success, 900));
-      }
-    }
-  }
-}
-
-// types
-$type-information: #{$base}-type-information;
-$type-decision: #{$base}-type-decision;
-$type-selection: #{$base}-type-selection;
-$type-form: #{$base}-type-form;
-
-.#{$type-information},
-.#{$type-decision} {
-  text-align: center;
-}
-
-// title
-$title: #{$base}__modal-title;
-.#{$title} {
-  @include h3-text-style();
-  color: color(neutral, 700);
-  word-break: break-word;
-  padding-bottom: space(s);
-  padding-right: space(s);
-  margin: 0;
-
-  &--information,
-  &--decision {
-    padding: 0 space(s) space(s) space(s);
-  }
-
-  &--selection {
-    padding-bottom: 0;
-    line-height: calc(#{space(m)} * 1.16);
-  }
-
-  &--form {
-    padding-bottom: 0;
-    line-height: calc(#{space(m)} * 1.16);
-  }
-}
-
-// content
-$content: #{$base}__modal-content;
-.#{$content} {
-  overflow-y: auto;
-  // 100vh minus 20vh from margin top and minus
-  // bottom margin, footer and header
-  max-height: calc(80vh - 133px);
-  font-size: font-size(300);
-  color: color(neutral, 700);
-  @include body-text-style();
-  &--information {
-    padding-left: space(xl);
-    padding-right: space(xl);
-    padding-bottom: space(l);
-  }
-  &--decision {
-    padding-left: space(m);
-    padding-right: space(m);
-    padding-bottom: space(s);
-  }
-
-  &--selection,
-  &--form {
-    padding-left: space(s);
-    padding-right: space(s);
-  }
-  &--form {
-    padding-top: space(s);
-  }
-  &--remove-padding {
-    padding: 0;
-  }
-  .em-ds-data-grid-body__row:last-child {
-    margin-bottom: 0;
-  }
-}
-
-// footer
-$footer: #{$base}__modal-footer;
-
-.#{$footer} {
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  border-top: $border-style color(neutral, 080);
-  padding: space(s);
-  flex: 0 0 auto;
-
-  &-actions {
-    display: flex;
-
-    .action-reject,
-    .action-confirm {
-      margin-left: space(xs);
-    }
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-modal-slide/DSModalSlide.scss

@@ -1,170 +0,0 @@
-$mslide: #{$prefix}-modal-slide;
-$mslide-wrapper: #{$mslide}__wrapper;
-$mslide-overlay: #{$mslide}__overlay;
-$mslide-overlay-showing: #{$mslide-overlay}--showing;
-$mslide-overlay-disappearing: #{$mslide-overlay}--disappearing;
-$mslide-content: #{$mslide}__content;
-$mslide-actual-content: #{$mslide}__actual-content;
-$mslide-header: #{$mslide}__header;
-$mslide-footer: #{$mslide}__footer;
-$mslide-title: #{$mslide}__title;
-$mslide-header-left-side: #{$mslide}__header-left-side;
-$mslide-header-wrapper: #{$mslide}__header-wrapper;
-$mslide-footer-wrapper: #{$mslide}__footer-wrapper;
-
-$modalContent: #{$prefix}-modal-v2;
-$modalContentWrapper: #{$modalContent}__modal-wrapper;
-$modal-title: #{$modalContent}__modal-title;
-
-$opacity: 0.25;
-
-@keyframes overlayAnimation {
-  0% {
-    background: rgba(37, 41, 47, 0);
-  }
-  100% {
-    background: rgba(37, 41, 47, $opacity);
-  }
-}
-@keyframes overlayAnimationOut {
-  0% {
-    background: rgba(37, 41, 47, $opacity);
-  }
-  100% {
-    background: rgba(37, 41, 47, 0);
-  }
-}
-
-@keyframes contentAnimationOut {
-  0% {
-    transform: translateX(0);
-  }
-  100% {
-    transform: translateX(100%);
-  }
-}
-@keyframes contentAnimationIn {
-  0% {
-    transform: translateX(100%);
-  }
-  100% {
-    transform: translateX(0);
-  }
-}
-
-.#{$mslide-wrapper} {
-  position: absolute;
-  display: flex;
-  height: calc(var(--height, 100%) * 1px);
-  width: 100%;
-  overflow: hidden;
-  top: 0;
-  z-index: 10;
-}
-.#{$mslide-overlay} {
-  height: 100%;
-  width: 100%;
-  background: rgba(37, 41, 47, $opacity);
-  display: flex;
-  animation: overlayAnimation calc(var(--fade-in, 500) * 1ms) linear;
-  &--disappearing {
-    animation: overlayAnimationOut calc(var(--fade-out, 500) * 1ms) linear;
-  }
-}
-.#{$mslide-overlay-showing} {
-  display: flex;
-  height: 100%;
-}
-
-.#{$mslide-content} {
-  height: calc(var(--height, 100%) * 1px);
-  background: color(neutral, 0);
-  @include box-shadow(depth(200));
-  width: calc(var(--width, 50) * 1%);
-  margin-left: auto;
-  align-items: center;
-  flex-direction: column;
-  display: flex;
-  overflow-y: auto;
-  border: 1px solid color(neutral, 300);
-  border-left: 2px solid color(neutral, 300);
-  animation: contentAnimationIn calc(var(--fade-in, 500) * 0.5ms) linear;
-  &--disappearing {
-    animation: contentAnimationOut calc(var(--fade-out, 500) * 1ms) linear;
-  }
-  .#{$prefix}-separator-wrapper {
-    margin-top: unset;
-  }
-}
-
-.#{$mslide-actual-content} {
-  display: flex;
-  flex-direction: column;
-}
-
-.#{$mslide-header-left-side} {
-  width: 100%;
-  display: flex;
-  flex-direction: row;
-  text-align: left;
-  padding: space(xs) space(s) space(xs) 0;
-  height: space(xl);
-
-  .em-ds-button {
-    .em-ds-icon {
-      fill: color(brand-primary, 600);
-    }
-  }
-  .close-button {
-    padding-left: 18px;
-  }
-}
-
-.#{$mslide-footer-wrapper} {
-  width: 100%;
-  display: flex;
-  flex-direction: row;
-  text-align: left;
-  align-items: center;
-  justify-content: flex-end;
-  padding: space(xs) space(s) space(xs) 0;
-  height: space(xl);
-  .em-ds-button {
-    margin-left: space(s);
-  }
-}
-
-.#{$mslide-header} {
-  padding: 0 space(s);
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-
-  .#{$mslide-title} {
-    font-size: font-size(700);
-    color: color(neutral, 700);
-  }
-}
-
-.#{$mslide-wrapper} {
-  .#{$modalContentWrapper} {
-    flex: 1;
-    padding: space(m) 0;
-  }
-  .#{$modal-title} {
-    max-width: 80%;
-    margin: 0 auto;
-  }
-}
-
-.#{$prefix}-modal-v2 {
-  .#{$mslide-content} {
-    .em-ds-modal-v2__modal-wrapper {
-      display: flex;
-      flex-direction: column;
-    }
-    .em-ds-modal-v2__modal-footer {
-      border-top: none;
-    }
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-number-range-field/DSNumberRangeField.scss

@@ -1,2 +0,0 @@
-$basic-row-height: space(l);
-@import './impl/NumberRangeFieldImpl';

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-number-range-field/impl/NumberRangeFieldImpl.scss

@@ -1,20 +0,0 @@
-$wrapper: #{$prefix}-query-builder-addon-number-range-field;
-$fields-box:#{$wrapper}-wrapper;
-$fields-separator: #{$wrapper}__separator;
-
-.#{$fields-box}{
-  display: flex;
-  flex-direction: row;  
-  .#{$prefix}-input{
-    width: 100%;
-
-  }
-}
-
-.#{$fields-separator}{
-  height: $basic-row-height;
-  line-height: $basic-row-height;
-  padding-left: space(xxs);
-  padding-right: space(xxs);
-  color: color(neutral, 200);
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-overlay/DSOverlay.scss

@@ -1,30 +0,0 @@
-// ********************************************
-// container definition
-$overlay-container: #{$prefix}-overlay;
-
-// ********************************************
-// elements definition
-
-@mixin position-all($position, $value) {
-  position: $position;
-  top: $value;
-  right: $value;
-  bottom: $value;
-  left: $value;
-}
-
-.#{$overlay-container} {
-  @include position-all(static, 0);
-
-  &--with-scroll {
-    position: fixed;
-  }
-
-  &--inline {
-    display: inline;
-    overflow: visible;
-  }
-}
-
-
-

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-page-header/DSPageHeader.scss

@@ -1 +0,0 @@
-@import './v1/DSPageHeader.scss';

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-page-header/v1/DSPageHeader.scss

@@ -1,120 +0,0 @@
-// ********************************************
-// container definition
-$page-header: #{$prefix}-page-header;
-$page-header-title: #{$page-header}-title;
-$page-header-title-wrapper: #{$page-header}-title-wrapper;
-$page-header-main-section: #{$page-header}-main-section;
-$page-header-title-section: #{$page-header}-title-section;
-$page-header-toolbar: #{$page-header}-toolbar;
-$page-header-breadcrumb: #{$page-header}-breadcrumb;
-$page-header-backarrow: #{$page-header}-backarrow;
-
-// DIMSUM components
-$btn-component: #{$prefix}-button;
-$toolbar-component: #{$prefix}-toolbar;
-$breadcrumb-component: #{$prefix}-breadcrumb;
-
-$border-style: border-size() solid;
-
-.#{$page-header-main-section} {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-}
-
-.#{$page-header-title-section} {
-  display: flex;
-  width: 100%;
-}
-
-.#{$page-header-backarrow} {
-  fill: color(brand-primary, 600);
-  padding-right: 5px;
-  cursor: pointer;
-}
-
-.#{$page-header-toolbar} {
-  flex: 1 1 0%;
-  display: flex;
-  align-items: flex-end;
-  justify-content: flex-end;
-}
-
-_:-ms-fullscreen,
-:root .#{$page-header-toolbar}--ie-flex-basis-auto {
-  flex-basis: auto;
-}
-
-.#{$page-header-breadcrumb} {
-  grid-area: breadcrumb;
-
-  ol {
-    margin: 0;
-  }
-
-  @include body-small-text-style();
-}
-
-.#{$page-header-title-wrapper} {
-  display: flex;
-  flex: 1;
-  min-width: 0;
-  position: relative;
-  width: 100%;
-}
-
-.#{$page-header-title} {
-  position: relative;
-  display: flex;
-  flex: 3;
-  min-width: 0;
-  align-items: center;
-
-  &__editable-title {
-    position: absolute;
-    top: border-size() * -1;
-    left: space(xs) * -1.1;
-    width: 100%;
-    height: fit-content;
-    @include h2-text-style();
-  }
-
-  &__title {
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-    @include h2-text-style();
-  }
-
-  &__subtitle {
-    margin: space(xxs) 0;
-    color: color(neutral, 500);
-  }
-}
-
-.#{$page-header} {
-  margin: 0 0 space(xs);
-  display: flex;
-  align-items: center;
-  &--with-subtitle {
-    .#{$page-header-title} {
-      flex-direction: column;
-      align-items: flex-start;
-      padding-right: space(xs);
-    }
-    .#{$page-header-title}__toolbar {
-      align-items: flex-end;
-      justify-content: flex-end;
-    }
-  }
-
-  &--with-bottom-separator {
-    border-bottom: border-size(s) solid color(neutral, 400);
-  }
-
-  .#{$page-header-breadcrumb} {
-    & a:first-child {
-      padding-left: 1px;
-    }
-  }
-}