Page MenuHomePhabricator

[patch] Patch `@rainbow-me/rainbowkit` to increase width of formatted address
ClosedPublic

Authored by atul on Jan 10 2023, 2:26 PM.
Tags
None
Referenced Files
F3489644: D6220.id20820.diff
Wed, Dec 18, 1:16 PM
F3489038: D6220.diff
Wed, Dec 18, 11:10 AM
Unknown Object (File)
Thu, Nov 28, 4:34 PM
Unknown Object (File)
Thu, Nov 28, 4:23 AM
Unknown Object (File)
Thu, Nov 28, 4:23 AM
Unknown Object (File)
Thu, Nov 28, 4:23 AM
Unknown Object (File)
Nov 13 2024, 4:20 PM
Unknown Object (File)
Nov 9 2024, 4:03 PM
Subscribers
None

Details

Summary

Was struggling to get the ConnectButton to fit properly in context of LogInForm. I tried various things with CSS to get the ConnectButton to fit the width of its container, but had no luck.

Looks like the formatted address will always have 9 characters (4 leading, ellipsis, and 4 trailing) regardless of space available. This didn't look great in the context of LogInForm (very narrow) so I bumped it up to 19 characters (8 leading, ellipsis, 10 trailing).

Realize patching a package is a pretty "drastic" thing, but I read carefully through the docs/available props/etc and couldn't find any simpler or cleaner way to extend the width of the ConnectButton.


Depends on D6219

Test Plan

Here's what it looks like:

fc697d.png (988×1 px, 134 KB)

and here's what it looks like in other use in landing:

cd12d6.png (2×1 px, 1 MB)

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

atul published this revision for review.Jan 10 2023, 2:27 PM
atul edited the test plan for this revision. (Show Details)

This is fine imo, patching RBK seems pretty unavoidable

This revision is now accepted and ready to land.Jan 10 2023, 7:16 PM
This revision was landed with ongoing or failed builds.Jan 11 2023, 2:51 PM
This revision was automatically updated to reflect the committed changes.