[bug] Close button on "Scan with ..." step sometimes gets squished

[midas-myth]

Is there an existing issue for this?

• I have searched the existing issues

RainbowKit Version

2.0.2

wagmi Version

2.5.7

Current Behavior

The x (close button) get squished when the wallet name is long. I noticed this playing with other locales

Expected Behavior

The x button should not shrink.

Steps To Reproduce

1. Open any rainbowkit modal so that the qr is shown for walletconnect
2. In devtools manually edit the text node that says Scan with .... Wallet to Scan with very very very super long Wallet
3. The x should become squished

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

https://codesandbox.io/p/sandbox/rainbowkit-forked-pz4x97?file=%2Fsrc%2FApp.js%3A18%2C35

Anything else?

the button is probably this line: https://github.com/rainbow-me/rainbowkit/blob/main/packages/rainbowkit/src/components/ConnectOptions/DesktopOptions.tsx#L570

The solution is probably just to add flex-shrink: 0;

[midas-myth]

Also while we are at it. I noticed that even in the sandbox provided there is another issue. The modal seems to be cropping the content which may result in GET button being fully invisible.

[magiziz]

@midas-myth We're working on improving the internalisation UI for when GET button gets almost hidden, for now it kind of works, but we'll prioritise to support that soon.

Regarding the squished part of the X i think it's fine that it is like that, we always review wallets before adding them and we've not had any wallets which had a super long name. The longest wallet name we have is probably "Bifrost wallet" and that works fine for all languages. Let me know if you've got any other issues, i'll close this one for now and the team will look into making internalisation UI more friendly 🙏