CODEWITHSUNDEEP
cssstripe-payments
Tom
Tom

Reputation: 1385

Stripe Checkout button style

Using Stripe Checkout Server for payment, I'm struggling to have the "Pay" button with the nice/default Stripe style (white font, blue background, ...).

HTML code:

    <script src="https://js.stripe.com/v3/"></script>

<button id="payButton" class="stripe-button-el">Pay with credit card</button>

    <script>
        var stripe = Stripe('<?=STRIPE_PUBLIC_KEY?>');
        var button = document.getElementById("payButton");
        button.addEventListener("click", function(ev) {
            stripe.redirectToCheckout({sessionId:'<?=$session['id']?>'}).then(function(result) {});
                });
    </script>

I applied this the stripe-button-el class which turns the button to a blue background (so it is properly associated to a CSS file) but the font remains black. Screenshot: enter image description here

How can I have the nice/default Stripe style applied to this button?

Many thx, Thomas

Upvotes: 0

Views: 1133

Answers (2)

Awais
Awais

Reputation: 4902

This will change the color of the text

In your style sheet

 .stripe-button-el{color: white;}

Upvotes: 0

phenomenia
phenomenia

Reputation: 109

You're probably missing the css that styles the button or the button has not the required css classes so the style is not applied to it. Where can we see how the button should look like? (in a HTML code)

Upvotes: 0

Related Questions