chylex/Transparent-Twitch-Chat
1
0
Fork 0
mirror of https://github.com/chylex/Transparent-Twitch-Chat.git synced 2025-04-10 22:15:45 +02:00
Code

Update build

Browse Source
This commit is contained in:
chylex 2017-05-04 00:55:51 +02:00
parent 55a3c6183f
commit c394e9fcb7
2 changed files with 31 additions and 31 deletions

50
dist/TransparentTwitchChat.user.js vendored
View File

@ -1,7 +1,7 @@
// ==UserScript==
// @name Transparent Twitch Chat
// @description TODO
// @version 0.1
// @version 0.1.1
// @namespace https://chylex.com
// @include https://www.twitch.tv/*
// @run-at document-end
@ -23,6 +23,10 @@ function generateCSS(){
style.id = "chylex-ttc-style";
document.head.appendChild(style);
let settings = {
chatWidth: 350
};
for(let rule of `
// simulate expandRight style
@ -41,59 +45,51 @@ function generateCSS(){
// fix player controls
.theatre #main_col:not(.expandRight) .player-hover {
margin-right: 340px;
margin-right: ${settings.chatWidth - 10}px;
}
.theatre #main_col:not(.expandRight) #right_close {
margin-right: 350px;
margin-right: ${settings.chatWidth}px;
}
.theatre #main_col:not(.expandRight) .player-streamstatus {
margin-right: 370px !important;
margin-right: ${settings.chatWidth + 20}px !important;
}
.theatre #main_col.expandRight .player-streamstatus {
margin-right: 20px !important;
}
// fix right column
// change chat container
.theatre #right_col {
background: none !important;
}
// change chat container (base)
.theatre .chat-container:not(:hover) {
background: #17141f40 !important;
color: #ece8f3 !important;
text-shadow: 0 0 2px #000, 0 0 3px #000;
}
.theatre .chat-header {
.theatre .chat-container:not(:hover) .chat-header {
background-color: #17141f40 !important;
}
.theatre .chat-container {
background: #17141f40 !important;
color: #d0ccd8 !important;
text-shadow: 0 0 2px #000, 0 0 3px #000;
//transition: background 0.075s, color 0.075s;
.theatre .chat-container:not(:hover) .chat-messages .timestamp {
color: #aaa4b3 !important;
}
.theatre .chat-interface {
opacity: 0.5;
//transition: opacity 0.075s;
.theatre .chat-container:not(:hover) .chat-messages .badges {
opacity: 0.6;
}
// change chat container (restore on hover)
.theatre .chat-container:hover .chat-header {
background-color: #17141f !important;
.theatre .chat-container:not(:hover) .chat-messages .from {
text-shadow: 0 0 2px #000;
}
.theatre .chat-container:hover {
background: #17141f !important;
color: #898395 !important;
text-shadow: none;
}
.theatre .chat-container:hover .chat-interface {
opacity: 1;
.theatre .chat-container:not(:hover) .chat-interface {
opacity: 0.6;
}`.split("}")){
if (rule.length){
let parsed = rule.replace(/^\/\/(.*?)$/gm, "")+"}";

12
src/main.js
View File

@ -1,7 +1,7 @@
// ==UserScript==
// @name Transparent Twitch Chat
// @description TODO
// @version 0.1
// @version 0.1.1
// @namespace https://chylex.com
// @include https://www.twitch.tv/*
// @run-at document-end
@ -23,6 +23,10 @@ function generateCSS(){
style.id = "chylex-ttc-style";
document.head.appendChild(style);
let settings = {
chatWidth: 350
};
for(let rule of `
// simulate expandRight style
@ -41,15 +45,15 @@ function generateCSS(){
// fix player controls
.theatre #main_col:not(.expandRight) .player-hover {
margin-right: 340px;
margin-right: ${settings.chatWidth - 10}px;
}
.theatre #main_col:not(.expandRight) #right_close {
margin-right: 350px;
margin-right: ${settings.chatWidth}px;
}
.theatre #main_col:not(.expandRight) .player-streamstatus {
margin-right: 370px !important;
margin-right: ${settings.chatWidth + 20}px !important;
}
.theatre #main_col.expandRight .player-streamstatus {