danvics/soulsync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

css changes

Browse source
This commit is contained in:
Broque Thomas 2026-03-01 15:34:51 -08:00
parent 4fba18b25e
commit 71fe5b83eb
3 changed files with 13 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
webui/index.html
View file

@ -3363,7 +3363,8 @@
<select id="accent-preset" class="form-select">
<option value="#1db954">Spotify Green</option>
<option value="#1d8ab9">Ocean Blue</option>
<option value="#8b5cf6">Purple</option>
<option value="#a78bfa">Purple</option>
<option value="#8b5cf6">Boulder Purple</option>
<option value="#f59e0b">Sunset Orange</option>
<option value="#f43f5e">Rose</option>
<option value="#14b8a6">Teal</option>

13
webui/static/script.js
View file

@ -328,7 +328,8 @@ const API = {
// ---- Accent Color System ----
function getAccentFallbackColors() {
const accent = localStorage.getItem('soulsync-accent') || '#1db954';
let accent = localStorage.getItem('soulsync-accent') || '#1db954';
if (!/^#[0-9a-fA-F]{6}$/.test(accent)) accent = '#1db954';
// Compute a lighter variant for the second color
const r = parseInt(accent.slice(1, 3), 16), g = parseInt(accent.slice(3, 5), 16), b = parseInt(accent.slice(5, 7), 16);
const lighter = '#' + [Math.min(r + 20, 255), Math.min(g + 30, 255), Math.min(b + 12, 255)]
@ -337,6 +338,10 @@ function getAccentFallbackColors() {
}
function applyAccentColor(hex) {
// Validate hex format — reject corrupt values
if (typeof hex !== 'string' || !/^#[0-9a-fA-F]{6}$/.test(hex)) {
hex = '#1db954'; // fallback to default
}
// Convert hex to RGB
const r = parseInt(hex.slice(1, 3), 16);
const g = parseInt(hex.slice(3, 5), 16);
@ -402,10 +407,10 @@ function initAccentColorListeners() {
presetSelect.addEventListener('change', () => {
const val = presetSelect.value;
if (val === 'custom') {
customGroup.style.display = '';
applyAccentColor(customPicker.value);
if (customGroup) customGroup.style.display = '';
if (customPicker) applyAccentColor(customPicker.value);
} else {
customGroup.style.display = 'none';
if (customGroup) customGroup.style.display = 'none';
applyAccentColor(val);
}
});

4
webui/static/style.css
View file

@ -25884,7 +25884,7 @@ body {
}
.candidates-modal-body::-webkit-scrollbar { width: 8px; }
.candidates-modal-body::-webkit-scrollbar-track { background: rgba(255,255,255,0.05); border-radius: 4px; }
.candidates-modal-body::-webkit-scrollbar-thumb { background: rgba(29,185,84,0.3); border-radius: 4px; }
.candidates-modal-body::-webkit-scrollbar-thumb { background: rgba(var(--accent-rgb),0.3); border-radius: 4px; }
.candidates-error-summary {
background: rgba(255, 255, 255, 0.05);
@ -25950,7 +25950,7 @@ body {
letter-spacing: 0.5px;
margin-right: 4px;
}
.candidates-quality-flac { background: rgba(29,185,84,0.2); color: rgb(var(--accent-rgb)); }
.candidates-quality-flac { background: rgba(var(--accent-rgb),0.2); color: rgb(var(--accent-rgb)); }
.candidates-quality-mp3 { background: rgba(100,149,237,0.2); color: #6495ed; }
.candidates-quality-ogg, .candidates-quality-aac, .candidates-quality-wma { background: rgba(255,165,0,0.2); color: #ffa500; }
.candidates-download-btn {