Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-16 14:40:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

🎨 https://github.com/siyuan-note/siyuan/issues/8873

Browse source
This commit is contained in:
Vanessa 2025-11-03 23:41:35 +08:00
parent 4b820dd4a1
commit 8ae922cd15
4 changed files with 38 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

22
app/src/assets/scss/business/_av.scss
View file

@ -981,6 +981,9 @@
&-group {
width: 260px;
padding: 8px;
border-radius: var(--b3-border-radius);
background-color: var(--b3-av-kanban-bg);
&--small {
width: 180px;
@ -989,6 +992,25 @@
&--big {
width: 320px;
}
.av__group-title {
padding-top: 0;
}
.av__gallery-item {
background-color: var(--b3-av-kanban-content-bg);
box-shadow: rgba(0, 0, 0, 0.04) 0 2px 4px 0, var(--b3-av-kanban-border) 0 0 0 1px;
&:hover .av__gallery-fields,
&:hover .av__gallery-cover {
background-color: var(--b3-av-kanban-content-hover-bg);
}
}
.av__gallery-cover {
background-color: var(--b3-av-kanban-content-bg);
border-bottom: 1px solid var(--b3-av-kanban-border);
}
}
}
}

8
app/src/protyle/render/av/gallery/render.ts
View file

@ -438,10 +438,14 @@ export const renderKanban = async (options: {
return;
}
const view: IAVGallery = data.view as IAVGallery;
let bodyHTML = ""
let bodyHTML = "";
view.groups.forEach((group: IAVGallery) => {
if (group.groupHidden === 0) {
bodyHTML += `<div class="av__kanban-group">
let selectBg;
if (["mSelect", "select"].includes(group.groupValue.type)) {
selectBg = getComputedStyle(document.documentElement).getPropertyValue(`--b3-font-background${group.groupValue.mSelect[0].color}`);
}
bodyHTML += `<div class="av__kanban-group" 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;">
${getGroupTitleHTML(group, group.cards.length)}
<div data-group-id="${group.id}" data-page-size="${group.pageSize}" data-dtype="${group.groupKey.type}" data-content="${Lute.EscapeHTMLStr(group.groupValue.text?.content)}" class="av__body${group.groupFolded ? " fn__none" : ""}">${getGalleryHTML(group)}</div>
</div>`;

8
app/src/protyle/render/av/layout.ts
View file

@ -97,13 +97,7 @@ export const getLayoutHTML = (data: IAV) => {
<input data-type="toggle-entries-wrap" type="checkbox" class="b3-switch b3-switch--menu" ${view.wrapField ? "checked" : ""}>
</label>`;
if (data.viewType === "kanban") {
html += `<button class="b3-menu__item" data-type="set-kanban-group">
<span class="fn__flex-center">${window.siyuan.languages.groups}</span>
<span class="fn__flex-1"></span>
<span class="b3-menu__accelerator">${view.cardSize === 0 ? window.siyuan.languages.small : (view.cardSize === 1 ? window.siyuan.languages.medium : window.siyuan.languages.large)}</span>
<svg class="b3-menu__icon b3-menu__icon--small"><use xlink:href="#iconRight"></use></svg>
</button>
<label class="b3-menu__item">
html += `<label class="b3-menu__item">
<span class="fn__flex-center">${window.siyuan.languages.useBackground}</span>
<span class="fn__space fn__flex-1"></span>
<input data-type="toggle-kanban-bg" type="checkbox" class="b3-switch b3-switch--menu" ${view.displayFieldName ? "checked" : ""}>

10
app/src/util/assets.ts
View file

@ -23,7 +23,6 @@ export const loadAssets = (data: Config.IAppearance) => {
fetchPost("/api/system/setAppearanceMode", {mode: OSTheme === "light" ? 0 : 1});
window.siyuan.config.appearance.mode = (OSTheme === "light" ? 0 : 1);
}
const defaultStyleElement = document.getElementById("themeDefaultStyle");
const defaultThemeAddress = `/appearance/themes/${data.mode === 1 ? "midnight" : "daylight"}/theme.css?v=${Constants.SIYUAN_VERSION}`;
if (defaultStyleElement) {
@ -57,6 +56,15 @@ export const loadAssets = (data: Config.IAppearance) => {
styleElement.remove();
}
/// #if !MOBILE
setTimeout(() => {
document.querySelectorAll(".av__kanban-group").forEach(item => {
const nameElement = item.querySelector(".av__group-title .b3-chip") as HTMLElement;
if (nameElement) {
const selectBg = getComputedStyle(document.documentElement).getPropertyValue(`--b3-font-background${nameElement.style.backgroundColor.slice(-2, -1)}`);
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;`);
}
});
}, Constants.TIMEOUT_TRANSITION);
getAllModels().graph.forEach(item => {
item.searchGraph(false);
});