Fix buttons intersecting on Subscribed Channels tab #4058
Merged
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
Note that this can still occur if one of the words in 'Unsubscribe' is pretty big on smaller screen sizes, e.g., Svenska at 515px. This is because we allow the Unsubscribe button to be wider than the element itself, which is hard to change here without completely reworking the structure using (due to limitations with minmax being unable to have fit-content in a grid definition).
github-actions
bot
added
the
PR: waiting for review
PikachuEXE
requested changes
Sep 19, 2023
…n.css Co-authored-by: PikachuEXE <[email protected]>
absidue
approved these changes
Sep 19, 2023
PikachuEXE
approved these changes
Sep 20, 2023
PikachuEXE
requested review from
efb4f5ff-1298-471a-8973-3d47447115dc and
ChunkyProgrammer
ChunkyProgrammer
approved these changes
Sep 20, 2023
github-actions
bot
removed
the
PR: waiting for review
1 task
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.
Fix buttons intersecting on Subscribed Channels tab
Pull Request Type
Related issue
None
Description
Fixes buttons on the Subscribed Channels tab intersecting in many languages. In all languages where this issue occurs, there are multiple words in the Unsubscribe button label text, which causes the buttons to intersect. This change has the words wrap in such cases and updates the default behavior for all
ft-subscribe-buttons for future-proofing. As a result, this wrapping behavior goes into effect on other instances offt-subscribe-buttonwhen the button would otherwise overflow to outside of the container (e.g., the subscribe button on the Channel page on very small viewport widths), but this is desired behavior in those cases.Screenshots
Before:
After:
Testing
Svenska/ Swedish)Desktop