mirrors/copyparty
1
0
Fork 0
mirror of https://github.com/9001/copyparty.git synced 2026-06-21 05:32:25 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

add color picker for accent color

Browse source
This commit is contained in:
Til Schmitter 2026-04-22 15:08:43 +02:00
parent 89068d35ae
commit 853ecbf9f7
1 changed files with 22 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
copyparty/web/browser.js
View file

@ -1247,7 +1247,10 @@ ebi('op_cfg').innerHTML = (
' <h3 id="h_theme">🎨 ' + L.cl_themes + '</h3>\n' + ' <h3 id="h_theme">🎨 ' + L.cl_themes + '</h3>\n' +
' <div>' + ' <div>' +
' <select id="themes"></select>' + ' <select id="themes"></select>' +
' <input type="text" id="accent" placeholder="#color" tt="' + L.cl_accent +'"></input>' + ' <div id="colordiv" tt="' + L.cl_accent +'">' +
' <input type="text" id="accent" placeholder="#color"></input>' +
' <input type="color" id="accent_picker"></input>' +
' </div>' +
' </div>\n' + ' </div>\n' +
'</div>\n' + '</div>\n' +
'<div>\n' + '<div>\n' +
@ -1344,19 +1347,30 @@ function parseColor (strColor) {
s.color = strColor; s.color = strColor;
return s.color !== '' ? s.color : ''; return s.color !== '' ? s.color : '';
} }
function setColor (color) {
ebi('accent').oninput = function () { accent = color;
var validcolor = parseColor(this.value);
clmod(ebi('accent'), 'invalid', this.value.length != 0 && validcolor.length == 0);
if(validcolor == accent)
return;
accent = validcolor;
swrite('accent', accent); swrite('accent', accent);
var a = accent || '#fc0'; var a = accent || '#fc0';
console.log('accent color set to: ' + a); console.log('accent color set to: ' + a);
document.documentElement.style.setProperty('--a', a); document.documentElement.style.setProperty('--a', a);
} }
var accent = ebi('accent').value = sread('accent'); ebi('accent').oninput = ebi('accent_picker').oninput = function () {
if(this == ebi('accent'))
ebi('accent_picker').value = this.value;
else if(this == ebi('accent_picker'))
ebi('accent').value = this.value;
var validcolor = parseColor(this.value);
clmod(ebi('accent'), 'invalid', this.value.length != 0 && validcolor.length == 0);
if(validcolor == accent)
return;
setTimeout(() => {
setColor(validcolor);
}, 100);
}
var accent = ebi('accent').value = ebi('accent_picker').value = sread('accent');
if(accent){ if(accent){
document.documentElement.style.setProperty('--a', parseColor(accent)); document.documentElement.style.setProperty('--a', parseColor(accent));
} }