safe-wallet-web
safe-wallet-web copied to clipboard
Fix: text overlaps and hidden execute button in the transaction summary
What it solves
- execute tx button is hidden for some widths [1]
- the tx info overlaps with the tx date for some widths in swap transactions [2]
Resolves #3664 Resolves: https://www.notion.so/safe-global/07996126a3c041db90e36e01eb4ce46c?v=03b2eaffc9af4b48b1bf57e50546ac3d&p=12098c01ba6743b7a3669e6262c9800c&pm=s (thread)
How this PR fixes it
- Increases the breakpoint for splitting the summary over two lines, so the execute button does not become hidden
- Increases the width of the tx info section to accomodate the longer swap transaction info
- Add a max with with
nowrap
for longer token names in the tx summary
How to test it
- View a swap transaction in the queue.
- see that the execute/speed up button is visible for all screen widths
- see that there is no overlap between the tx info and the date, including when the token names are very long.
Screenshots
[1]
[2]
Checklist
- [ ] I've tested the branch on mobile 📱
- [ ] I've documented how it affects the analytics (if at all) 📊
- [ ] I've written a unit/e2e test for it (if applicable) 🧑💻