@elliemae/ds-basic 3.50.1-next.9 → 3.51.0-next.1

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-form/LargeInputText/DSLargeInputText.scss

@@ -1,133 +0,0 @@
-// ********************************************
-// container definition
-$input-container: #{$prefix}-form-element-textarea;
-
-// ********************************************
-// elements
-$el-input: #{$input-container}__textarea;
-$el-wrapper: #{$input-container}-wrapper;
-$el-counter: #{$prefix}-counter__textarea;
-// ********************************************
-// modifiers
-$input-error: #{$input-container}--error;
-$input-disabled: #{$input-container}--disabled;
-$input-read-only: #{$input-container}--readonly;
-
-// ********************************************
-// local
-$border-type: solid 1px;
-$radius: $theme-base-border-radius;
-$min-height: space(m) * 1.17;
-
-.#{$el-wrapper} {
-  width: 100%;
-  display: flex;
-}
-
-.#{$input-container} {
-  position: relative;
-  width: 100%;
-  outline: none;
-  color: color(neutral, 500);
-  display: flex;
-  // border: $border-type color(neutral, 200);
-  background: color(neutral, 000);
-  transition: border duration(base) easing(base);
-  @include border-radius($radius);
-  box-shadow: inset 0 0 0 1px color(neutral, 400);
-  padding: 1px;
-  &:focus-within {
-    padding: 0;
-  }
-  &:hover {
-    @include dsFakeActive();
-  }
-  &--error {
-    box-shadow: inset 0 0 0 1px color(danger, 900);
-  }
-}
-
-.#{$el-input} {
-  min-height: $min-height;
-  width: 100%;
-  outline: none;
-  border: none;
-  padding: space(xxs) space(xs);
-  overflow: auto;
-  background: none;
-  &:focus {
-    @include dsFocus();
-  }
-
-  &:active {
-    color: color(neutral, 800);
-  }
-
-  @include placeholder {
-    color: color(neutral, 500);
-    font-style: italic;
-  }
-}
-
-// ********************************************
-// Disabled container & elements          *****
-.#{$input-disabled} {
-  border-color: color(neutral, 100);
-  &:focus-within,
-  &:hover {
-    border-color: color(neutral, 100);
-  }
-  &:active {
-    border-color: color(neutral, 100);
-  }
-
-  .#{$el-input} {
-    color: color(neutral, 500);
-    cursor: not-allowed;
-  }
-}
-
-// ********************************************
-// Error container & elements             *****
-.#{$input-error} {
-  border-color: color(danger, 900);
-  &:focus,
-  &:hover,
-  &:active {
-    border-color: color(danger, 900);
-  }
-
-  .#{$el-input} {
-    color: color(neutral, 500);
-  }
-}
-
-// ********************************************
-// ReadOnly container & elements          *****
-.#{$input-read-only} {
-  border-color: color(neutral, 100);
-  cursor: not-allowed;
-  .#{$el-input} {
-    color: color(neutral, 500);
-  }
-}
-
-.#{$el-counter} {
-  text-align: right;
-  padding: space(xxs);
-  span {
-    margin: 0 space(xxs) * 0.3;
-  }
-  &--limit-error {
-    color: color(danger, 900);
-  }
-}
-
-// Mobile
-@include md {
-  .#{$el-input} {
-    font-size: toMobile(font-size(600));
-    font-weight: 400;
-    min-height: toMobile(space(xxl));
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-form/Radio/DSRadio.scss

@@ -1,248 +0,0 @@
-// ********************************************
-// container definition
-$el-container: #{$prefix}-form-element-radio;
-$el-container-error: #{$el-container}--error;
-$el-container-disabled: #{$el-container}--disabled;
-$el-container-read-only: #{$el-container}--readonly;
-
-// ********************************************
-// elements
-$el-input: #{$el-container}__input;
-$el-label: #{$el-container}__label;
-$el-button: #{$el-container}__input-button;
-$el-text: #{$el-container}__label-text;
-$el-children: #{$el-container}__radio-children;
-
-// ********************************************
-// local
-$border-type: solid 1px;
-$border-type-focus: solid 2px;
-$border-type-mobile: solid 2px;
-$border-type-focus-mobile: solid 3px;
-
-.#{$el-input} {
-  position: absolute;
-  opacity: 0;
-  right: 0;
-}
-
-.#{$el-text} {
-  @include body-text-style();
-  transition: duration(base) easing(base);
-  color: color(neutral, 800);
-  line-height: 100%;
-  position: relative;
-  bottom: -1px; // fix - extra pixel below the text
-}
-
-.#{$el-button} {
-  border-radius: 50% !important;
-  transition: duration(base) easing(base);
-  width: space(s);
-  min-width: space(s);
-  height: space(s);
-  margin-right: space(xs);
-  border: $border-type color(neutral, 400);
-  background: color(neutral, 000);
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  align-self: flex-start;
-  position: relative;
-}
-
-.#{$el-label} {
-  position: relative;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-}
-
-.#{$el-children} {
-  padding-left: space(m);
-}
-
-// ********************************************
-// Default container & elements           *****
-.#{$el-container} {
-  width: fit-content;
-  padding-bottom: space(s);
-  circle.unchecked {
-    fill: color(neutral, 000);
-  }
-
-  .#{$el-label} {
-    &:hover {
-      .#{$el-button} {
-        border-color: color(brand-primary, 600);
-        background-color: color(brand-primary, 200);
-      }
-      circle.unchecked {
-        fill: color(brand-primary, 200);
-      }
-    }
-    .#{$el-button} {
-      &:focus {
-        box-shadow: none;
-      }
-
-      &:focus:not(:active) {
-        border: $border-type-focus color(brand-primary, 700);
-      }
-
-      &:active {
-        background-color: color(neutral, 000);
-        circle.unchecked {
-          fill: color(neutral, 000);
-        }
-      }
-    }
-  }
-
-  .#{$el-input} {
-    &:checked + .#{$el-button} {
-      circle.checked {
-        fill: color(brand-primary, 600);
-      }
-    }
-  }
-}
-
-// ********************************************
-// Error container & elements             *****
-.#{$el-container-error} {
-  .#{$el-button} {
-    border-color: color(danger, 900);
-  }
-
-  .#{$el-label} {
-    &:hover {
-      .#{$el-button}:not(:focus) {
-        border-color: color(danger, 900);
-      }
-    }
-    &:active {
-      .#{$el-button} {
-        border-color: color(danger, 900);
-      }
-      circle.unchecked {
-        fill: color(neutral, 080);
-      }
-    }
-  }
-
-  .#{$el-input} {
-    &:checked + .#{$el-button} {
-      circle.checked {
-        fill: color(danger, 900);
-      }
-    }
-  }
-}
-
-// ********************************************
-// Disabled container & elements          *****
-.#{$el-container-disabled} {
-  circle.checked {
-    fill: color(neutral, 400);
-  }
-  circle.unchecked {
-    fill: color(neutral, 080);
-  }
-
-  .#{$el-label} {
-    cursor: not-allowed;
-    &:hover {
-      .#{$el-button} {
-        border-color: color(neutral, 400);
-        background-color: color(neutral, 080);
-      }
-      circle.unchecked {
-        fill: color(neutral, 080);
-      }
-    }
-    &:active {
-      .#{$el-button} {
-        background-color: color(neutral, 080);
-      }
-      circle.unchecked {
-        fill: color(neutral, 080);
-      }
-    }
-
-    .#{$el-input} {
-      &:checked + .#{$el-button} {
-        background-color: color(neutral, 080);
-      }
-    }
-  }
-
-  .#{$el-text} {
-    color: color(neutral, 500);
-  }
-
-  .#{$el-button} {
-    pointer-events: none;
-    background: color(neutral, 080);
-    &:hover {
-      border-color: color(neutral, 400);
-    }
-  }
-}
-
-// ********************************************
-// Read only container & elements         *****
-.#{$el-container-read-only} {
-  .#{$el-label} {
-    &:hover {
-      .#{$el-button} {
-        border-color: color(neutral, 400);
-      }
-    }
-  }
-  .#{$el-input} {
-    &:checked + .#{$el-button} {
-      circle.checked {
-        fill: color(neutral, 500);
-      }
-    }
-  }
-}
-
-@include md {
-  .#{$el-text} {
-    font-size: 16px;
-  }
-
-  .#{$el-container} {
-    padding-bottom: calc(#{space(m)} * 0.4);
-    -webkit-tap-highlight-color: transparent;
-
-    .#{$el-label} {
-      padding: calc(#{space(xxs)} * 0.81) 0;
-      .#{$el-button} {
-        border: $border-type-mobile color(neutral, 400);
-        &:focus {
-          border: $border-type-focus-mobile color(brand-primary, 700);
-        }
-      }
-    }
-  }
-
-  .#{$el-button} {
-    width: calc(#{space(s)} * 1.22);
-    min-width: calc(#{space(s)} * 1.22);
-    height: calc(#{space(s)} * 1.22);
-    border: $border-type-mobile color(neutral, 400);
-    margin-right: calc(#{space(s)} * 0.81);
-  }
-
-  .#{$el-container-error} {
-    .#{$el-label} {
-      // added this specificity so it correctly overwrites the error state
-      .#{$el-button} {
-        border: $border-type-mobile color(danger, 900);
-      }
-    }
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-form/RadioGroup/DSRadioGroup.scss

@@ -1,44 +0,0 @@
-$cmp-prefix: #{$prefix}-radio-group;
-$el-container: #{$prefix}-form-element-radio;
-
-.#{$cmp-prefix}-form-item-layout-wrapper {
-  display: inline-flex;
-  .#{$cmp-prefix} {
-    padding-top: space(xs);
-  }
-}
-
-.#{$cmp-prefix} {
-  display: flex;
-  flex-wrap: wrap;
-
-  &--vertical {
-    flex-direction: column;
-  }
-
-  &--horizontal {
-    .#{$el-container} {
-      margin-right: space(l);
-    }
-  }
-}
-
-@include md {
-  .#{$cmp-prefix}-form-item-layout-wrapper {
-    .#{$cmp-prefix} {
-      padding-top: calc(#{space(xxs)} * 0.81);
-    }
-    .em-ds-em-ds-label__text {
-      font-size: 16px;
-      font-weight: font-weight(seminal);
-    }
-  }
-
-  .#{$cmp-prefix} {
-    &--horizontal {
-      .#{$el-container} {
-        margin-right: calc(#{space(s)} * 0.81);
-      }
-    }
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-form/RequiredMark/RequiredMark.scss

