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

Wrong aspect ratio on photos & extreme word wrap #1809

Open
edent opened this issue Mar 29, 2024 · 2 comments
Open

Wrong aspect ratio on photos & extreme word wrap #1809

edent opened this issue Mar 29, 2024 · 2 comments

Comments

@edent
Copy link

edent commented Mar 29, 2024

Issue and Steps to Reproduce

Using a narrow screen device like a phone, visit https://whocanivotefor.co.uk/elections/w1a%201aa/

Scroll to "London Assembly elections"

Open the "Show 7 candidates" details box.

Screenshots

Screenshot_20240329-071830

Expected

Element should not be squashed to the side. Photos should retain aspect ratio.

Actual

Looks a bit weird on some mobile platforms.
Word wrap is excessive.

Additional Details

  • Browser and version: Firefox 124.1.0 Android.
  • Were you logged in? No
@edent
Copy link
Author

edent commented Mar 29, 2024

I think this might be caused by the breakpoints - see these three examples.

Screen width of 328 works
Screenshot from 2024-03-29 08-07-28

329 and above breaks
Screenshot from 2024-03-29 08-08-10

Over 400 works
Screenshot from 2024-03-29 08-15-15

@VirginiaDooley
Copy link
Contributor

VirginiaDooley commented Apr 4, 2024

Thanks! We have an open PR to improve this #1790 but it will need further work in https://github.com/DemocracyClub/design-system

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

2 participants