search

redditCFB / rcfbpoll3

r/CFB Poll Top 25 Site Re-Rebuild
MIT License
4 stars 2 forks source link

Name overlap on mobile #6

Open mrthespork opened 1 year ago

mrthespork commented 1 year ago

Screenshot_20220906-103203

maxspevack commented 9 months ago

I looked into this one a little bit. A few observations, with the caveat that I am very rusty here:

  1. It's not just a mobile bug. It's reproducible simply by making the browser window really small.
  2. When the page renders, it tries to create 5 columns for the "Main Poll Voters" and "Provisional Poll Voters" sections, and then it's smart enough to split the total number of ballots evenly across those columns as needed, with each column being given 20% of the width.

So, the number of columns needs to not be fixed at 5, but rather be allowed to be fewer based on the width of the window. Perhaps this ties into these lines.

I tried to get a local deployment of all of this running, but it's not quite working for me. I keep getting 500 errors on 0.0.0.0:8000 because of some database weirdness. Is there any short "getting started" FAQ that takes us through the docker-compose steps? (Fedora Rawhide FWIW).

sirgippy commented 9 months ago
  1. It's not just a mobile bug. It's reproducible simply by making the browser window really small.

Correct.

Pretty much all sizing behavior throughout the entire site can be reproduced by just making the window width smaller; there's no attempt to detect mobile directly, but instead all behavior is just driven by windows size using bootstrap.

A lot of those still need a pass at various sizes, but this page in particular just doesn't take size into account.

  1. When the page renders, it tries to create 5 columns for the "Main Poll Voters" and "Provisional Poll Voters" sections, and then it's smart enough to split the total number of ballots evenly across those columns as needed, with each column being given 20% of the width.

So, the number of columns needs to not be fixed at 5, but rather be allowed to be fewer based on the width of the window. Perhaps this ties into these lines.

Yes.

My recommendation, unless someone has a better idea, is to rebuild this using a bootstrap grid instead of trying to make the logic work for variable numbers of columns using columnize. That's actually how the Voter Hall of Fame on the About page already works: https://github.com/redditCFB/rcfbpoll3/blob/2787e2d59d7590aaa03dbfc254656d7609edb193/app/poll/templates/about.html#L31C29-L31C29, this was just built first and I didn't go back and update it.