@djb25/digit-ui-css 1.0.0 → 1.0.2

package/src/digitv2/pages/employee/workbench.scss

@@ -1,1042 +0,0 @@
-@import url("../../index.scss");
-
-.bread-crumb.workbench-bredcrumb{
-a{
-  color: theme(digitv2.lightTheme.primary);
-}
-}
-.workbench{
-.workbench-create-form {
-  display: inherit;
-  padding-top: 1.5rem;
-  .digit-form-composer-sub-header {
-    @extend .typography.text-heading-m;
-    padding-left: 1rem;
-    @media (max-width: theme(digitv2.screens.mobile)) {
-      padding-left: 0;
-    }
-  }
-
-  form {
-    #label_digit_root {
-      display: none;
-    }
-
-    #digit_root {
-      width: 100%;
-
-      .field-wrapper {
-        .form-group.field {
-          display: flex;
-          padding: 1em 0 0 1em;
-
-          @media (max-width: theme(digitv2.screens.mobile)) {
-            flex-direction: column;
-          }
-
-          &.field-error.has-error.has-danger {
-            .control-label {
-              @extend .alert-error;
-            }
-
-            .form-control {
-              @extend .alert-error-border;
-            }
-
-            .card-label-error {
-              display: inline;
-              position: relative;
-              margin: 0px;
-              padding: 0px;
-              top: -0.7rem;
-              font-weight: normal;
-
-            }
-          }
-
-          &.field-boolean.field-error.has-error.has-danger {
-
-            .card-label-error {
-              position: initial;
-              display: block;
-              margin-top: 0.5rem;
-
-            }
-          }
-
-          .control-label {
-            max-width: 12.5rem;
-            margin-right: 2.5rem;
-            @extend .card-label;
-            display: inline-flex;
-            /* align-self: center; */
-            line-height: 3rem;
-            @extend .typography.text-heading-s;
-            /* web view*/
-            @apply w-1/3;
-
-            /* tablet view*/
-
-            @media (max-width: theme(digitv2.screens.tablet)) {
-              max-width: 11rem;
-              margin-right: 1.5rem;
-
-            }
-
-            /* mobile view*/
-
-            @media (max-width: theme(digitv2.screens.mobile)) {
-              /*max-width: 10.2rem;*/
-              @apply w-full;
-
-            }
-
-          }
-
-          .all-input-field-wrapper {
-
-            @apply w-3/5;
-            @media (max-width: theme(digitv2.screens.mobile)) {
-              @apply w-full;
-            }
-
-            .form-control {
-              @extend .light-input-border;
-              @extend .employee-card-input;
-              font-style: inherit;
-              font-family: inherit;
-              /* web view*/
-              max-width: 37.5rem;
-              min-width: 20.5rem;
-              margin-bottom: 1rem;
-              /* tablet view*/
-
-              @media (max-width: theme(digitv2.screens.tablet)) {
-                max-width: 27.5rem;
-                min-width: 12.5rem;
-
-              }
-
-              /* mobile view*/
-
-              @media (max-width: theme(digitv2.screens.mobile)) {
-                max-width: 20.5rem;
-                min-width: 9.5rem;
-                @apply w-full;
-
-              }
-
-              &.form-select {
-                padding: 0%;
-                border: 0px;
-
-                .digit__control {
-                  @apply outline-none;
-
-                  .digit__value-container:in-range {
-                    border-color: unset;
-                    box-shadow: none;
-                    box-sizing: unset;
-                    @apply outline-none;
-                  }
-                }
-
-                .digit__control--is-focused {
-                  border-color: theme(digitv2.lightTheme.primary) !important;
-                  box-shadow: none;
-                  box-sizing: unset;
-                  @apply outline-none;
-                }
-
-
-                .digit__control:hover {
-
-                  border-color: unset;
-                  box-shadow: none;
-                  box-sizing: unset;
-                  @apply outline-none;
-                }
-
-                .digit__control:focus {
-                  border-color: theme(digitv2.lightTheme.primary);
-
-                  .digit__value-container:focus {
-                    border-color: theme(digitv2.lightTheme.primary);
-
-                  }
-                }
-              }
-
-              &.form-select:focus {
-                @apply outline-none;
-                border-color: theme(digitv2.lightTheme.primary);
-
-              }
-            }
-
-            .form-control:read-only {
-              background-color: theme(digitv2.lightTheme.background);
-              color: theme(digitv2.lightTheme["text-color-secondary"]);
-            }
-
-            .form-control:focus {
-
-              @apply outline-none;
-              border-color: theme(digitv2.lightTheme.primary);
-            }
-
-            textarea.form-control {
-              height: 5rem;
-            }
-          }
-
-          &.field-string {
-            align-self: center;
-          }
-
-          &.field-boolean {
-            padding-top: 0rem;
-            padding-bottom: 1rem;
-
-            .custom-checkbox {
-              display: inline-flex;
-              align-items: end;
-
-              &.custom-checkbox-disabled {
-                pointer-events: none;
-                opacity: 0.6;
-              }
-
-              .custom-checkbox-label {
-                @extend .typography.text-body-s;
-                @apply pl-sm;
-              }
-            }
-
-            .checkbox {
-              width: 28rem;
-
-              label {
-                float: left;
-
-                /* display: flex;
-            flex-direction: row-reverse;
-            */
-                span {
-                  width: 17rem;
-                  display: none;
-                  @extend .card-label;
-                }
-
-                input[type="checkbox"] {
-                  @extend .light-input-border;
-                  @extend .employee-card-input;
-                  height: 1.5rem;
-                  /*              @apply ml-sm;*/
-                }
-         
-                input[type="checkbox"]#digit_root_active {
-                  accent-color: theme(digitv2.lightTheme.primary);
-                }
-
-                input:checked,
-                input:hover {
-                  @apply border-2;
-                  @extend .light-input-border;
-                }
-              }
-            }
-
-            .field-radio-group {
-              display: inline-flex;
-              height: 2.5rem;
-              align-items: center;
-
-              .radio {
-                @apply mr-sm;
-              }
-            }
-
-
-
-          }
-
-
-
-          &.field-object>.control-label {
-            margin-left: 0.5rem;
-          }
-
-          &.field-object {
-            display: block;
-            @extend .light-background;
-            @extend .light-paper-border;
-            padding: 1rem;
-            margin: 1rem;
-
-            .digit-expand-collapse-wrapper {
-              margin-top: 0px;
-            }
-
-            .digit-icon-toggle {
-              top: -1.5rem;
-              right: 1.5em;
-            }
-
-            .object-wrapper {
-              .array-remove-button-wrapper {
-                position: relative;
-              }
-            }
-
-            /* have to revisit for objects
-        [id^="root_"] {
-          @extend .light-background;
-        }
-        */
-          }
-
-          &.field-array {
-            display: block;
-            @extend .light-paper-secondary;
-            @extend .light-paper-border;
-            padding: 2rem;
-            margin: 1rem;
-            padding-top: 1rem;
-
-            .array-wrapper .array-item {
-              &.jk-array-objects>.array-remove-button-wrapper {
-                display: block;
-              }
-
-              &.jk-array-objects {
-                margin-bottom: 2rem;
-
-                .array-children>span .form-group.field.field-object {
-                  padding-bottom: 3rem;
-                }
-
-                .array-obj {
-                  position: absolute;
-                  bottom: 1.5rem;
-                  left: 2rem;
-
-                  >.array-remove-button-wrapper {
-                    position: unset;
-                  }
-                }
-
-              }
-
-              &.jk-array-of-non-objects>.array-remove-button-wrapper {
-                display: inline;
-                left: 38.5rem;
-                right: unset;
-                top: 0.7rem;
-              }
-
-              &.jk-array-of-non-objects .array-children {
-                span .form-group {
-                  padding-left: 0%;
-
-                  .control-label {
-                    display: none;
-                  }
-
-                }
-              }
-
-              /* it has been removed since we dont need diff color for array items @extend .light-background;*/
-              position: relative;
-
-              .field-object {
-                margin-left: 0;
-                margin-right: 0;
-              }
-
-
-              .array-remove-button-wrapper {
-                position: absolute;
-                right: 1.3em;
-                top: 1.3em;
-                background-color: inherit !important;
-
-                .array-remove-button {
-                  cursor: pointer;
-                  background-color: inherit !important;
-                  @media (max-width: theme(digitv2.screens.mobile)) {
-                    padding:0px;
-                  }  
-                  h2{
-                    @media (max-width: theme(digitv2.screens.mobile)) {
-                        display: none;
-                    }
-                  }
-                  
-                }
-              }
-
-              span.all-input-field-wrapper {
-                @apply w-3/5;
-
-                .form-control {
-                  @apply w-full;
-                }
-              }
-
-              .control-label {
-                @apply w-1/3;
-
-              }
-            }
-
-
-            .jk-digit-secondary-btn {
-              height: 1.7em;
-              margin-top: 0.5rem;
-
-              @media (max-width: theme(digitv2.screens.mobile)) {
-                height: auto;
-                width: 100%;
-              }
-
-              h2 {
-                font-size: 1rem;
-              }
-            }
-
-            .all-input-field-wrapper {
-              .card-label-error {
-                position: unset !important;
-              }
-            }
-
-          }
-
-          .digit-expand-collapse-header {
-            border: 0;
-            background-color: inherit;
-            padding: 0;
-          }
-        }
-      }
-    }
-  }
-
-  div.action-bar-wrap {
-    @extend .action-bar-wrap;
-
-    .submit-bar {
-      @extend .submit-bar;
-      cursor: pointer;
-      @apply font-rc font-medium text-legend text-white leading-10;
-    }
-  }
-}
-
-.workbench-no-schema-found {
-  @apply flex justify-items-center flex-col;
-  align-items: center;
-}
-
-.jk-digit-loader {
-  position: absolute;
-  z-index: 10000;
-  width: 100vw;
-  background-color: rgba(189, 189, 189, 0.5);
-  height: 100vh;
-  left: 0;
-  top: 0;
-
-  .jk-spinner-wrapper {
-    width: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100%;
-
-    .jk-spinner {
-      border: 0.4em solid #fe7a51;
-      border-radius: 50%;
-      border-top: 0.4em solid #ffffff;
-      width: 4em;
-      height: 4em;
-      -webkit-animation: spin 2s linear infinite;
-      /* Safari */
-      animation: spin 1s linear infinite;
-    }
-  }
-}
-
-.jk-sm-inbox-loader {
-  border: 0.2em solid #fe7a51;
-  border-radius: 50%;
-  border-top: 0.2em solid #ffffff;
-  width: 2em;
-  height: 2em;
-  -webkit-animation: spin 2s linear infinite;
-  /* Safari */
-  animation: spin 1s linear infinite;
-}
-
-/* Safari */
-@-webkit-keyframes spin {
-  0% {
-    -webkit-transform: rotate(0deg);
-  }
-
-  100% {
-    -webkit-transform: rotate(360deg);
-  }
-}
-
-@keyframes spin {
-  0% {
-    transform: rotate(0deg);
-  }
-
-  100% {
-    transform: rotate(360deg);
-  }
-}
-
-.no-data-found {
-  height: 100%;
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-
-  .digit-error-msg {
-    margin-top: 2rem;
-  }
-}
-
-
-.tooltip .tooltiptext {
-
-  top: 2rem;
-  left: 0;
-  margin-left: 0rem;
-  width: fit-content;
-  height: max-content;
-  white-space: normal;
-
-  .tooltiptextvalue {
-    font-size: 14px;
-    font-weight: 400px;
-    color: white;
-  }
-}
-.employeeCard.manage-master-wrapper {
-  width: 100%;
-  display: flex;
-  padding-top: 2.1rem;
-  @media (max-width: theme(digitv2.screens.mobile)) {
-    flex-direction: column; 
- }
- .employee-select-wrap.form-field{
-  @apply w-1/4;
-  margin-right:1rem ;
-  @media (max-width: theme(digitv2.screens.mobile)) {
-    @apply w-full;
- }
-  }
-}
-
-.table{
-  padding-left:0.8rem ;
-  padding-right:0.8rem ;
-  &-row-mdms:hover{
-    background-color:  theme(digitv2.lightTheme.primary-bg); /* Change this to the desired hover color */
-    cursor: pointer;
-  }
-}
-}
-
-.header-btn{
-  width: 12rem;
-}
-
-.drag-drop-container {
-  background-color: #FAFAFA;
-  border: 1.5px dashed #D6D5D4;
-  border-radius: 5px;
-  margin:-1rem 1rem 1rem 1rem;
-  padding: 1rem 1rem 1rem 1rem;
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-
-  .drag-drop-text {
-    text-decoration: none;
-    .browse-text {
-      text-decoration: none;
-      color: #F47738; 
-      transition: color 0.3s;
-    }
-    .browse-text:hover {
-        color: #F47738; 
-        text-decoration: underline; 
-        cursor: pointer;
-    }
-  }
-
-}
-
-.uploaded-file-container {
-  background-color: #FAFAFA;
-  border: 1.5px solid #D6D5D4;
-  border-radius: 5px;
-  margin:0.5rem 1rem 2rem 1rem;
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  padding: 0.6rem;
-  justify-content: space-between;
-
-  .uploaded-file-container-sub {
-    display: flex;
-    align-items: center;
-    
-    .icon:hover {
-      cursor: pointer;
-    }
-  }
-}
-
-button:hover {
-  cursor: pointer;
-}
-
-.popup-header-fix {
-  margin-top: -0.5rem !important;
-}
-
-
-.option-details {
-  position: fixed;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  z-index: 999;
-  border: 1px solid #D6D5D4;
-  /* Border color and width */
-  background-color: #fff;
-  padding: 2em;
-  border-radius: 5px;
-  display: flex;
-  flex-direction: column;
-  width: 40%;
-  min-width: 300px;
-
-
-  .detail-container {
-    margin-top: 20px;
-    overflow-y: auto;
-    max-height: 50vh;
-
-    .detail-item {
-      margin: 10px 0;
-      display: flex;
-      align-items: center;
-
-      .key {
-        flex-basis: 30%;
-        margin-right: 10px;
-        font-weight: bold;
-        text-align: start !important;
-      }
-
-
-
-      .value {
-        flex-basis: 70%;
-        text-align: start !important;
-      }
-
-    }
-
-
-
-    .separator {
-      margin: 10px 0;
-      border: none;
-      border-bottom: 1px solid #ccc;
-    }
-
-
-
-    .view-more {
-      display: flex;
-      justify-content: flex-start;
-      margin-top: 1.5em;
-    }
-
-
-
-    .select {
-      display: flex;
-      justify-content: flex-start;
-      margin-top: 1.5em;
-    }
-
-  }
-
-}
-
-
-.close-button {
-  align-self: flex-end;
-  cursor: pointer;
-  font-weight: bold;
-  position: absolute;
-  padding: 7px;
-  top: 0;
-  right: 0;
-  border: 1px solid black;
-  margin-bottom: 20px;
-}
-
-
-
-
-
-
-
-.option-details-dropdown {
-  position: absolute;
-  z-index: 999;
-  border: #D6D5D4 1px solid;
-  background-color: #fff;
-  padding: 10px;
-  border-radius: 5px;
-  width: 250px;
-  margin-left: -250px;
-}
-
-
-.modal-wrapper {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  background-color: rgba(0, 0, 0, 0.5);
-  z-index: 9999;
-  overflow: auto;
-  /* Enable scrolling if content exceeds the viewport */
-}
-
-
-.modal-content {
-  background-color: #fff;
-  padding: 20px;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  max-width: 80%;
-  /* Adjust the maximum width as needed */
-  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
-  max-height: 80vh;
-  /* Limit the maximum height to 80% of the viewport height */
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-
-.modal-inner {
-  overflow-y: auto;
-  /* Enable scrolling within the modal */
-}
-
-.modal-content .employee-select-wrap .select input {
-  width: calc(100% - 32px);
-  background-color: initial;
-  position: relative !important;
-  z-index: 10;
-  width: 100%;
-  height: 100%;
-  outline: 2px solid transparent;
-  outline-offset: 2px;
-  padding-left: 8px;
-}
-
-
-
-.modal-content .employee-select-wrap .select-active {
-  position: absolute;
-  display: block;
-  width: 100%;
-  height: 2.5rem;
-  --border-opacity: 1;
-  border: 1px solid #f47738;
-  border-color: rgba(244, 119, 56, var(--border-opacity));
-}
-
-
-
-.modal-content .label-field-pair {
-  display: -ms-flexbox;
-  display: block !important;
-  -ms-flex-align: center;
-  align-items: center;
-}
-
-
-.modal-content .employee-select-wrap {
-  margin-bottom: 24px;
-}
-
-.inbox-search-wrapper {
-  .add-new-container {
-    width: 100%;
-    display: flex;
-    flex-direction: row-reverse;
-    .add-new {
-      position: relative;
-      color: #F47738;
-      cursor: pointer;
-      margin-right: 1em;
-      font-weight: bolder;
-      font-size: 23px;
-    }
-  }
-}
-
-
-
-.multiselect {
-  display: flex;
-  align-items: center;
-
-  @media (max-width: 588px) {
-    .info-icon-container {
-      position: absolute;
-      right: 2px;
-      margin-right: 0px !important;
-      margin-left: 0px !important;
-      display: flex;
-      justify-content: center;
-      margin-bottom: 0.7em;
-    }
-  }
-
-
-
-  .info-icon-container {
-    margin-left: 0.7em;
-    margin-right: -2em;
-    display: flex;
-    justify-content: center;
-    margin-bottom: 0.7em;
-  }
-
-
-
-  .info-icon-container .info-icon {
-    cursor: pointer;
-  }
-
-}
-
-
-
-.link-container {
-  flex: 1;
-  display: flex;
-  align-items: center;
-  padding: 10px;
-  background-color: #bdc5d1;
-
-
-
-  .view-all-link {
-    background-color: #bdc5d1;
-    color: #f47738;
-    font-size: 16px;
-    text-decoration: underline;
-    cursor: pointer;
-  }
-
-}
-
-
-
-.action-bar {
-  display: flex;
-  flex-direction: row;
-  justify-content: flex-end;
-
-
-  .action-bar-button {
-    margin-right: 0.5em;
-  }
-}
-
-
-
-.progressBarContainer {
-  position: fixed;
-  bottom: 20px;
-  right: 20px;
-  background-color: #fff;
-  padding: 45px 45px 20px 20px;
-  border-radius: 8px;
-  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
-  z-index: 9999;
-  width: 25vw;
-
-
-  @media (max-width: 768px) {
-    width: 70vw;
-    position: fixed;
-    bottom: 20px;
-    right: auto;
-    left: 50%;
-    transform: translateX(-50%);
-  }
-
-
-
-  .progressBar {
-    display: flex;
-    flex-direction: row;
-    border-radius: 4px;
-    overflow: hidden;
-    border: 1px solid #ccc;
-    height: 20px;
-    background-color: #4CAF50;
-  }
-
-
-
-  .progressHeading {
-    margin: 8px 0;
-    font-size: 16px;
-
-
-
-    .success-container {
-      display: flex;
-      flex-direction: row;
-      background-color: #00703C;
-      color: #fff;
-      padding: 5px 10px;
-      border-radius: 5px;
-      width: fit-content;
-      align-items: center;
-
-
-
-      .success-count {
-        background-color: #fff;
-        color: #00703C;
-        padding: 3px 5px;
-        border-radius: 3px;
-        margin-left: 5px;
-      }
-
-    }
-
-  }
-
-
-
-  .closeButton {
-    position: absolute;
-    top: 10px;
-    right: 10px;
-    cursor: pointer;
-    padding: 2px;
-    border: 1px solid #ccc;
-    border-radius: 1px;
-  }
-
-
-
-  .no-uploads {
-    margin-top: 1em;
-  }
-
-}
-
-
-
-.results-container-orange {
-  max-height: 50vh;
-  overflow: auto;
-  margin-top: 1em;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  padding: 1em;
-  background-color: #ea8a3b !important;
-
-
-
-  .no-errors {
-    background-color: #ea8a3b !important;
-  }
-
-}
-
-
-
-.results-container {
-  max-height: 50vh;
-  overflow: auto;
-  margin-top: 1em;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  padding: 1em;
-
-
-
-  .results-list-item {
-    border-bottom: 1px solid #ddd;
-    padding: 0.5em;
-    cursor: pointer;
-
-
-    &:hover {
-      background-color: #D4351C;
-      color: white;
-      /* Yellowish color on hover */
-    }
-
-  }
-
-
-
-  .results-details {
-    white-space: pre-wrap;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    padding: 1em;
-  }
-}
-
-
-
-.overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background-color: rgba(0, 0, 0, 0.3);
-  z-index: 9998;
-}
-
-.CloseLevelButton {
-  font-size: 1rem;
-  margin-bottom: 24px;
-  /* margin-left: 24px; */
-  position: relative;
-  right: auto;
-  border: none;
-
-}