From ac13387897e381b219eb945737569c2598a38e42 Mon Sep 17 00:00:00 2001
From: Pritish Budhiraja <pritish.budhiraja@gmail.com>
Date: Wed, 25 Sep 2024 14:51:34 +0530
Subject: [PATCH] fix: styling issues

---
 src/Components/DynamicFields.res |  6 +----
 src/Components/SavedMethods.res  | 42 +++++++++++++++++---------------
 2 files changed, 24 insertions(+), 24 deletions(-)

diff --git a/src/Components/DynamicFields.res b/src/Components/DynamicFields.res
index 3f8517e62..85b128437 100644
--- a/src/Components/DynamicFields.res
+++ b/src/Components/DynamicFields.res
@@ -317,7 +317,6 @@ let make = (
       (dynamicFieldsToRenderInsideBilling->Array.length > 1 || !isOnlyInfoElementPresent)
 
   let spacedStylesForBiilingDetails = isSpacedInnerLayout ? "p-2" : "my-2"
-  let spacedStylesForCity = isSpacedInnerLayout ? "p-2" : ""
 
   <RenderIf condition={fieldsArr->Array.length > 0}>
     {<>
@@ -510,10 +509,7 @@ let make = (
             }>
             {React.string(localeString.billingDetailsText)}
           </div>
-          <div
-            className={`${spacedStylesForCity} flex flex-col ${isSpacedInnerLayout
-                ? "gap-2"
-                : ""}`}>
+          <div className={`flex flex-col ${isSpacedInnerLayout ? "gap-2" : ""}`}>
             {dynamicFieldsToRenderInsideBilling
             ->Array.mapWithIndex((item, index) => {
               <div
diff --git a/src/Components/SavedMethods.res b/src/Components/SavedMethods.res
index ab0324f1e..fd7dbcce0 100644
--- a/src/Components/SavedMethods.res
+++ b/src/Components/SavedMethods.res
@@ -46,24 +46,24 @@ let make = (
   let {paymentToken: paymentTokenVal, customerId} = paymentToken
 
   let bottomElement = {
-    savedMethods
-    ->Array.mapWithIndex((obj, i) => {
-      let brandIcon = obj->getPaymentMethodBrand
-      let isActive = paymentTokenVal == obj.paymentToken
-      <SavedCardItem
-        key={i->Int.toString}
-        setPaymentToken
-        isActive
-        paymentItem=obj
-        brandIcon
-        index=i
-        savedCardlength
-        cvcProps
-        paymentType
-        setRequiredFieldsBody
-      />
-    })
-    ->React.array
+    <div className="PickerItemContainer">
+      {savedMethods
+      ->Array.mapWithIndex((obj, i) =>
+        <SavedCardItem
+          key={i->Int.toString}
+          setPaymentToken
+          isActive={paymentTokenVal == obj.paymentToken}
+          paymentItem=obj
+          brandIcon={obj->getPaymentMethodBrand}
+          index=i
+          savedCardlength
+          cvcProps
+          paymentType
+          setRequiredFieldsBody
+        />
+      )
+      ->React.array}
+    </div>
   }
 
   let (isCVCValid, _, cvcNumber, _, _, _, _, _, _, setCvcError) = cvcProps
@@ -160,7 +160,11 @@ let make = (
         | Some("apple_pay") =>
           switch applePayToken {
           | ApplePayTokenOptional(optToken) =>
-            ApplePayHelpers.handleApplePayButtonClicked(~sessionObj=optToken, ~componentName, ~paymentMethodListValue)
+            ApplePayHelpers.handleApplePayButtonClicked(
+              ~sessionObj=optToken,
+              ~componentName,
+              ~paymentMethodListValue,
+            )
           | _ =>
             // TODO - To be replaced with proper error message
             intent(