[BUG] Twitch - Hiding unfollow button makes the "React" and other elements overlap
Is there an existing issue for this?
- [X] I have searched the existing issues
This issue exists in the latest nightly version
- [X] I am using the latest nightly version
What browsers are you seeing the problem on?
Chrome
Current Behavior
When checking the "Hide unfollow button" option in "Twitch Features", the "React" and notification elements overlap.
Pretty easy to see the issue in this image:
This also happens when the "hide live notification button" is checked as well.
Most likely this issue is fault to the margin-right style of the "React" element, see this image from the Chrome DevTools:
Disabling this margin property makes the alignment correct when the unfollow button is hidden but leads to issues when it's not hidden, see this image:
An easy fix could be to disable that margin property synchronously with the hidden status of the unfollow button.
Expected Behavior
Ideally, the React and notification button would look similar to this when the unfollow button is hidden:
(This image has been created by disabling the previously mentioned margin-right property)
Steps To Reproduce
- Visit any live channel on Twitch.
- Check the "hide unfollow button" in the 7TV setting.
- It does not matter if the "hide live notification button" is checked, both times the "React" and the element to the right overlap