-
-
Notifications
You must be signed in to change notification settings - Fork 552
/
themes.js
132 lines (122 loc) · 5.95 KB
/
themes.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
/*------------------------------------------------------------------------------
4.3.0 THEMES
------------------------------------------------------------------------------*/
ImprovedTube.setTheme = function () {
let darkCookie;
switch(this.storage.theme) {
case 'custom':
if (Array.isArray(this.storage.theme_primary_color) && Array.isArray(this.storage.theme_text_color)) {
var style = this.elements.my_colors || document.createElement('style'),
primary_color = this.storage.theme_primary_color,
text_color = this.storage.theme_text_color;
if (primary_color) {
primary_color = 'rgb(' + primary_color.join(',') + ')';
} else {
primary_color = 'rgb(200, 200, 200)';
}
if (text_color) {
text_color = 'rgb(' + text_color.join(',') + ')';
} else {
text_color = 'rgb(25, 25, 25)';
}
style.className = 'it-theme-editor';
style.textContent = 'html{' +
'--yt-swatch-textbox-bg:rgba(19,19,19,1)!important;' +
'--yt-swatch-icon-color:rgba(136,136,136,1)!important;' +
'--yt-spec-brand-background-primary:rgba(0,0,0, 0.1) !important;' +
'--yt-spec-brand-background-secondary:rgba(0,0,0, 0.1) !important;' +
'--yt-spec-badge-chip-background:rgba(0, 0, 0, 0.05) !important;' +
'--yt-spec-verified-badge-background:rgba(0, 0, 0, 0.15) !important;' +
'--yt-spec-button-chip-background-hover:rgba(0, 0, 0, 0.10) !important;' +
'--yt-spec-brand-button-background:rgba(136,136,136,1) !important;' +
'--yt-spec-filled-button-focus-outline:rgba(0, 0, 0, 0.60) !important;' +
'--yt-spec-call-to-action-button-focus-outline:rgba(0,0,0, 0.30) !important;' +
'--yt-spec-brand-text-button-focus-outline:rgba(204, 0, 0, 0.30) !important;' +
'--yt-spec-10-percent-layer:rgba(136,136,136,1) !important;' +
'--yt-swatch-primary:' + primary_color + '!important;' +
'--yt-swatch-primary-darker:' + primary_color + '!important;' +
'--yt-spec-brand-background-solid:' + primary_color + '!important;' +
'--yt-spec-general-background-a:' + primary_color + '!important;' +
'--yt-spec-general-background-b:' + primary_color + '!important;' +
'--yt-spec-general-background-c:' + primary_color + '!important;' +
'--yt-spec-touch-response:' + primary_color + '!important;' +
'--yt-swatch-text: ' + text_color + '!important;' +
'--yt-swatch-important-text: ' + text_color + '!important;' +
'--yt-swatch-input-text: ' + text_color + '!important;' +
'--yt-swatch-logo-override: ' + text_color + '!important;' +
'--yt-spec-text-primary:' + text_color + ' !important;' +
'--yt-spec-text-primary-inverse:' + text_color + ' !important;' +
'--yt-spec-text-secondary:' + text_color + ' !important;' +
'--yt-spec-text-disabled:' + text_color + ' !important;' +
'--yt-spec-icon-active-other:' + text_color + ' !important;' +
'--yt-spec-icon-inactive:' + text_color + ' !important;' +
'--yt-spec-icon-disabled:' + text_color + ' !important;' +
'--yt-spec-filled-button-text:' + text_color + ' !important;' +
'--yt-spec-call-to-action-inverse:' + text_color + ' !important;' +
'--yt-spec-brand-icon-active:' + text_color + ' !important;' +
'--yt-spec-brand-icon-inactive:' + text_color + ' !important;' +
'--yt-spec-brand-link-text:' + text_color + '!important;' +
'--yt-spec-brand-subscribe-button-background:' + text_color + ' !important;' +
'--yt-spec-wordmark-text:' + text_color + ' !important;' +
'--yt-spec-selected-nav-text:' + text_color + ' !important;' +
'--yt-spec-base-background:' + primary_color + '!important;' +
'--yt-spec-raised-background:' + primary_color + '!important;' +
'--yt-spec-menu-background:' + primary_color + '!important;' +
'ytd-masthead { background-color:' + primary_color + '!important;}' +
'--yt-spec-inverted-background: #fff;' +
'}';
this.elements.my_colors = style;
document.documentElement.appendChild(style);
document.documentElement.removeAttribute('dark');
if (document.getElementById("cinematics")) {
document.getElementById("cinematics").style.visibility = 'hidden';
document.getElementById("cinematics").style.display = 'none !important';
}
if (document.querySelector('ytd-masthead')) {
document.querySelector('ytd-masthead').style.backgroundColor = ''+primary_color+'';
}
} else if (this.elements.my_colors) {
this.elements.my_colors.remove();
}
break
case 'black':
case 'dark':
darkCookie = true;
document.documentElement.setAttribute('dark', '');
document.querySelector('ytd-masthead')?.setAttribute('dark', '');
document.querySelector('ytd-masthead')?.removeAttribute('style');
if (document.getElementById("cinematics")) {
document.getElementById('cinematics').style.visibility = 'visible';
document.getElementById('cinematics').style.display = 'none !important';
}
if (this.elements.my_colors) {
this.elements.my_colors.remove();
}
break
case 'default':
case 'dawn':
case 'sunset':
case 'night':
case 'plain':
case 'desert':
document.documentElement.removeAttribute('dark');
document.querySelector('ytd-masthead')?.removeAttribute('dark');
document.querySelector('ytd-masthead')?.removeAttribute('style');
document.getElementById('cinematics')?.removeAttribute('style');
this.elements.my_colors?.remove();
break
}
let cookie = this.getPrefCookieValueByName('f6');
// f6 stores more than Theme. Treat it like hex number, we are only allowed to add/remove 0x80000 (light theme) and 0x400 (dark theme).
if (cookie && !isNaN(cookie)) {
// valid f6
let negation = parseInt(cookie, 16) & parseInt(80400, 16);
cookie = (parseInt(cookie, 16) - negation); // remove 80000 and 400
cookie = cookie ^ (darkCookie ? parseInt(400, 16) : 0); // apply optional darkCookie
cookie = cookie.toString(16); // back to hex
} else {
// missing or corrupted f6, fully overwrite
cookie = darkCookie ? 400 : null;
}
this.setPrefCookieValueByName('f6', cookie);
};