Skip to content

Fix Twitch Redesign 2020 and scroll size up by greendev

Details

Authorgreendev

LicenseNo License

Categorytwitch.tv

Created

Updated

Size3.8 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

This CSS will change the font and colors back to how it was before. I've also decreased the font-sizes in some areas, also changed size and color of scroll.

Notes

This CSS will change the font and colors back to how it was before. I've also decreased the font-sizes in some areas, also changed size and color of scroll.

Source code

/* ==UserStyle==
@name           Fix Twitch Redesign 2020 (Dark Mode)
@namespace      USO Archive
@author         jaaneh
@description    `This CSS will change the font and colors back to how it was before. I've also decreased the font-sizes in some areas, also changed size of scroll.`
@version        20201124.11.55
@license        CC-BY-NC-ND-4.0
@preprocessor   uso
==/UserStyle== */
@-moz-document domain('www.twitch.tv'), domain('clips.twitch.tv') {
:root {
    --color-background-body: #0F0E11 !important;
    --color-background-base: #0F0E11 !important;
    --color-border-input: #212126 !important;
    --color-border-base: #252525 !important;
    --color-background-accent: #1d2537 !important;
    --color-background-accent-alt-2: #1d2537 !important;
    --color-background-input: #212126 !important;
    --color-background-input-focus: #212126 !important;
    --color-background-alt: #0F0E11 !important;
    --color-background-alt-2: #212126 !important;
}

::selection {
    background-color: #772ce8;
    color: #fff;
}

.tw-root--theme-dark {
    --color-background-interactable-alpha-hover: #212126 !important;
    --color-background-interactable-alpha-active: #212126 !important;
}

body {
    font-family: Verdana, Helvetica, sans-serif !important;
}

.tw-root--theme-dark .channel-root__right-column,
.tw-root--theme-dark .chat-room {
    background: var(--color-background-body);
}

.tw-root--theme-dark .chat-viewers__pane {
    background: var(--color-background-body);
}

.tw-absolute.tw-hover-accent-effect__corner.tw-hover-accent-effect__corner--top.tw-left-0.tw-top-0,
.tw-absolute.tw-bottom-0.tw-hover-accent-effect__corner.tw-hover-accent-effect__corner--bottom.tw-right-0 {
    display: none;
}

div.channel-info-bar__content-top.tw-flex.tw-flex-wrap.tw-justify-content-between.tw-mg-b-05.tw-sm-flex-nowrap > div.tw-flex-grow-1.tw-flex-shrink-1.tw-overflow-hidden.tw-pd-r-2 {
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
}

.tw-root--hover .tw-hover-accent-effect:hover .tw-hover-accent-effect__children {
    transform: none;
}

div.tw-absolute.tw-block.tw-bottom-0.tw-left-0.tw-mg-r-1.whispers.whispers--right-column-expanded-beside > div:nth-child(2) > div > div > div > button {
    background-color: var(--color-background-alt-2) !important;
}

.tw-c-background-alt-2 {
    background-color: var(--color-background-alt)!important;
}

.tw-root--theme-dark .side-nav__overlay-wrapper,
.side-nav__overlay-wrapper,
.tw-root--theme-dark .directory-header-new__banner-cover,
.tw-root--theme-dark .channel-header,
.tw-root--theme-dark body,
.tw-c-background-base,
.tw-root--theme-dark .clips-top-nav-user,
.channel-header {
    background: #0F0E11 !important;
}

.tw-elevation-1 {
    box-shadow: none !important;
    border-bottom: 1px solid #252525 !important;
}

h1 {
    font-size: 4.5rem !important;
}


  div.channel-header .tw-mg-l-05.tw-sm-mg-l-1.tw-visible {
      white-space: nowrap;
  }
  div.channel-header p.tw-font-size-5 {
      white-space: nowrap;
  }
  .tw-nowrap {
      white-space: nowrap;
  }

	
.tw-semibold,
.tw-strong,
h2[data-a-target="stream-title"] {
    font-weight: 300!important;
}
    
.simplebar-scrollbar {
    background: #7302bb !important; width: 1.6rem !important; border: 1px solid #ad6cff !important;;
}

.chat-line__message:focus-within .chat-line__message-highlight, .chat-line__message:focus .chat-line__message-highlight, .chat-line__message:hover .chat-line__message-highlight,
.ffz-notice-line:focus-within .chat-line__message-highlight, .ffz-notice-line:hover .chat-line__message-highlight, .ffz-notice-line:focus .chat-line__message-highlight {
    background: transparent;
}
}

Reviews

No reviews yet.