Alternative to country list scroll #195
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Update to most recent state
Wrap the top elements of the Countries list such that they can stick on top.
.countriestopwrapper p needs to be at the bottom, after the other p declarations, because of specificity issues. It is needed because of margin/padding conflicts (e.g. collapsing margins). Also removing leftover .countries formatting relating to scrolling.
customizetopwrapper and separator are sticky. countriestopwrapper was changed to accommodate the new sticky elements. Changing aside padding-top to allow for the customizetopwrapper to work seamlessly. min-width is removed from .search and .select, as they break the flow. (might change the width of aside to fix)
This enables "scroll to top" when clicking the titles, allowing for easy going back-from the sections.
Added h2 hover formatting Changed some stuff in .separator and .countriestopwrapper
|
Deploy preview for frosty-benz-8c81bf ready! Built without sensitive environment variables with commit f27da65 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
So, this is an alternative to the way the right side of the page is being scrolled. I had thought of this some time ago, but just changing a single line didn't seem too big of an improvement, so I added a bit more functionality to make it worth it.
I'm creating the pull request mostly as a way to show what I thought of this and also as a way to check some bugs that might be lurking. I'm not saying this is the right or best way to do this, or even that there is a wrong way, just presenting different ways to do this.
So, this removes the scrollbar from the countries list, allowing for the right side to scroll. However, if you scroll to the bottom of the list, getting up might be an issue, so I tried to make the titles of the sections to always appear on top, and clicking on them would lead to the top of the sections.
The bugs I know of are two: There's a pixel-wide scrolling issue with the separator that I tried to fix, but it still shows up occasionally, and it might be browser dependent, as it's a drawing issue. The other one is due to keyboard scrolling with Tab, in which the section doesn't show the selected object.
Feedback and comments are always welcome.