@@ -1,19 +0,0 @@
-$el: #{$prefix}-form-required-mark;
-
-.#{$el} {
-  color: color(danger, 900);
-  font-size: font-size(100);
-  margin-left: space(xxs);
-  position: relative;
-  bottom: space(xxs);
-  &.optional-mark {
-    font-size: font-size(100);
-    color: color(brand-primary, 600);
-    font-weight: 600;
-  }
-}
-
-// PUI-5311 legend tag doesn't support flex on FF & safari
-legend.#{$prefix}-label--group .#{$el} {
-  bottom: 6px;
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-basic/static-build/styles/components/packages/ds-form/TimeInput/DSTimeInput.scss

@@ -1,73 +0,0 @@
-// ********************************************
-// container definition
-$el-container: #{$prefix}-input-time;
-$inputs-group: #{$prefix}-input-times-group;
-$inputs-group-divider: #{$inputs-group}__divider;
-
-.#{$el-container} {
-  height: 100%;
-  display: flex;
-  align-items: center;
-}
-
-.#{$inputs-group} {
-  display: flex;
-  align-items: center;
-
-  .#{$inputs-group-divider} {
-    font-style: italic;
-    color: color(neutral, 500);
-  }
-
-  .#{$inputs-group-divider}--value {
-    font-style: unset;
-    color: color(neutral, 800);
-  }
-
-  &__input {
-    @include placeholder {
-      color: color(neutral, 500);
-      font-style: italic;
-    }
-    text-align: center;
-    border: none;
-    width: 25px;
-    outline: none;
-    background: none;
-    user-select: none;
-
-    &:focus {
-      background: color(brand-primary, 300);
-    }
-
-    &::placeholder {
-      text-align: center;
-      font-style: italic;
-    }
-
-    &:placeholder-shown {
-      text-align: left;
-      width: 25px;
-    }
-
-    &:nth-child(3) {
-      margin: 0 space(m) * 0.1;
-    }
-  }
-
-  &__am-pm-input {
-    &::-ms-expand {
-      display: none;
-    }
-    -moz-appearance: none;
-    -webkit-appearance: none;
-    background: transparent;
-    border: none;
-    outline: none;
-    padding: space(xxs) * 0.5 space(xxs);
-
-    &:focus {
-      background: color(brand-primary, 300);
-    }
-  }
-}