fix(payment): fix Adyen form label styling

jwplayer · Aug 6, 2021 · b4f48c6 · b4f48c6
1 parent 28547dd
commit b4f48c6
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 14 deletions.
diff --git a/src/components/Adyen/Adyen.module.scss b/src/components/Adyen/Adyen.module.scss
@@ -3,20 +3,6 @@
 
 .adyen {
   margin-bottom: 24px;
-
-  :global {
-    .adyen-checkout__label__text {
-      color: variables.$white;
-      font-family: var(--body-font-family);
-      font-size: 16px;
-      line-height: 18px;
-    }
-
-    .adyen-checkout__error-text {
-      font-family: var(--body-font-family);
-      font-size: 14px;
-    }
-  }
 }
 
 .container {

diff --git a/src/components/Adyen/Adyen.tsx b/src/components/Adyen/Adyen.tsx
@@ -7,6 +7,7 @@ import Button from '../Button/Button';
 import FormFeedback from '../FormFeedback/FormFeedback';
 
 import styles from './Adyen.module.scss';
+import './AdyenForm.scss';
 
 type Props = {
   onChange?: (data: AdyenEventData) => void;

diff --git a/src/components/Adyen/AdyenForm.scss b/src/components/Adyen/AdyenForm.scss
@@ -0,0 +1,16 @@
+@use '../../styles/variables';
+@use '../../styles/theme';
+
+.adyen-checkout__card-input .adyen-checkout__card__form {
+  .adyen-checkout__label__text {
+    color: variables.$white;
+    font-family: var(--body-font-family);
+    font-size: 16px;
+    line-height: 18px;
+  }
+
+  .adyen-checkout__error-text {
+    font-family: var(--body-font-family);
+    font-size: 14px;
+  }
+}