Notice: The devs are no longer actively involved in the forum, so any bug reports regarding the Stylish extension or this website should be sent to them directly at contact@userstyles.org.
Changing your Avatar.
The only way to currently change a forum avatar is through Gravatar.com. The email address used for your Userstyles.org account must be one of the email addresses that is registered to your Gravatar account.

Move Page Element on Twitch.tv

edited November 2018 in Style Requests [?]

New layout edit moved the view count down the page 1 tick.
I was able to move it back using Chrome inspect page/edit.
I would like a style to move the Channel info Bar:

channel-info-bar__viewers-wrapper tw-c-text-live tw-inline-flex"><div class="tw-inline-flex tw-tooltip-wrapper

to be in line with the Stream Title:

data-test-selector="channel-info-bar-title-text" title=

Please help! Thanks!

PIC: https://files.catbox.moe/o4mko6.png

Comments

  • That site's source code is horrifying. The order of the DOM isn't really conducive to changing that element's placement in any way other than absolute positioning.

    I didn't test it extensively, but this should work:
    @-moz-document domain("twitch.tv") {
    .channel-info-bar__content-right.tw-full-width {
    position: relative!important;
    }
    .tw-align-items-start.tw-flex.tw-flex-wrap.tw-justify-content-between.tw-mg-t-05 > div:last-child {
    position: absolute!important;
    top: -2px;
    right: 0;
    }

    /* restrict title width so it doesn't encroach on the new positioning */
    .channel-info-bar__content-right.tw-full-width > div:first-child {
    max-width: calc(100% - 300px)!important;
    }
    }
  • edited November 2018 [?]
    Thank you for taking the time.
    I created a new style, and pasted the code. It didnt work, and I also have this issue.

    error 1 : 1 Unknown @ rule: @-moz-document.

    edit: I cut out the .channel and the .tw code and used just that. It works.
Sign In or Register to comment.