[Issue 4] Style iFrame

[websupporter]

applies the styles of the original DCC input field to the DCC input field inside the PayPal iFrame as much as possible. See #4 (comment) about some of the shortcomings.

Related #4
Fixes #18

[chickenn00dle]

Once again, nice work @websupporter

This is definitely better. The input text is now larger and easier to read: https://d.pr/i/QcZg7o

This size is in line with some of our other payment gateways, so I am happy to settle with this.

That said, since we are taking the approach of copying the styles from another form element, I thought we could get even closer by instead copying from one of the input elements from within the billing details form itself. For example, passing the first name input field ( document.querySelector( '#billing_first_name' ) ) to window.getComputedStyle() when setting stylesRaw, the text looks like this: https://d.pr/i/O1IJMZ

What are your thoughts?

[websupporter]

I did chose the card number field for input as this is the one, which gets rendered by the CC_Gateway and themes can/could specifically target it. storefront is actually an example of it:
https://github.com/woocommerce/storefront/blob/745e1741fbc1120fc983f870cacc6b87580eea22/assets/css/woocommerce/woocommerce.scss#L1311-L1315

[chickenn00dle]

Ah. Thanks for clarifying! In that case, this LGTM. Merging.