How to change the color of the stripe cart fields ?

Hello guys,

I'm trying to change the color (#d39f60) of the Stripe cart fields but I can't find the rigth selector in the Css.
The only selector working in live in Devtool is : .InputContainer .InputElement , but once saved in the css it doesn't work.

It's on this page : https://www.lebarapieds.com/

Could you give me yours thoughts please ? 

 

0

Comments

5 comments
Date Votes
  • Hello. Add this code in Appearance > Step by step form > Custom CSS

    #bookly-stripe-card-field, #bookly-stripe-card-expiry-field, #bookly-stripe-card-cvc-field {
       background-color: #d39f60;
    }

    and let us know if it helps.

    0
  • Hello,

    Thanks you for your help, It does work for me :)

    Another related question : 
    Is-it possible to change the font color ?
    I'm trying with color, but no effect.

    0
  • Hello, The font colour using the css in the link above works only on the bookly form, when it comes to stripe card fields, it doesn't.  How can we change the font in that specific field?

    and since I am here, how can we change the border radius just for the stripe card details fields? These are the only fields that are square, everything else is rounded.

    Thanks.

    0
  • Hello R B,

    Unfortunately, you cannot change the text color inside the Stripe input fields, because this text is generated by Stripe as separate HTML document and added with <iframe> tag to the booking form. You can not directly apply styles to the inner Iframe element through parent window CSS.

    As for the border radius, please try this

    #bookly-stripe-card-field, #bookly-stripe-card-expiry-field, #bookly-stripe-card-cvc-field {

       border-radius: 4px;

    }
    0

Please sign in to leave a comment.

Didn't find what you were looking for?

New post