-
Notifications
You must be signed in to change notification settings - Fork 0
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
Some real problems with height #5
Comments
Thanks for opening the issue.
Also I'd like to know more about your requirements. |
Hey Sergei, thanks for the quick reply. (And thanks for making bracketry - it's pretty great.) In more testing I think I was wrong about #2. I'm not sure what I was seeing before, but I'm not able to repro it now. My end goal is a to make a bracket that fills the screen, whatever that might be - hence my biggest problem (Safarai and growing heights when no fixed height is specified). This works really well on Firefox and Chrome. In my use case, it's going to be pretty rare to look at previous rounds before the one I set with the base round, so if that UI is a little janky I'm ok with it. |
Well, "fill the screen" can mean different things.
Such solution seems to me problematic in many ways, for instance
Making things "full viewport" might be a tough challenge, from my experience. I mean, not only with bracketry but in webdev in general. I don't know your browser/device requirements but anyway try this example - how far is it from what you need? And does it behave well on various devices that you mean to support? This example forces the bracket to be exactly the viewport height by setting "100%" heights in css. |
You are correct in all your guesses. :) I was indeed trying to show as much of a tournament as a user's screen would allow. I do like your full screen example, but I have a menu bar and a footer I want to maintain, and a little text between the menu bar and the top of the bracket, so I gather it won't work for me. Anyway, I think the fluid height works great as is today in Firefox and Chrome. It's just Safari that is being problematic, and it sounds like you're on that. |
"Growing height" in Safari is now fixed. At least it looks ok to me. I have limited access to macOS / iOS devices so it'd be great if you try it. (You can also just visit an auto-height example page in Safari). Note that I will probably disable this "fluid height" behaviour in later versions. |
Confirmed, your example page works correctly in Safari. Thanks! |
On https://bracketry.app/create-bracket/#problem-of-height, you list some problems with height and sizing. Sadly, when I go look at this page in any Safari browser (mac os or iphone), the problems are worse than you describe - as soon as bracketry detects me scrolling on that example, every few seconds bracketry keeps redrawing things to be stretched vertically further and further apart. Looking at this page with Firefox and Chrome have no such issues.
FWIW, in testing this on my own test case (https://silentmedia.com/bracketry/), the problem seems to manifest only when the entire width of the bracket doesn't fit in the window. If the window is wide enough to contain the full bracket, then vertical scrolling has no terrible effect.
I can hide this problem by setting the height of the enclosing element, as you suggest, but then we have a different problem: when I use setBaseRoundIndex(), then the bracket defaults to viewing the vertical top of the bracket, even though the actual information might be far below the bottom of the window. This is terribly confusing to users, and again, this problem only manifests on Safari - on Firefox and Chrome, bracketry will show the vertical middle of the bracket on the defined base round index.
The text was updated successfully, but these errors were encountered: