[bug] Text has invisible color on "Claim" button

[tsadovska]

Is there an existing issue for this?

• [X] I have searched the existing issues

Current Behavior

Text is not visible on "Claim" button.

Expected Behavior

"Claim" button has following text: "Claim tokens to complete transfer"

Steps To Reproduce

1. Open https://preview.portalbridge.com/712d941311/
2. Send 0.0001 BONK from Sui (Sui wallet) to Solana (Phantom)
3. Check the "Claim" button

Environment

- OS: macOS Sonoma 14.5
- Wallet: Sui, Phantom
- Browser: Google Chrome Version 129.0.6668.59 (Official Build) (arm64)

Anything else?

No response

[Wesleyleung]

@tsadovska this is kind of hard for me to repro. Next time you see this, can you inspect the HTML in the console to see if the text is actually there but perhaps colored incorrectly so it looks missing?

[tsadovska]

@Wesleyleung Yes, text is present, but has an invisible color. I have updated ticket description.

[yuli-ferna]

Ok, I know what happened in our case. The background is transparent in our theme, and the class of this button is:

I am considering an option to solve this case.

[Wesleyleung]

Other integrators might choose to use transparent backgrounds too. @yuli-ferna mind making the fixes in Connect (vs just Portal) so that this is addressed for other integrators too? I think the color of the text should be whatever dark color the main card above it is using.

[yuli-ferna]

Sure, here is my solution, using the contrast text of warning: https://github.com/wormhole-foundation/wormhole-connect/pull/2758/files#diff-f24e32dd7170837763a7060343e99219c79a4802c9903766294a9ffa81335a2cR81

If you prefer the dark color the main card let me know @Wesleyleung

[Wesleyleung]

got it, this is fine with me

[tsadovska]

Issue is no longer reproducible on https://portalbridge.com/.