pco-plan: edge-to-edge headers, tile colors for headers / current item / key, gradient switch
Section headers lose the bracket look (no accent bar, no rounded corners) and span the full tile width, with text still aligned to the other rows. A "Colors" group in the gear menu holds swatch pickers for the song key, section headers and the current item, a switch for fading the header color to the right (on by default), and the item-type tint. Colors apply as CSS custom properties on the tile. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Fable 5.1
parent
a71b14d755
commit
d567f5459a
@@ -526,8 +526,14 @@ export default function create({ root, moduleApi }) {
|
||||
function render() {
|
||||
wrap.classList.toggle('is-offline', feedOffline);
|
||||
wrap.classList.toggle('tint-types', Boolean(cfg().tintByType));
|
||||
const keyColor = String(cfg().keyColor || '').trim();
|
||||
wrap.style.setProperty('--pp-key', /^[#a-zA-Z0-9(),.%\s-]+$/.test(keyColor) ? keyColor : '#4ea1ff');
|
||||
wrap.classList.toggle('header-gradient', cfg().headerGradient !== false);
|
||||
const color = (value, fallback) => {
|
||||
const s = String(value || '').trim();
|
||||
return /^[#a-zA-Z0-9(),.%\s-]+$/.test(s) && s ? s : fallback;
|
||||
};
|
||||
wrap.style.setProperty('--pp-key', color(cfg().keyColor, '#4ea1ff'));
|
||||
wrap.style.setProperty('--pp-header', color(cfg().headerColor, '#2ee59a'));
|
||||
wrap.style.setProperty('--pp-current', color(cfg().currentColor, '#2ee59a'));
|
||||
renderStatus();
|
||||
if (!state) {
|
||||
headEl.hidden = true;
|
||||
|
||||
Reference in New Issue
Block a user