Merge pull request #4 from likhith-deriv/likhith/wall-380-provide-idv…

…-and-personal-details feat: incorporated style changes
yauheni-deriv · May 2, 2023 · 30d5c65 · 30d5c65
2 parents 687fcf1 + f9f269b
commit 30d5c65
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 13 deletions.
diff --git a/packages/account/src/Components/personal-details/personal-details.jsx b/packages/account/src/Components/personal-details/personal-details.jsx
@@ -165,7 +165,7 @@ const PersonalDetails = ({
                             onClick={handleClickOutside}
                             data-testid='personal_details_form'
                         >
-                            <Div100vhContainer className='details-form' height_offset='90px' is_disabled={isDesktop()}>
+                            <Div100vhContainer className='details-form' height_offset='100px' is_disabled={isDesktop()}>
                                 {!is_qualified_for_idv && (
                                     <Text as='p' size='xxxs' align='center' className='details-form__description'>
                                         <Localize

diff --git a/packages/core/src/sass/account-wizard.scss b/packages/core/src/sass/account-wizard.scss
@@ -502,9 +502,9 @@
             margin-bottom: 0.5rem;
         }
     }
-    // &__header:not(:first-child) {
-    //     margin-top: 1.6rem;
-    // }
+    &__header:not(:first-child) {
+        margin-top: 1.6rem;
+    }
     &__title {
         padding-right: 0.8rem;
     }
@@ -822,7 +822,7 @@
 
 .personal-details-form {
     width: 100%;
-    @include mobile() {
-        padding: 0 1.6rem;
+    @include desktop {
+        padding: 0 16rem;
     }
 }
diff --git a/packages/core/src/sass/app/_common/components/onfido-container.scss b/packages/core/src/sass/app/_common/components/onfido-container.scss
@@ -2,6 +2,7 @@
     display: flex;
     flex-direction: column;
     align-items: center;
+    gap: 1rem;
     .onfido-sdk-ui-Camera-webcamContainer {
         left: auto;
         width: -webkit-fill-available;
@@ -47,8 +48,10 @@
         gap: 0.8rem;
 
         &_container {
-            border: 1px solid #d6dadb;
-            border-radius: 0.8rem;
+            @include desktop {
+                border: 1px solid var(--general-active);
+                border-radius: 0.8rem;
+            }
             padding: 1.6rem;
 
             .account__scrollbars_container {
@@ -62,7 +65,6 @@
         }
 
         &_wrapper {
-            margin-bottom: 2.4rem;
             transition: transform 0.35s ease, opacity 0.35s linear;
             transform-origin: top;
             opacity: 1;
@@ -97,10 +99,12 @@
             }
 
             .account-form__fieldset {
-                margin-bottom: 0;
+                .dc-input {
+                    margin-bottom: 1rem;
+                }
 
-                .dc-input,
-                .dc-input--error {
+                .dc-input.dc-input--error,
+                .dc-input.dc-input--hint {
                     margin-bottom: 3.8rem;
                 }
             }
@@ -159,7 +163,6 @@
 
         &-content {
             grid-area: section-content;
-            // width: 40rem;
 
             @include mobile {
                 width: 100%;

diff --git a/packages/core/src/sass/real-account-signup.scss b/packages/core/src/sass/real-account-signup.scss
@@ -169,4 +169,10 @@
 
 .idv-form {
     grid-template-rows: unset !important;
+
+    .details-form {
+        @include mobile {
+            overflow: unset;
+        }
+    }
 }