Skip to content

Commit 86ecc4f

Browse files
Andrews54757Andrews54757
committed
Adjust colors
1 parent 3109211 commit 86ecc4f

File tree

2 files changed

+116
-114
lines changed

2 files changed

+116
-114
lines changed

‎chrome/player/FastStreamClient.mjs‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -888,6 +888,8 @@ export class FastStreamClient extends EventEmitter {
888888
console.error(e);
889889
}
890890

891+
DOMElements.playerContainer.style.backgroundColor = 'black';
892+
891893
this.emit('setsource', this);
892894
}
893895

‎chrome/player/assets/fluidplayer/css/colors.css‎

Lines changed: 114 additions & 114 deletions
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,117 @@ body[data-theme="default"] {
8888
--link-color: #4da3ff;
8989
}
9090

91+
92+
/* =========================
93+
High Contrast
94+
Accessibility focused with large contrast ratios
95+
========================= */
96+
body[data-theme="contrast"] {
97+
--mainplayer-background-color: #000000;
98+
--controls-background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 35%, rgba(0, 0, 0, 0.95) 100%);
99+
--progress-bar-background-color: rgba(255, 255, 255, 0.35);
100+
--progress-bar-current-progress-color: #ffeb3b;
101+
--progress-bar-knob-color: #ffffff;
102+
--volume-slider-background-color: rgba(255, 255, 255, 0.35);
103+
--volume-slider-knob-color: #ffffff;
104+
105+
--menu-background-color: rgba(0, 0, 0, 0.98);
106+
--menu-text-color: #ffffff;
107+
--menu-border: 1px solid #ffffff;
108+
--menu-list-item-hover-background-color: rgba(255, 255, 255, 0.12);
109+
--menu-list-item-active-background-color: rgba(255, 255, 255, 0.22);
110+
--menu-textbutton-background-color: rgba(255, 255, 255, 0.08);
111+
--menu-textbutton-text-color: #ffffff;
112+
--menu-textbutton-hover-background-color: rgba(255, 255, 255, 0.18);
113+
--menu-quality-sublist-indent-shadow-color: #ffffff;
114+
--menu-quality-sublist-indent-shadow-color-active: #e0e0e0;
115+
116+
--seek-preview-background-color: rgba(0, 0, 0, 0.95);
117+
--seek-preview-text-color: #ffffff;
118+
--seek-preview-detached-tip-color: #ffffff;
119+
120+
--progress-download-initiated-color: #00ff95;
121+
--progress-download-complete-color: rgba(255, 255, 255, 0.25);
122+
--progress-download-failed-color: #ff1744;
123+
--intro-outro-bar-color: #ffeb3b;
124+
125+
--popbutton-background-color: rgba(0, 0, 0, 0.95);
126+
--popbutton-text-color: #ffffff;
127+
--popbutton-border: 1px solid #ffffff;
128+
--popbutton-hover-background-color: rgba(255, 255, 255, 0.12);
129+
--popbutton-hover-border: 1px solid #ffeb3b;
130+
131+
--seek-marker-undo-color: #00e5ff;
132+
--seek-marker-redo-color: #ffee58;
133+
--analyzer-marker-color: #e0e0e0;
134+
135+
--close-button-color: rgba(255, 0, 0, 0.8);
136+
--close-button-hover-color: rgba(255, 0, 0, 1);
137+
138+
--popwindow-border: 2px solid #ffffff;
139+
--popwindow-background-color: rgba(0, 0, 0, 0.98);
140+
--popwindow-text-color: #ffffff;
141+
--popwindow-button-background-color: #111111;
142+
--popwindow-button-text-color: #ffffff;
143+
--popwindow-button-titletext-color: #d0d0d0;
144+
--popwindow-button-hover-background-color: #1a1a1a;
145+
--popwindow-button-active-background-color: #81771d;
146+
--popwindow-dropdown-item-background-color: #0d0d0d;
147+
--popwindow-dropdown-item-selected-background-color: #000000;
148+
--popwindow-dropdown-item-hover-background-color: #1a1a1a;
149+
--popwindow-dropdown-text-focus-outline: 2px solid #ffeb3b;
150+
--popwindow-textinput-focus-border-color: #ffeb3b;
151+
152+
--source-delete-button-color: #ff5252;
153+
--source-delete-button-hover-color: #ff1744;
154+
--source-active-url-color: #00ff95;
155+
--source-headers-invalid-border: 2px solid #ff1744;
156+
157+
--timeline-current-position-color: #ffeb3b;
158+
--timeline-cue-background-color: rgba(255, 255, 255, 0.35);
159+
--timeline-cue-text-color: #000000;
160+
--timeline-tick-color: rgba(255, 255, 255, 0.95);
161+
--timeline-tick-label-color: rgba(255, 255, 255, 1);
162+
--timeline-vad-line-color: #ffffff;
163+
164+
--subtitle-tool-color: #ffffff;
165+
--linkui-toggle-color: #ffeb3b;
166+
--soundwave-toggle-color: #00e5ff;
167+
168+
--status-success-color: #3cff00;
169+
--status-error-color: #ff1744;
170+
--status-warning-color: #ffeb3b;
171+
172+
--subtitles-toggle-color: rgb(196, 84, 223);
173+
--subtitles-track-enabled-color: #00ff64;
174+
--subtitles-track-disabled-color: #ff6e40;
175+
176+
--button-badge-background-color: #ff3d00;
177+
--nextvideo-badge-background-color: #00bcd4;
178+
--update-notif-badge-text-color: #ffeb3b;
179+
--save-notif-badge-text-color: #00ff64;
180+
181+
--seek-preview-video-border-color: rgba(255, 255, 255, 0.25);
182+
--chapter-marker-color: rgba(0, 0, 0, 0.85);
183+
184+
--input-border: 2px solid #ffffff;
185+
--input-background-color: rgba(0, 0, 0, 0.9);
186+
--input-text-color: #ffffff;
187+
--input-focus-border: 2px solid #ffeb3b;
188+
189+
--loudness-threshold-bar-color: #ff00d4;
190+
191+
--playback-rate-menu-background: linear-gradient(rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 85%, rgba(0, 0, 0, 0.6) 100%);
192+
--playback-rate-menu-item-border: 1px solid #ffffff;
193+
194+
--volume-control-unity-volume-color: #c0c0c0;
195+
196+
--tooltip-background-color: #ffffff;
197+
--tooltip-text-color: #000000;
198+
--eq-tooltip-background-color: rgba(255, 255, 255, 0.9);
199+
--link-color: #ffeb3b;
200+
}
201+
91202
/* =========================
92203
Arctic Light
93204
Clean light UI with blue accents
@@ -418,117 +529,6 @@ body[data-theme="neon"] {
418529
--link-color: #00f0ff;
419530
}
420531

421-
/* =========================
422-
High Contrast
423-
Accessibility focused with large contrast ratios
424-
========================= */
425-
body[data-theme="contrast"] {
426-
--mainplayer-background-color: #000000;
427-
--controls-background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 35%, rgba(0, 0, 0, 0.95) 100%);
428-
--progress-bar-background-color: rgba(255, 255, 255, 0.35);
429-
--progress-bar-current-progress-color: #ffeb3b;
430-
--progress-bar-knob-color: #ffffff;
431-
--volume-slider-background-color: rgba(255, 255, 255, 0.35);
432-
--volume-slider-knob-color: #ffffff;
433-
434-
--menu-background-color: rgba(0, 0, 0, 0.98);
435-
--menu-text-color: #ffffff;
436-
--menu-border: 1px solid #ffffff;
437-
--menu-list-item-hover-background-color: rgba(255, 255, 255, 0.12);
438-
--menu-list-item-active-background-color: rgba(255, 255, 255, 0.22);
439-
--menu-textbutton-background-color: rgba(255, 255, 255, 0.08);
440-
--menu-textbutton-text-color: #ffffff;
441-
--menu-textbutton-hover-background-color: rgba(255, 255, 255, 0.18);
442-
--menu-quality-sublist-indent-shadow-color: #ffffff;
443-
--menu-quality-sublist-indent-shadow-color-active: #e0e0e0;
444-
445-
--seek-preview-background-color: rgba(0, 0, 0, 0.95);
446-
--seek-preview-text-color: #ffffff;
447-
--seek-preview-detached-tip-color: #ffffff;
448-
449-
--progress-download-initiated-color: #00ff95;
450-
--progress-download-complete-color: rgba(255, 255, 255, 0.25);
451-
--progress-download-failed-color: #ff1744;
452-
--intro-outro-bar-color: #ffeb3b;
453-
454-
--popbutton-background-color: rgba(0, 0, 0, 0.95);
455-
--popbutton-text-color: #ffffff;
456-
--popbutton-border: 1px solid #ffffff;
457-
--popbutton-hover-background-color: rgba(255, 255, 255, 0.12);
458-
--popbutton-hover-border: 1px solid #ffeb3b;
459-
460-
--seek-marker-undo-color: #00e5ff;
461-
--seek-marker-redo-color: #ffee58;
462-
--analyzer-marker-color: #e0e0e0;
463-
464-
--close-button-color: rgba(255, 0, 0, 0.8);
465-
--close-button-hover-color: rgba(255, 0, 0, 1);
466-
467-
--popwindow-border: 2px solid #ffffff;
468-
--popwindow-background-color: rgba(0, 0, 0, 0.98);
469-
--popwindow-text-color: #ffffff;
470-
--popwindow-button-background-color: #111111;
471-
--popwindow-button-text-color: #ffffff;
472-
--popwindow-button-titletext-color: #d0d0d0;
473-
--popwindow-button-hover-background-color: #1a1a1a;
474-
--popwindow-button-active-background-color: #81771d;
475-
--popwindow-dropdown-item-background-color: #0d0d0d;
476-
--popwindow-dropdown-item-selected-background-color: #000000;
477-
--popwindow-dropdown-item-hover-background-color: #1a1a1a;
478-
--popwindow-dropdown-text-focus-outline: 2px solid #ffeb3b;
479-
--popwindow-textinput-focus-border-color: #ffeb3b;
480-
481-
--source-delete-button-color: #ff5252;
482-
--source-delete-button-hover-color: #ff1744;
483-
--source-active-url-color: #00ff95;
484-
--source-headers-invalid-border: 2px solid #ff1744;
485-
486-
--timeline-current-position-color: #ffeb3b;
487-
--timeline-cue-background-color: rgba(255, 255, 255, 0.35);
488-
--timeline-cue-text-color: #000000;
489-
--timeline-tick-color: rgba(255, 255, 255, 0.95);
490-
--timeline-tick-label-color: rgba(255, 255, 255, 1);
491-
--timeline-vad-line-color: #ffffff;
492-
493-
--subtitle-tool-color: #ffffff;
494-
--linkui-toggle-color: #ffeb3b;
495-
--soundwave-toggle-color: #00e5ff;
496-
497-
--status-success-color: #3cff00;
498-
--status-error-color: #ff1744;
499-
--status-warning-color: #ffeb3b;
500-
501-
--subtitles-toggle-color: #f1c40f;
502-
--subtitles-track-enabled-color: #00ff64;
503-
--subtitles-track-disabled-color: #ff6e40;
504-
505-
--button-badge-background-color: #ff3d00;
506-
--nextvideo-badge-background-color: #00bcd4;
507-
--update-notif-badge-text-color: #ffeb3b;
508-
--save-notif-badge-text-color: #00ff64;
509-
510-
--seek-preview-video-border-color: rgba(255, 255, 255, 0.25);
511-
--chapter-marker-color: rgba(0, 0, 0, 0.85);
512-
513-
--input-border: 2px solid #ffffff;
514-
--input-background-color: rgba(0, 0, 0, 0.9);
515-
--input-text-color: #ffffff;
516-
--input-focus-border: 2px solid #ffeb3b;
517-
518-
--loudness-threshold-bar-color: #ff00d4;
519-
520-
--playback-rate-menu-background: linear-gradient(rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 85%, rgba(0, 0, 0, 0.6) 100%);
521-
--playback-rate-menu-item-border: 1px solid #ffffff;
522-
523-
--volume-control-unity-volume-color: #c0c0c0;
524-
525-
--tooltip-background-color: #ffffff;
526-
--tooltip-text-color: #000000;
527-
--eq-tooltip-background-color: rgba(255, 255, 255, 0.9);
528-
--link-color: #ffeb3b;
529-
}
530-
531-
532532
/* =========================
533533
Sunset Glow
534534
Warm light UI with coral accents
@@ -1049,7 +1049,7 @@ body[data-theme="desert"] {
10491049
--status-error-color: #cc3344;
10501050
--status-warning-color: #ffcc00;
10511051

1052-
--subtitles-toggle-color: #b07dff;
1052+
--subtitles-toggle-color: #7f58b8;
10531053
--subtitles-track-enabled-color: #16ad5f;
10541054
--subtitles-track-disabled-color: #ff784e;
10551055

@@ -1153,13 +1153,13 @@ body[data-theme="mint"] {
11531153

11541154
--subtitle-tool-color: #0a221d;
11551155
--linkui-toggle-color: #00bfa5;
1156-
--soundwave-toggle-color: #4dd0e1;
1156+
--soundwave-toggle-color: #31a7b6;
11571157

11581158
--status-success-color: #0bbf6a;
11591159
--status-error-color: #cc3344;
11601160
--status-warning-color: #ffcc00;
11611161

1162-
--subtitles-toggle-color: #7bd4ff;
1162+
--subtitles-toggle-color: #4d6b9e;
11631163
--subtitles-track-enabled-color: #0aa84f;
11641164
--subtitles-track-disabled-color: #ff784e;
11651165

0 commit comments

Comments
 (0)