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

The welcome section tiles are cut off at various screen widths. #722

Open
cojohen opened this issue Jul 7, 2024 · 0 comments
Open

The welcome section tiles are cut off at various screen widths. #722

cojohen opened this issue Jul 7, 2024 · 0 comments

Comments

@cojohen
Copy link

cojohen commented Jul 7, 2024

Issue

The three tiles displayed under the Welcome to Uniswap Docs heading in the first section of the page are out of view at various screen-widths, affecting accessibility, look-and-feel and readability.

Reproducing the Issue

  1. Navigate to https://docs.uniswap.org/
  2. Locate the three tiles under the Welcome to Uniswap Docs heading in the first section of the page.
  3. Adjust the browser window width downward until the page is between 1071px and 961px.
  4. Observe that the issue is visible between these viewport widths. Notice that the text contained within the rightmost and leftmost tiles begins to be cutoff making it not visible to the user. (See screenshots below)

Screenshots

Screen-width is 1071px

The tiles begin to overflow the viewport and are cutoff from view.
Screenshot 2024-07-07 at 08 48 00

Screen-width is 1039px

Tiles are overflowing the viewport. Text of the rightmost tile is cutoff from view.
Screenshot 2024-07-07 at 08 48 35

Screen-width is 961px

Tiles are overflowing the viewport. Text of the rightmost and leftmost tile is cutoff from view.
Screenshot 2024-07-07 at 08 48 59

Expected Behavior

The tiles should not overflow the viewport and the texts contained within the tiles should be fully visible at all viewport sizes. The tiles should be fully responsive to the user's screen size - they should automatically scale in size such that the text is always readable.

@cojohen cojohen changed the title Welcome to Uniswap tiles are cut off at various screen widths. The welcome section tiles are cut off at various screen widths. Jul 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant