I want to customize my shipping and billing form in magento one page checkout process and for that I have to add a custom CSS class/div class to shipping and billing form.If anyone have any leads, Please help
code of checkout_index_index.xml
referenceBlock name="checkout.root">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="checkout" xsi:type="array">
<item name="children" xsi:type="array">
<item name="steps" xsi:type="array">
<item name="children" xsi:type="array">
<!-- Shipping step -->
<item name="shipping-step" xsi:type="array">
<item name="children" xsi:type="array">
<item name="shippingAddress" xsi:type="array">
<item name="config" xsi:type="array">
<item name="deps" xsi:type="array">
<item name="0" xsi:type="string">checkout.steps.shipping-step.step-config</item>
<item name="1" xsi:type="string">checkoutProvider</item>
</item>
<item name="popUpForm" xsi:type="array">
<item name="element" xsi:type="string">#opc-new-shipping-address</item>
<item name="options" xsi:type="array">
<item name="type" xsi:type="string">popup</item>
<item name="responsive" xsi:type="boolean">true</item>
<item name="innerScroll" xsi:type="boolean">true</item>
<item name="title" xsi:type="string" translate="true">Shipping Address</item>
<item name="trigger" xsi:type="string">opc-new-shipping-address</item>
<item name="buttons" xsi:type="array">
<item name="save" xsi:type="array">
<item name="text" xsi:type="string" translate="true">Ship here</item>
<item name="class" xsi:type="string">action primary action-save-address</item>
</item>
<item name="cancel" xsi:type="array">
<item name="text" xsi:type="string" translate="true">Cancel</item>
<item name="class" xsi:type="string">action secondary action-hide-popup</item>
</item>
</item>
</item>
</item>
</item>
<item name="component" xsi:type="string">Magento_Checkout/js/view/shipping</item>
<item name="provider" xsi:type="string">checkoutProvider</item>
<item name="sortOrder" xsi:type="string">10</item>
<item name="listingOrder" xsi:type="string">10</item>
<item name="children" xsi:type="array">
<item name="customer-email" xsi:type="array">
<item name="component" xsi:type="string">Magento_Checkout/js/view/form/element/email</item>
<item name="displayArea" xsi:type="string">customer-email</item>
<item name="tooltip" xsi:type="array">
<item name="description" xsi:type="string" translate="true">We'll send your order confirmation here.</item>
</item>
<item name="children" xsi:type="array">
<item name="before-login-form" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="displayArea" xsi:type="string">before-login-form</item>
<item name="children" xsi:type="array">
<!-- before login form fields -->
</item>
</item>
<item name="additional-login-form-fields" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="displayArea" xsi:type="string">additional-login-form-fields</item>
<item name="children" xsi:type="array">
<!-- additional login form fields -->
</item>
</item>
</item>
</item>
<item name="before-form" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="displayArea" xsi:type="string">before-form</item>
<item name="children" xsi:type="array">
<!-- before form fields -->
</item>
</item>
<item name="before-fields" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="displayArea" xsi:type="string">before-fields</item>
<item name="children" xsi:type="array">
<!-- before fields -->
</item>
</item>
<item name="address-list" xsi:type="array">
<item name="component" xsi:type="string">Magento_Checkout/js/view/shipping-address/list</item>
<item name="displayArea" xsi:type="string">address-list</item>
</item>
<item name="address-list-additional-addresses" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="displayArea" xsi:type="string">address-list-additional-addresses</item>
<item name="children" xsi:type="array">
<!-- address-list-additional-addresses -->
</item>
</item>
<item name="before-shipping-method-form" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="displayArea" xsi:type="string">before-shipping-method-form</item>
<item name="children" xsi:type="array">
<!-- address-list-additional-addresses -->
</item>
</item>
<item name="shipping-address-fieldset" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="deps" xsi:type="array">
<item name="0" xsi:type="string">checkoutProvider</item>
</item>
</item>
<item name="displayArea" xsi:type="string">additional-fieldsets</item>
<item name="children" xsi:type="array">
<item name="country_id" xsi:type="array">
<item name="sortOrder" xsi:type="string">1</item>
</item>
<item name="postcode" xsi:type="array">
<item name="sortOrder" xsi:type="string">2</item>
</item>
<item name="firstname" xsi:type="array">
<item name="sortOrder" xsi:type="string">3</item>
</item>
<item name="lastname" xsi:type="array">
<item name="sortOrder" xsi:type="string">4</item>
</item>
<item name="street" xsi:type="array">
<item name="sortOrder" xsi:type="string">5</item>
</item>
<item name="city" xsi:type="array">
<item name="sortOrder" xsi:type="string">6</item>
</item>
<item name="region_id" xsi:type="array">
<item name="sortOrder" xsi:type="string">7</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
