#krishnaKanabar-payment-element-appearance

1 messages · Page 1 of 1 (latest)

wild raft
#

Hi 👋 I've created a thread for this, can you further explain what you're doing and the behavior that you're encountering?

#

Pasting for context:


        const appearance = {
  theme: 'night'
};
        this.stripe = Stripe(process.env.STRIPE_PUBLISHABLE_KEY)
        let stripeElements = this.stripe.elements({stripeSecretKey, appearance});
        var style = {
  base: {
    iconColor: '#666EE8',
    color: '#31325F',
    lineHeight: '40px',
    fontWeight: 300,
    fontFamily: 'Helvetica Neue',
    fontSize: '15px',

    '::placeholder': {
      color: '#CFD7E0',
    },
  },
};

        var cardNumberElement = stripeElements.create('card');
cardNumberElement.mount('#card-element');```
autumn dock
#

const stripeSecretKey = process.env.STRIPE_PUBLISHABLE_KEY;

    const appearance = {

theme: 'night'
};
this.stripe = Stripe(process.env.STRIPE_PUBLISHABLE_KEY)
let stripeElements = this.stripe.elements({stripeSecretKey, appearance});
var style = {
base: {
iconColor: '#666EE8',
color: '#31325F',
lineHeight: '40px',
fontWeight: 300,
fontFamily: 'Helvetica Neue',
fontSize: '15px',

'::placeholder': {
  color: '#CFD7E0',
},

},
};

    var cardNumberElement = stripeElements.create('card');

cardNumberElement.mount('#card-element');

#

<div id="card-element"></div> -- html part

wild raft
#

The Appearance API is only compatible with the Payment Element, and does not support individual payment method elements such as the Card Element.

autumn dock
#

i followed this.....is this not working?

wild raft
#

There is a message just above the example on that page that says it isn't compatible with the Card Element:

The Elements Appearance API doesn’t support individual payment method Elements (such as CardElement). Use the Style object to customize your Element instead.

autumn dock
#

okay