#nimheru_docs

1 messages · Page 1 of 1 (latest)

meager loomBOT
#

👋 Welcome to your new thread!

⏲️ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.

⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.

🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1472916942384926864

📝 Have more to share? Add more details, code, screenshots, videos, etc. below.

north dew
#

Init code:

  elements = stripe.elements({
    clientSecret: response.client_secret,
    fonts: [
      {
        cssSrc: 'https://fonts.googleapis.com/css?family=Poppins:400',
      }
    ],
    appearance: {
      theme: 'flat',
      labels: 'floating',
      variables: {
        borderRadius: '0.25rem',
        fontFamily: 'Poppins, sans-serif',
        fontLineHeight: '1.4',
        fontSizeBase: '16px',
        fontSmooth: 'always',
        colorIconMenu: '#eb601a',
        iconColor: '#eb601a',
        tabIconColor: '#eb601a',
        tabIconSelectedColor: '#eb601a',
      },
      rules: {
        '.Input': {
          backgroundColor: '#fefefe',
          border: '1px solid #555555',
          padding: '0.7rem 0.5rem',
        },
        '.Input::placeholder': {
          color: '#fefefe',
        },
        '.TabIcon--selected': {
          fill: '#eb601a',
        },
        '.AccordionItem--selected': {
          color: '#444444',
        },
      }
    }
  });
heavy tusk
#

👋 Hi there! Let me take a look

north dew
#

Hi, thank you! It looks like anything within the p-LinkBrandedRoot div ignores or overrides most of the settings

heavy tusk
#

Yeah, I see. So you're missing the border colour, radius, and custom font here?

north dew
#

Yeah pretty much!

#

I couldn't actually find any styling/appearance api docs specific to Link, do they exist?

heavy tusk
#

Yeah, I'm not seeing any specific mention of Link in the Appearance-related docs either

#

The styling does seem to apply when using the Link Authentication Element

image.png
#

But you're just using the Payment Element here? Or what does your integration look like?

north dew
#

Yes this is the Payment Element as we already collect emails in a previous step and pass them in to the payment element's options

# 
  var paymentElementOptions = {
    layout: {
      type: 'accordion',
      defaultCollapsed: true,
      radios: true,
      spacedAccordionItems: true
    },
  };
  //after a xhr call
  paymentElementOptions.defaultValues = response.default_values;
  paymentElement = elements.create('payment', paymentElementOptions);
heavy tusk
#

Yup, I can reproduce that here as well here

#

We'll need to take this offline, so I can check in with the Elements team and get back to you, if that's ok?

north dew
#

certainly thanks

heavy tusk
heavy tusk
meager loomBOT
#

Hello @north dew, we have sent you a direct message, please check it at https://discord.com/channels/@me/1472922615223025729

  • 🔗The message has instructions on how to open a direct support case with our Developer Support team, in order to help you more effectively.
north dew
north dew
heavy tusk
north dew
#

It seems to have knowledge that I had come from Discord so it looks like it worked thanks

heavy tusk
#

Ah yes, I see it

#

Thanks! I'll get back to you there via email once I've got more updates

north dew
#

Ok thank you very much

heavy tusk
#

You're welcome!

meager loomBOT