@vitrosoftware/common-ui-ts 1.1.89 → 1.1.91

package/css/std/controls/login/two-factor-authentication-form.css

@@ -0,0 +1,144 @@
+.vitro-two-factor-authentication-form {
+    width: 100%;
+    height: 486px;
+    max-height: 486px;
+    flex-shrink: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.vitro-title {
+    color: #222D44;
+    text-align: center;
+    font-family: 'InterMedium';
+    font-size: 32px;
+    line-height: 135%;
+    margin-top: 32px;
+    margin-bottom: 25px;
+}
+
+.vitro-subtitle {
+    font-size: 16px;
+    line-height: 135%;
+    color: #222D44;
+    margin-bottom: 24px;
+    text-align: center;
+}
+
+.vitro-subtitle div {
+    text-align: center;
+    white-space: nowrap;
+}
+
+.vitro-subtitle span {
+    white-space: nowrap;
+    font-family: 'InterMedium';
+}
+
+.vitro-control {
+    margin-bottom: 8px;
+}
+
+.vitro-link-resend-code {
+    font-family: 'InterMedium';
+}
+
+.vitro-link-resend-code {
+    height: 40px;
+    margin-bottom: 18px;
+}
+
+.vitro-description,
+.vitro-resend-code-description {
+    font-family: 'InterMedium';
+    font-size: 14px;
+    line-height: 135%;
+    color: #6C757D;
+    width: fit-content;
+    max-width: 259px;
+    text-align: center;
+    display: flex;
+    align-items: center;
+}
+
+.vitro-resend-code-description {
+    height: 40px;
+    margin-bottom: 18px;
+}
+
+.vitro-flex {
+    display: flex;
+    flex-direction: column;
+    align-items: baseline;
+    justify-content: space-between;
+    width: 100%;
+    flex: 1 1;
+}
+
+.vitro-clock::before {
+    content: '';
+    display: block;
+    width: 24px;
+    height: 24px;
+    flex-shrink: 0;
+    margin-right: 8px;
+    background-size: 100%;
+    background-repeat: no-repeat;
+    background-position: center;
+    background-image: url('@vitrosoftware/common-ui-ts/css/std/controls/login/img/clock.svg');
+}
+
+.vitro-button {
+    margin-top: 16px;
+    margin-bottom: 32px;
+}
+
+.vitro-control > div {
+    font-size: 16px !important;
+    line-height: 27px !important;
+    top: -16px !important;
+}
+
+.vitro-control input {
+    height: 48px !important;
+    font-size: 18px !important;
+    line-height: 135% !important;
+    padding: 12px 44px 12px 20px !important;
+    box-shadow: 0px 2px 6px 0px rgba(19, 18, 66, 0.07);
+}
+
+.vitro-email {
+    white-space: nowrap;
+    align-items: center;
+    height: 22px;
+    display: inline-flex;
+}
+
+.vitro-hidden-symbol {
+    margin-right: 3px;
+    letter-spacing: -2px;
+    font-size: 18px;
+    margin-right: 3px;
+    display: flex;
+    align-items: baseline;
+}
+
+@media (max-width: 800px) {
+
+    .vitro-two-factor-authentication-form {
+        height: 452px;
+        max-height: 452px;
+    }
+
+    .vitro-title {
+        margin-bottom: 16px;
+        margin-top: 0;
+        font-size: 24px;
+    }
+
+    .vitro-subtitle div {
+        white-space: normal;
+    }
+
+}

package/css/std/controls/lookup-picker/lookup-picker.css

@@ -20,14 +20,6 @@
     flex-wrap: wrap;
 }
 
-.vitro-focus .vitro-content {
-    border-color: #3274E0;
-}
-
-.vitro-focus .vitro-label {
-    color: #3274E0;
-}
-
 .vitro-read-only .vitro-content {
     color: #4A556C;
     font-size: 12px;
@@ -43,6 +35,14 @@
     color: #4A556C;
 }
 
+.vitro-focus .vitro-content {
+    border-color: #3274E0;
+}
+
+.vitro-focus .vitro-label {
+    color: #3274E0;
+}
+
 .vitro-error .vitro-content {
     border-color: #D13438;
 }
@@ -52,8 +52,13 @@
 }
 
 .vitro-label {
+    color: #4A556C;
     padding: 0 6px;
-    background: #fff;
+    background: transparent;
+    background-image: linear-gradient(#fff, #fff);
+    background-size: 100% 2px;
+    background-position: 0 calc(50% + 3px);
+    background-repeat: no-repeat;
     z-index: 1;
     position: absolute;
     left: 10px;

package/css/std/controls/sidebar/sidebar-item.css

@@ -68,8 +68,7 @@
     align-items: center;
 }
 
-
-.vitro-group-item > .vitro-item-list > .vitro-item:last-child {
+.vitro-group-item > .vitro-item-list > .vitro-item {
     margin-bottom: 0;
 }
 
@@ -78,6 +77,8 @@
     display: flex;
     flex-direction: row;
     align-items: center;
+    padding: 6px;
+    height: 36px;
     padding-left: 24px;
 }
 

package/css/std/controls/time-picker/time-picker.css

@@ -48,18 +48,6 @@
     line-height: 16px;
 }
 
-.vitro-focus .vitro-label {
-    color: #3274E0;
-}
-
-.vitro-focus :global(.k-picker-wrap) {
-    border-color: #3274E0 !important;
-}
-
-.vitro-error :global(.k-picker-wrap) {
-    border-color: #D13438 !important;
-}
-
 .vitro-read-only input {
     color: #4A556C;
     font-size: 12px;
@@ -75,13 +63,30 @@
     display: none;
 }
 
+.vitro-focus .vitro-label {
+    color: #3274E0;
+}
+
+.vitro-focus :global(.k-picker-wrap) {
+    border-color: #3274E0 !important;
+}
+
+.vitro-error :global(.k-picker-wrap) {
+    border-color: #D13438 !important;
+}
+
 .vitro-error .vitro-label {
     color: #D13438;
 }
 
 .vitro-label {
+    color: #4A556C;
     padding: 0 6px;
-    background: #fff;
+    background: transparent;
+    background-image: linear-gradient(#fff, #fff);
+    background-size: 100% 2px;
+    background-position: 0 calc(50% + 3px);
+    background-repeat: no-repeat;
     z-index: 1;
     position: absolute;
     left: 10px;