Add fading to overflowing callouts to indicate scrolling#13334
Merged
polypixeldev merged 1 commit intomainfrom Mar 31, 2026
Merged
Add fading to overflowing callouts to indicate scrolling#13334polypixeldev merged 1 commit intomainfrom
polypixeldev merged 1 commit intomainfrom
Conversation
YodaLightsabr
approved these changes
Mar 31, 2026
| } | ||
|
|
||
| .scroll-fade.is-top-overflowing { | ||
| --top-mask-size: 48px !important; |
Contributor
There was a problem hiding this comment.
In theory !important isn't required here, but it doesn't make a difference either way
Merged
github-merge-queue bot
pushed a commit
that referenced
this pull request
Apr 8, 2026
## Summary of the problem <!-- Why are these changes being made? What problem does it solve? Link any related issues to provide more details. --> #13334 added fading to overflowing contracts to indicate scrolling. However, it didn't attach event listeners on Turbo load, applied fading when it shouldn't have, and removed padding on non-overflowing callouts. ## Describe your changes <!-- Explain your thought process to the solution and provide a quick summary of the changes. --> Attach listeners on turbo load, add check for if an element scrolls, and fixes the padding. <!-- If there are any visual changes, please attach images, videos, or gifs. --> --------- Co-authored-by: yodalightsabr <yoda@yodacode.xyz>
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
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.
Summary of the problem
Currently, we use an overflowing callout on the contract FAQ since there's a lot of items. However, if the browser automatically hides the scroll bar, it can be unclear that it is a scrollable container.
Closes #13240
Describe your changes
Adds fading (credit to stackoverflow) to overflowing callouts to indicate scrolling.
Screencast.From.2026-03-30.22-05-42.mp4