Extension icon indicating copy to clipboard operation
Extension copied to clipboard

[BUG] Twitch - Hiding unfollow button makes the "React" and other elements overlap

Open GODrums opened this issue 2 years ago • 0 comments

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: Screenshot_458 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: Screenshot_459 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: Screenshot_460

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: Screenshot_461 (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

GODrums avatar May 15 '23 01:05 GODrums