@tuki-io/tuki-widgets 0.0.65 → 0.0.67

package/projects/tuki/widgets/users-list/src/move-user-wizard/move-user-stepper/move-user-stepper.component.scss

@@ -1,239 +1,239 @@
-.mat-stepper-horizontal {
-  margin-top: 8px;
-
-  height: fit-content;
-  max-height: 750px;
-
-  margin: 0 auto;
-  width: 70%;
-
-  background-color: transparent;
-
-  .mat-horizontal-stepper-header-container {
-    margin: 0 auto;
-    width: 800px;
-  };
-  .mat-step-icon {
-    width: 28px;
-    height: 28px;
-
-    border: 3px solid hsl(0deg 0% 50.2%);
-  };
-  .mat-step-icon-selected {
-    background-color: hsl(0deg 0% 77.65%) !important;
-    border-color: hsl(211.8deg 66.67% 29.41%);
-  };
-  .mat-step-icon-state-number {
-    background-color: white;
-  };
-  .mat-step-icon-state-edit {
-    background-color: hsl(210deg 84.82% 43.92%);
-    border-color: hsl(210deg 84.82% 43.92%);
-  };
-  .mat-step-header .mat-step-icon-state-done {
-    background-color: hsl(210deg 84.82% 43.92%);
-    border-color: hsl(210deg 84.82% 43.92%);
-  };
-  .mat-step-icon-content {
-    display: none;
-  };
-  .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::before,
-  [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::before,
-  .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::after,
-  [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::after {
-    border-top-width: 3px !important;
-  };
-  .mat-horizontal-stepper-header::before,
-  .mat-horizontal-stepper-header::after, 
-  .mat-stepper-horizontal-line {
-    border-top-color: hsl(210deg 84.82% 43.92%) !important;
-    border-top-width: 3px !important;
-    border-top-style: solid !important;
-  };
-  .mat-horizontal-stepper-header[aria-selected='true'] ~ .mat-stepper-horizontal-line, 
-  .mat-horizontal-stepper-header[aria-selected='true'] ~ .mat-horizontal-stepper-header::before,
-  .mat-horizontal-stepper-header[aria-selected='true'] ~ .mat-horizontal-stepper-header::after {
-    border-top-width: 3px !important;
-    background-color: hsl(0deg 0% 48.24%) !important;
-    border-top-color: hsl(0deg 0% 48.24%) !important;
-  }
-}
-::ng-deep .mat-step-header[aria-labelledby="disabled_af"] {
-  pointer-events: none !important;
-  cursor: not-allowed;
-}
-
-::ng-deep .mat-step-header[aria-labelledby="disabled_af"] .mat-step-icon,
-::ng-deep .mat-step-header[aria-labelledby="disabled_af"] .mat-step-label {
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-::ng-deep .mat-form-field-infix {
-  padding: 0 !important;
-  width: 100%;
-}
-::ng-deep .mat-form-field-appearance-outline {
-  .mat-input-element {
-    height: 35px;
-    width: 100%;
-    line-height: 35px;
-    margin: 5px 0 0 0;
-  }
-}
-::ng-deep .mat-form-field {
-  width: 350px;
-}
-::ng-deep .mat-step-header[aria-labelledby="disabled_af"] {
-  pointer-events: none !important;
-  cursor: not-allowed;
-}
-
-::ng-deep .mat-step-header[aria-labelledby="disabled_af"] .mat-step-icon,
-::ng-deep .mat-step-header[aria-labelledby="disabled_af"] .mat-step-label {
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-
-.mat-mdc-form-field {
-  margin-top: 16px;
-}
-
-.mat-label {
-  font-size: 16px;
-  font-weight: 600;
-  margin: 1rem 0;
-}
-
-.step-title {
-  font-size: 28px;
-  font-weight: bold;
-
-  margin: .5rem 0 1.5rem 2rem;
-}
-
-.validation-text {
-  margin-top: 0.5rem;
-  margin-bottom: 2rem;
-}
-
-ul {
-  padding: 0.5rem 2rem;
-
-  margin-top: 0.5rem;
-  margin-bottom: 2rem;
-}
-
-// .devices-move-user-box {
-//   background-color: white;
-//   padding: 2.5rem;
-//   min-height: 350px;
-//   border-radius: 0.5rem;
-// }
-
-.devices-move-user-box {
-  background-color: white;
-  padding: 2.5rem;
-  padding: 1rem 2.5rem;
-  min-height: 350px;
-  border-radius: 0.5rem;
-}
-.user-select-location-box {
-  background-color: white;
-  padding: 2.5rem;
-  height: 350px;
-  border-radius: 0.5rem;
-}
-.form-link {
-  text-decoration: none;
-  color: rgb(0, 123, 255);
-}
-.radio-group {
-  display: flex;
-  flex-direction: column;
-  margin: 15px 0;
-  align-items: flex-start;
-}
-.radio-button {
-  margin: 0.5rem 0;
-}
-.select {
-  width: 350px;
-
-  padding: 0.5rem;
-  margin: 0.5rem 0;
-
-  border: 1px solid #a0a0a0;
-  border-radius: 0.5rem;
-}
-.step-actions {
-  display: flex;
-  flex-flow: row-reverse;
-
-  margin-top: 2rem;
-
-  gap: 1rem;
-}
-.webex-btn {
-  border: 1px solid black;
-  border-radius: 1rem;
-
-  cursor: pointer;
-
-  gap: 1rem;
-}
-.btn-next {
-  background-color: black;
-  color: white;
-}
-.btn-cancel,
-.btn-done {
-  background-color: white;
-  color: black;
-}
-.select-container {
-  position: relative;
-  width: 100%;
-  max-width: 300px;
-
-  .mat-progress-spinner {
-    position: absolute;
-    left: 45%;
-    top: 35px;
-  }
-}
-.invisible-next-btn {
-  height: 1px;
-  width: 1px;
-}
-.mat-error {
-  margin: 0px 0 15px 0;
-}
-mat-label {
-  display: block;
-}
-.btn-next {
-  min-width: 80px;
-}
-.mat-button-disabled {
-  background-color: #bbbbbb;
-  color: white;
-  border: 1px solid grey;
-  cursor: default !important;
-}
-.move-user-tab-content-box {
-  background-color: white;
-  min-height: 350px;
-  border-radius: 0.5rem;
-  box-sizing: border-box;
-  padding: 25px;
-}
-.input-container {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-
-  & input {
-    height: fit-content !important;
-  }
-}
-
+.mat-stepper-horizontal {
+  margin-top: 8px;
+
+  height: fit-content;
+  max-height: 750px;
+
+  margin: 0 auto;
+  width: 70%;
+
+  background-color: transparent;
+
+  .mat-horizontal-stepper-header-container {
+    margin: 0 auto;
+    width: 800px;
+  };
+  .mat-step-icon {
+    width: 28px;
+    height: 28px;
+
+    border: 3px solid hsl(0deg 0% 50.2%);
+  };
+  .mat-step-icon-selected {
+    background-color: hsl(0deg 0% 77.65%) !important;
+    border-color: hsl(211.8deg 66.67% 29.41%);
+  };
+  .mat-step-icon-state-number {
+    background-color: white;
+  };
+  .mat-step-icon-state-edit {
+    background-color: hsl(210deg 84.82% 43.92%);
+    border-color: hsl(210deg 84.82% 43.92%);
+  };
+  .mat-step-header .mat-step-icon-state-done {
+    background-color: hsl(210deg 84.82% 43.92%);
+    border-color: hsl(210deg 84.82% 43.92%);
+  };
+  .mat-step-icon-content {
+    display: none;
+  };
+  .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::before,
+  [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::before,
+  .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child)::after,
+  [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child)::after {
+    border-top-width: 3px !important;
+  };
+  .mat-horizontal-stepper-header::before,
+  .mat-horizontal-stepper-header::after, 
+  .mat-stepper-horizontal-line {
+    border-top-color: hsl(210deg 84.82% 43.92%) !important;
+    border-top-width: 3px !important;
+    border-top-style: solid !important;
+  };
+  .mat-horizontal-stepper-header[aria-selected='true'] ~ .mat-stepper-horizontal-line, 
+  .mat-horizontal-stepper-header[aria-selected='true'] ~ .mat-horizontal-stepper-header::before,
+  .mat-horizontal-stepper-header[aria-selected='true'] ~ .mat-horizontal-stepper-header::after {
+    border-top-width: 3px !important;
+    background-color: hsl(0deg 0% 48.24%) !important;
+    border-top-color: hsl(0deg 0% 48.24%) !important;
+  }
+}
+::ng-deep .mat-step-header[aria-labelledby="disabled_af"] {
+  pointer-events: none !important;
+  cursor: not-allowed;
+}
+
+::ng-deep .mat-step-header[aria-labelledby="disabled_af"] .mat-step-icon,
+::ng-deep .mat-step-header[aria-labelledby="disabled_af"] .mat-step-label {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+::ng-deep .mat-form-field-infix {
+  padding: 0 !important;
+  width: 100%;
+}
+::ng-deep .mat-form-field-appearance-outline {
+  .mat-input-element {
+    height: 35px;
+    width: 100%;
+    line-height: 35px;
+    margin: 5px 0 0 0;
+  }
+}
+::ng-deep .mat-form-field {
+  width: 350px;
+}
+::ng-deep .mat-step-header[aria-labelledby="disabled_af"] {
+  pointer-events: none !important;
+  cursor: not-allowed;
+}
+
+::ng-deep .mat-step-header[aria-labelledby="disabled_af"] .mat-step-icon,
+::ng-deep .mat-step-header[aria-labelledby="disabled_af"] .mat-step-label {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
+.mat-mdc-form-field {
+  margin-top: 16px;
+}
+
+.mat-label {
+  font-size: 16px;
+  font-weight: 600;
+  margin: 1rem 0;
+}
+
+.step-title {
+  font-size: 28px;
+  font-weight: bold;
+
+  margin: .5rem 0 1.5rem 2rem;
+}
+
+.validation-text {
+  margin-top: 0.5rem;
+  margin-bottom: 2rem;
+}
+
+ul {
+  padding: 0.5rem 2rem;
+
+  margin-top: 0.5rem;
+  margin-bottom: 2rem;
+}
+
+// .devices-move-user-box {
+//   background-color: white;
+//   padding: 2.5rem;
+//   min-height: 350px;
+//   border-radius: 0.5rem;
+// }
+
+.devices-move-user-box {
+  background-color: white;
+  padding: 2.5rem;
+  padding: 1rem 2.5rem;
+  min-height: 350px;
+  border-radius: 0.5rem;
+}
+.user-select-location-box {
+  background-color: white;
+  padding: 2.5rem;
+  height: 350px;
+  border-radius: 0.5rem;
+}
+.form-link {
+  text-decoration: none;
+  color: rgb(0, 123, 255);
+}
+.radio-group {
+  display: flex;
+  flex-direction: column;
+  margin: 15px 0;
+  align-items: flex-start;
+}
+.radio-button {
+  margin: 0.5rem 0;
+}
+.select {
+  width: 350px;
+
+  padding: 0.5rem;
+  margin: 0.5rem 0;
+
+  border: 1px solid #a0a0a0;
+  border-radius: 0.5rem;
+}
+.step-actions {
+  display: flex;
+  flex-flow: row-reverse;
+
+  margin-top: 2rem;
+
+  gap: 1rem;
+}
+.webex-btn {
+  border: 1px solid black;
+  border-radius: 1rem;
+
+  cursor: pointer;
+
+  gap: 1rem;
+}
+.btn-next {
+  background-color: black;
+  color: white;
+}
+.btn-cancel,
+.btn-done {
+  background-color: white;
+  color: black;
+}
+.select-container {
+  position: relative;
+  width: 100%;
+  max-width: 300px;
+
+  .mat-progress-spinner {
+    position: absolute;
+    left: 45%;
+    top: 35px;
+  }
+}
+.invisible-next-btn {
+  height: 1px;
+  width: 1px;
+}
+.mat-error {
+  margin: 0px 0 15px 0;
+}
+mat-label {
+  display: block;
+}
+.btn-next {
+  min-width: 80px;
+}
+.mat-button-disabled {
+  background-color: #bbbbbb;
+  color: white;
+  border: 1px solid grey;
+  cursor: default !important;
+}
+.move-user-tab-content-box {
+  background-color: white;
+  min-height: 350px;
+  border-radius: 0.5rem;
+  box-sizing: border-box;
+  padding: 25px;
+}
+.input-container {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+
+  & input {
+    height: fit-content !important;
+  }
+}
+