mis-crystal-design-system 18.0.6 → 18.0.8-test-1

package/button/button.directive.scss

@@ -1,69 +0,0 @@
-.mis-btn {
-  background: none;
-  outline: none;
-  border: none;
-  cursor: pointer;
-  border-radius: 4px;
-  vertical-align: middle;
-  text-align: center;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  text-decoration: none;
-  justify-content: center;
-
-  span,
-  img {
-    margin-right: 8px;
-  }
-
-  padding: 10px 16px;
-  font-size: 16px;
-  line-height: 24px;
-  &.mis-btn-lg {
-    padding: 16px;
-    font-weight: bold;
-  }
-  &.mis-btn-sm {
-    padding: 6px 12px;
-    font-size: 14px;
-    line-height: 20px;
-  }
-
-  background-color: transparent;
-  color: #0937b2;
-  &:hover {
-    background-color: #f0f3fa;
-  }
-  &:focus {
-    background-color: #dae1f3;
-  }
-  &:disabled {
-    color: #929dab;
-    pointer-events: none;
-  }
-
-  &.mis-outline {
-    border: 1px solid #0937b2;
-
-    &:disabled {
-      color: #929dab;
-      border-color: #929dab;
-    }
-  }
-
-  &.mis-primary {
-    background-color: #0937b2;
-    color: #ffffff;
-    &:hover {
-      background-color: #062a99;
-    }
-    &:focus {
-      background-color: #041f80;
-    }
-    &:disabled {
-      background-color: #e0e0e0;
-      color: #929dab;
-    }
-  }
-}

package/drawer/drawer.scss

@@ -1,20 +0,0 @@
-.mis-drawer {
-  display: block;
-  transition: all 300ms ease-out;
-}
-.mis-drawer-overlay {
-  background: rgba(0, 0, 0, 0.12);
-}
-mis-datepicker-container {
-  z-index: 2100;
-}
-
-mis-loader {
-  z-index: 3000;
-}
-
-@keyframes slideOut {
-  to {
-    transform: translateX(100%);
-  }
-}

package/input/mis-input.component.scss

@@ -1,180 +0,0 @@
-@import "../styles/mis-color-constants.scss";
-
-.input-container {
-  position: relative;
-  padding-bottom: 24px;
-  &.mis-disabled {
-    .input-wrapper {
-      pointer-events: none !important;
-    }
-  }
-  .input-wrapper {
-    box-sizing: border-box;
-    display: flex;
-    align-items: center;
-    flex-direction: row;
-    flex-wrap: nowrap;
-    transition: all ease-in 60ms;
-    background-color: #ffffff;
-    padding: 3px 16px; // DONE CHANGE
-    gap: 16px;
-    .mis-input {
-      flex: 1 1 auto;
-      z-index: 0;
-      position: relative;
-      display: flex;
-      align-items: center;
-    }
-    input {
-      flex: 1 1 auto;
-      border: none;
-      outline: none;
-      height: 100%;
-      padding: 0;
-      font-family: Lato;
-      font-style: normal;
-      font-weight: normal;
-      font-size: 16px;
-      height: 24px;
-      color: #181f33;
-      background-color: transparent;
-      width: 100%;
-      vertical-align: middle;
-      &::placeholder {
-        transition: all ease-in 100ms;
-        opacity: 0;
-        transform-origin: left center;
-        color: transparent;
-      }
-    }
-    .mis-placeholder {
-      position: absolute;
-      font-family: Lato;
-      font-style: normal;
-      font-weight: normal;
-      font-size: 16px;
-      line-height: 24px;
-      color: #6a737d;
-      z-index: -1;
-      transition: all ease-in 150ms;
-    }
-
-    &:focus-within {
-      background-color: #f5f5f5;
-    }
-    &:focus-within {
-      border: 1px solid $pmry_500;
-    }
-    [mis-input-act],
-    [mis-input-icon] {
-      width: 18px;
-      height: 18px;
-      color: #6a737d;
-      font-size: 24px;
-      line-height: 18px;
-    }
-    [mis-input-act] {
-      cursor: pointer;
-    }
-  }
-  &.no-hint {
-    padding-bottom: 0px;
-  }
-  &.rounded {
-    input {
-      box-sizing: initial;
-    }
-    &.sm {
-      input {
-        padding: 3px 16px;
-      }
-    }
-    &.md {
-      input {
-        padding: 9px 16px;
-      }
-    }
-    &.lg {
-      input {
-        padding: 15px 16px;
-      }
-    }
-    .input-wrapper {
-      border-radius: 4px;
-      border: 1px solid #e0e0e0;
-      padding: 0;
-      // input:not(:disabled) {
-      //   &:hover,
-      //   &:focus {
-      //     background-color: #f5f5f5;
-      //   }
-      // }
-      &:hover {
-        background-color: #f5f5f5;
-      }
-      &:focus-within {
-        border: 1px solid #0937b2;
-      }
-      input:not(:placeholder-shown) + .mis-placeholder {
-        color: transparent !important;
-      }
-      .mis-placeholder {
-        margin-left: 16px;
-        transition-duration: 50ms;
-      }
-    }
-    &.has-error {
-      .input-wrapper {
-        border: 1px solid #b00020 !important;
-      }
-    }
-  }
-  &.floating {
-    .input-wrapper {
-      padding-top: 24px;
-      padding-bottom: 7px; // DONE CHANGE
-      border-bottom: 1px solid #e0e0e0;
-      input:focus + .mis-placeholder {
-        color: #0937b2 !important;
-      }
-      input:not(:placeholder-shown) + .mis-placeholder,
-      input:focus + .mis-placeholder {
-        transform: translateY(calc(-100% + 6px)) !important;
-        font-size: 12px !important;
-        letter-spacing: 0.2px !important;
-      }
-      &:focus-within {
-        border: none;
-        border-bottom: 1px solid #0937b2;
-        input::placeholder {
-          color: #6a737d;
-          opacity: 1;
-          font-size: 16px;
-        }
-      }
-    }
-    &.has-error {
-      .input-wrapper {
-        border-bottom: 1px solid #b00020 !important;
-        .mis-placeholder {
-          color: #b00020 !important;
-        }
-      }
-    }
-  }
-  [mis-input-hint],
-  [mis-input-error] {
-    position: absolute;
-    left: 0;
-    right: 0px;
-    bottom: 0px;
-    line-height: 24px;
-    height: 24px;
-    font-size: 12px;
-    color: #6a737d;
-    letter-spacing: 0.2px;
-  }
-  [mis-input-error] {
-    color: #b00020;
-  }
-}

package/modal/modal.scss

@@ -1,9 +0,0 @@
-.mis-modal {
-  display: block;
-  overflow: auto;
-  padding: 8px;
-  // transition: all 300ms ease-out;
-}
-.mis-modal-overlay {
-  background: rgba(0, 0, 0, 0.32);
-}