Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2026-03-02 19:00:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improve "Fill column background with option color" (#16340)

Browse source 
* 🎨 Improve "Fill column background with option color"

fix https://github.com/siyuan-note/siyuan/issues/16337 02

* fix 01 02

* fix 03
This commit is contained in:
Jeffrey Chen 2025-11-17 09:11:28 +08:00 • committed by GitHub
parent 4f17c7fc8d
commit cc59bd1087
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 96 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

19
app/src/protyle/render/av/kanban/render.ts
View file

@ -200,21 +200,16 @@ export const renderKanban = async (options: {
}
const view: IAVGallery = data.view as IAVKanban;
let bodyHTML = "";
let isSelectGroup = false;
view.groups.forEach((group: IAVKanban) => {
if (group.groupHidden === 0) {
let selectBg = "";
if (group.fillColBackgroundColor) {
let color = "";
if (["mSelect", "select"].includes(group.groupValue.type)) {
isSelectGroup = true;
color = getComputedStyle(document.documentElement).getPropertyValue(`--b3-font-background${group.groupValue.mSelect[0].color}`);
}
if (isSelectGroup) {
if (!color) {
color = getComputedStyle(document.documentElement).getPropertyValue("--b3-border-color");
}
selectBg = `style="--b3-av-kanban-border:${color};--b3-av-kanban-bg:${color}29;--b3-av-kanban-content-bg:${color}47;--b3-av-kanban-content-hover-bg:${color}5c;"`;
if (group.fillColBackgroundColor && ["mSelect", "select"].includes(group.groupKey.type)) {
if (group.groupValue.mSelect) {
// 单选多选字段分组使用选项颜色
selectBg = `style="--b3-av-kanban-border: var(--b3-font-background${group.groupValue.mSelect[0].color}); --b3-av-kanban-content-hover-bg: var(--b3-av-kanban-border);"`;
} else {
// _@default@_ 分组使用 var(--b3-border-color)
selectBg = 'style="--b3-av-kanban-border: var(--b3-border-color); --b3-av-kanban-content-hover-bg: var(--b3-av-kanban-border);"';
}
}
bodyHTML += `<div class="av__kanban-group${group.cardSize === 0 ? " av__kanban-group--small" : (group.cardSize === 2 ? " av__kanban-group--big" : "")}"${selectBg}>

9
app/src/protyle/render/av/render.ts
View file

@ -732,14 +732,15 @@ export const refreshAV = (protyle: IProtyle, operation: IOperation) => {
item.removeAttribute("style");
return;
}
let selectBg;
const nameElement = item.querySelector(".av__group-title .b3-chip") as HTMLElement;
if (nameElement) {
selectBg = getComputedStyle(document.documentElement).getPropertyValue(`--b3-font-background${nameElement.style.backgroundColor.slice(-2, -1)}`);
const colorMatch = nameElement.style.backgroundColor.match(/--b3-font-background(\d+)/);
if (colorMatch) {
item.setAttribute("style", `--b3-av-kanban-border: var(--b3-font-background${colorMatch[1]}); --b3-av-kanban-content-hover-bg: var(--b3-av-kanban-border);`);
}
} else {
selectBg = getComputedStyle(document.documentElement).getPropertyValue("--b3-border-color");
item.setAttribute("style", "--b3-av-kanban-border: var(--b3-border-color); --b3-av-kanban-content-hover-bg: var(--b3-av-kanban-border);");
}
item.setAttribute("style", `--b3-av-kanban-border:${selectBg};--b3-av-kanban-bg:${selectBg}29;--b3-av-kanban-content-bg:${selectBg}47;--b3-av-kanban-content-hover-bg:${selectBg}5c;`);
});
});
return;