Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: improve widget for smaller screens #460

Merged
merged 1 commit into from
Dec 24, 2023

Conversation

Ikari-Shinji-re
Copy link
Member

@Ikari-Shinji-re Ikari-Shinji-re commented Dec 3, 2023

Summary

Some components and skeletons don’t display properly on smaller screens.

Fixes # (issue)

  • Implement tooltips for blockchain chips in the token selector.
  • Display wallet buttons in two columns for smaller screens (confirm-wallet modal, show-more modal, and wallets page), and reduce the width of wallet buttons.
  • Resolve the height issue of the "show more" button in the confirm-wallet modal.
  • Rectify the background color of the custom destination.
  • Define a minimum width for the widget container.
  • Restructure the quote skeleton and utilize step skeleton on the swap page.
  • Incorporate text alignment for the layout.
  • Adjust the size of slippage chips.
  • Ensure that custom slippage is not clipped on smaller screens.
  • Reduce the width of the tooltip on the settings page.
  • Correct the alignment of token descriptions in the token-selector page.
  • Enhance the alignment of token balances on smaller screens.
  • Introduce a skeleton for the max balance on the home page when the balance of source blockchain wallets is being fetched.
  • Address some typos.
  • Fix the issue of not displaying custom destinations and add a default value in the config slice.
  • Adjust the styles of the list-item-button component.
  • Improve the alignment of input and output on the home page.
  • Modify the interface of the Skeleton component and specify full width for it.
  • Correct the styles of the switch component.
  • Enhance the visibility of the tooltip in dark mode by changing its box-shadow and removing the arrow.
  • Ensure that the swap-input component is not clipped on smaller screens.
  • Prevent the quote skeleton from overflowing the widget boundaries.

How did you test this change?

Test widget-embedded in Rango DApp

@Ikari-Shinji-re Ikari-Shinji-re force-pushed the fix/rf-908-improve-widget-for-smaller-screens branch 4 times, most recently from 1a8cbec to 91b5011 Compare December 10, 2023 11:23
@Ikari-Shinji-re Ikari-Shinji-re marked this pull request as ready for review December 10, 2023 11:23
@RanGojo RanGojo self-requested a review December 10, 2023 11:32
@RanGojo RanGojo self-assigned this Dec 10, 2023
@Ikari-Shinji-re Ikari-Shinji-re force-pushed the fix/rf-908-improve-widget-for-smaller-screens branch 4 times, most recently from f7c659e to 7a3a79e Compare December 16, 2023 11:13
@RanGojo RanGojo requested a review from yeager-eren December 18, 2023 07:36
@yeager-eren

This comment was marked as resolved.

@yeager-eren

This comment was marked as resolved.

@RanGojo RanGojo self-requested a review December 20, 2023 12:09
Copy link
Collaborator

@yeager-eren yeager-eren left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM.
@RanGojo You've an unresolved comment. Whenever it resolved we can merge the PR.

@yeager-eren yeager-eren force-pushed the fix/rf-908-improve-widget-for-smaller-screens branch from 51947ab to 3786eb9 Compare December 24, 2023 08:20
@yeager-eren yeager-eren force-pushed the fix/rf-908-improve-widget-for-smaller-screens branch from 3786eb9 to 689251f Compare December 24, 2023 08:24
@yeager-eren yeager-eren merged commit 75a3107 into next Dec 24, 2023
1 check passed
@yeager-eren yeager-eren deleted the fix/rf-908-improve-widget-for-smaller-screens branch December 24, 2023 08:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants