leman-cardelementnumber-safari | Stripe Developers | Page 1

covert roverBOT Nov 8, 2023, 12:12 AM

#

crisp terrace Nov 8, 2023, 12:12 AM

#

@low goblet hello! I'm not sure I understand the question I'm sorry. I also ~never use Safari as my browser so maybe you're talking about a common feature I've never seen?

low goblet Nov 8, 2023, 12:17 AM

#

hi @crisp terrace In Safari on mobile devices, when using the CardNumberElement provided by react-stripe-js, the default behavior causes Safari to zoom into the input field, making it necessary for users to scroll to see the entire input field. Notably, Safari doesn't zoom in if the font size of the input field is set to 16px or larger. However, I'm facing a challenge in finding a way to update the font size within the CardNumberElement to meet or exceed 16px

crisp terrace Nov 8, 2023, 12:19 AM

#

hum I don't really get what that could mean yet and in years of helping with Elements I have never seen anyone say something like this. How is your form designed? Do you have a clear width set to the parent html element?

#

but https://stripe.com/docs/js/appendix/style?type=cardNumber is what you want for how to configure the style of that old legacy UI element

low goblet Nov 8, 2023, 12:21 AM

#

I found this old github issue with similar problem https://github.com/craftcms/commerce-stripe/issues/94

crisp terrace Nov 8, 2023, 12:24 AM

#

yeah but that doesn't say much more

#

does the link I gave you solve the problem where you can configure the font as you prefer?

#leman-cardelementnumber-safari