Move Page Element on Twitch.tv

edited November 24 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 25 [?]
    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.