#stephchl_unexpected

1 messages ยท Page 1 of 1 (latest)

peak drumBOT
#

๐Ÿ‘‹ 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/1225575019342463026

๐Ÿ“ Have more to share? Add more details, code, screenshots, videos, etc. below.

gritty sapphireBOT
rotund lichen
#

Hi ๐Ÿ‘‹

As far as I know, we do not allow any additional CSS rules to be applied to Connect Embedded Components beyond what is available in the Appearance API.

Do you have some examples of the discrepancy you are seeing?

stiff pendant
#

Sure do! Here's some screenshots:

  1. Overriding the success badge and seeing the expected colours on desktop
  2. Those same overrides not being applied to mobile
  3. On mobile, clicking on a payout to see more details and seeing the right colours

Here are the settings provided from the Stripe UI:

const stripeConnectInstance = stripeConnect.initialize({
  publishableKey: "PUBLISHABLE_KEY",
  clientSecret: 'CLIENT_SECRET',
  appearance: {
    variables: {
      badgeSuccessColorBackground: "#FF0000",
      badgeSuccessColorBorder: "#00FF00",
      badgeSuccessColorText: "#0000FF",
    },
  },
})

rotund lichen
#

Sorry it's not clear to me what tooling you are using to view this. Are you actually loading a publicly acessible site on both desktop and mobile?

stiff pendant
rotund lichen
#

Oh, okay

stiff pendant
#

This is not available on a publicly accessible site yet as it's still in development. I only have this running locally but I was able to replicate it in your docs

rotund lichen
#

Okay yes I see what you mean

#

I can flag this with responsible team to ensure we have stylistic parity between desktop and mobile

stiff pendant
#

Awesome, thanks! Will there be a follow-up on this thread or a way for me to keep track of this issue so I can make the appropriate updates on my end once this is fixed?

rotund lichen
#

I used this

appearance: {
    variables: {
      badgeSuccessColorBackground: "#AA00FF",
      badgeSuccessColorBorder: "#000000",
    },

and was quite disappointed to not see my deep purple success badge

#

I recommend you write in to Support here https://support.stripe.com/contact and ask about this specific issue. They will be able to find the ticket I file and keep you updated on progress

stiff pendant
#

haha same here