fix: css styles

amina-deriv · Jan 11, 2023 · fceb228 · fceb228
1 parent 98c45cc
commit fceb228
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 22 deletions.
diff --git a/packages/appstore/src/components/CFDs/cfd-accounts.scss b/packages/appstore/src/components/CFDs/cfd-accounts.scss
@@ -267,13 +267,13 @@
 
     &__wrapper {
         padding: 0;
-        margin-top: 2.4rem;
+        margin-top: 4.8rem;
         display: flex;
         justify-content: center;
-        align-items: center;
 
         @include mobile {
             flex-direction: column;
+            align-items: center;
         }
     }
     &--selected {
@@ -327,11 +327,10 @@
         display: flex;
         flex-direction: column;
         justify-content: center;
-        margin: 1.6rem auto 0;
-        @include desktop {
-            width: 99.2rem;
-        }
+        margin: 1.6rem 2.4rem;
+
         @include mobile {
+            margin: unset;
             padding: 1.6rem 0.8rem;
             box-shadow: 0px -4px 4px rgba(0, 0, 0, 0.08);
         }
@@ -344,7 +343,9 @@
     &__jurisdiction-checkbox {
         display: flex;
         justify-content: center;
-        margin-top: 1.6rem;
+        @include mobile {
+            padding: 0.8rem;
+        }
     }
 
     &__over-header {

diff --git a/packages/appstore/src/components/cfds-listing/cfds-listing.scss b/packages/appstore/src/components/cfds-listing/cfds-listing.scss
@@ -22,19 +22,19 @@
     }
 
     @include desktop {
-        height: 100%;
+        height: auto;
         margin: 0 0.8rem;
     }
 
     &__wrapper {
         padding: 0;
-        margin-top: 2.4rem;
+        margin-top: 4.8rem;
         display: flex;
         justify-content: center;
-        align-items: center;
 
         @include mobile {
             flex-direction: column;
+            align-items: center;
         }
     }
     &--selected {
@@ -88,11 +88,10 @@
         display: flex;
         flex-direction: column;
         justify-content: center;
-        margin: 1.6rem auto 0;
-        @include desktop {
-            width: 99.2rem;
-        }
+        margin: 1.6rem 2.4rem;
+
         @include mobile {
+            margin: unset;
             padding: 1.6rem 0.8rem;
             box-shadow: 0px -4px 4px rgba(0, 0, 0, 0.08);
         }
@@ -105,7 +104,9 @@
     &__jurisdiction-checkbox {
         display: flex;
         justify-content: center;
-        margin-top: 1.6rem;
+        @include mobile {
+            padding: 0.8rem;
+        }
     }
 
     &__over-header {
@@ -1818,6 +1819,14 @@
         border-bottom: 1px solid var(--general-section-1);
     }
 }
+
+.dc-modal__container_jurisdiction-modal {
+    min-height: 664px;
+    .dc-modal-header {
+        border-bottom: 1px solid var(--general-section-1);
+    }
+}
+
 .poi-poa-submitted {
     &__message-content {
         align-items: center;

diff --git a/packages/cfd/src/Containers/jurisdiction-modal/jurisdiction-modal-checkbox.tsx b/packages/cfd/src/Containers/jurisdiction-modal/jurisdiction-modal-checkbox.tsx
@@ -36,7 +36,7 @@ const JurisdictionCheckBox = ({
     };
 
     const getCheckboxLabel = () => (
-        <Text as='p' align={!isMobile() ? 'center' : ''} size='xs' line_height='xs'>
+        <Text as='p' align={!isMobile() ? 'center' : ''} size={isMobile() ? 'xxs' : 'xs'} line_height='xs'>
             <Localize
                 i18n_default_text="I confirm and accept {{company}} 's <0>Terms and Conditions</0>"
                 values={{ company: dbvi_company_names[jurisdiction_selected_shortcode].name }}

diff --git a/packages/cfd/src/sass/cfd-dashboard.scss b/packages/cfd/src/sass/cfd-dashboard.scss
@@ -516,7 +516,7 @@
 
     &__wrapper {
         padding: 0;
-        margin-top: 2.4rem;
+        margin-top: 4.8rem;
         display: flex;
         justify-content: center;
 
@@ -577,11 +577,10 @@
         display: flex;
         flex-direction: column;
         justify-content: center;
-        margin: 1.6rem auto;
-        @include desktop {
-            width: 99.2rem;
-        }
+        margin: 1.6rem 2.4rem;
+        padding: 0.8rem;
         @include mobile {
+            margin: unset;
             padding: 1.6rem 0.8rem;
             box-shadow: 0px -4px 4px rgba(0, 0, 0, 0.08);
         }
@@ -594,7 +593,9 @@
     &__jurisdiction-checkbox {
         display: flex;
         justify-content: center;
-        margin-bottom: 1.6rem;
+        @include mobile {
+            padding: 0.8rem;
+        }
     }
 
     &__over-header {