diff --git a/app/appearance/themes/daylight/theme.css b/app/appearance/themes/daylight/theme.css index 49335ba5c..4904eca6a 100644 --- a/app/appearance/themes/daylight/theme.css +++ b/app/appearance/themes/daylight/theme.css @@ -207,11 +207,14 @@ /* 表格 */ --b3-table-even-background: rgba(0, 0, 0, .02); - /* 潜入块 */ - --b3-embed-background: var(--b3-table-even-background); + /* 嵌入块 */ + --b3-embed-background: transparent; /* 引述块 */ - --b3-bq-background: var(--b3-table-even-background); + --b3-bq-background: transparent; + + /* 父块颜色 */ + --b3-parent-background: var(--b3-theme-background); } :lang(ja_JP):root { diff --git a/app/appearance/themes/midnight/theme.css b/app/appearance/themes/midnight/theme.css index 5a07697c0..399335a0d 100644 --- a/app/appearance/themes/midnight/theme.css +++ b/app/appearance/themes/midnight/theme.css @@ -206,11 +206,14 @@ /* 表格 */ --b3-table-even-background: rgba(255, 255, 255, .03); - /* 潜入块 */ - --b3-embed-background: var(--b3-table-even-background); + /* 嵌入块 */ + --b3-embed-background: transparent; /* 引述块 */ - --b3-bq-background: var(--b3-table-even-background); + --b3-bq-background: transparent; + + /* 父块颜色 */ + --b3-parent-background: var(--b3-theme-background); } :lang(ja_JP):root { diff --git a/app/src/assets/scss/business/_av.scss b/app/src/assets/scss/business/_av.scss index 2185294cf..96a146396 100644 --- a/app/src/assets/scss/business/_av.scss +++ b/app/src/assets/scss/business/_av.scss @@ -99,7 +99,7 @@ bottom: 0; height: 26px; padding: 0 5px; - background-color: var(--av-background); + background-color: var(--b3-parent-background); font-size: 87.5%; } @@ -162,7 +162,7 @@ &--header, &--footer { - background-color: var(--av-background); + background-color: var(--b3-parent-background); } &--footer { @@ -178,7 +178,7 @@ } .av__colsticky { - background-color: var(--av-background); // 保证盯住时无计算结果的列不被覆盖 + background-color: var(--b3-parent-background); // 保证盯住时无计算结果的列不被覆盖 } .av__calc { @@ -437,7 +437,7 @@ &.av__firstcol, & > div:not(.av__cell--select):not(.av__cell--active):not(.av__calc--ashow) { - background-color: var(--av-background); + background-color: var(--b3-parent-background); } } diff --git a/app/src/assets/scss/protyle/_protyle.scss b/app/src/assets/scss/protyle/_protyle.scss index bc05f1ba3..0bab0877f 100644 --- a/app/src/assets/scss/protyle/_protyle.scss +++ b/app/src/assets/scss/protyle/_protyle.scss @@ -441,5 +441,6 @@ table[contenteditable="true"] + .protyle-action__table { background: var(--b3-theme-primary-lightest); position: relative; transition: var(--b3-transition); + z-index: 3; } } diff --git a/app/src/assets/scss/protyle/_wysiwyg.scss b/app/src/assets/scss/protyle/_wysiwyg.scss index 855740ca2..1b28be00f 100644 --- a/app/src/assets/scss/protyle/_wysiwyg.scss +++ b/app/src/assets/scss/protyle/_wysiwyg.scss @@ -322,7 +322,7 @@ top: 1px; z-index: 2; box-shadow: 0 -1px 0 var(--b3-border-color) inset, 0 -1px 0 0 var(--b3-border-color); - background-color: var(--b3-theme-background); + background-color: var(--b3-parent-background); th { border-top: 0; diff --git a/app/src/protyle/render/av/render.ts b/app/src/protyle/render/av/render.ts index 872d828da..7bc148ce3 100644 --- a/app/src/protyle/render/av/render.ts +++ b/app/src/protyle/render/av/render.ts @@ -207,13 +207,7 @@ ${cell.color ? `color:${cell.color};` : ""}">${renderCell(cell.value, rowIndex)} viewData = item; } }); - let avBackground = "--av-background:var(--b3-theme-background)"; - if (e.style.backgroundColor) { - avBackground = "--av-background:" + e.style.backgroundColor; - } else if (isInEmbedBlock(e)) { - avBackground = "--av-background:var(--b3-theme-surface)"; - } - e.firstElementChild.outerHTML = `
+ e.firstElementChild.outerHTML = `
diff --git a/app/src/protyle/toolbar/Font.ts b/app/src/protyle/toolbar/Font.ts index 050aef50a..d4471239b 100644 --- a/app/src/protyle/toolbar/Font.ts +++ b/app/src/protyle/toolbar/Font.ts @@ -223,16 +223,12 @@ export const fontEvent = (protyle: IProtyle, nodeElements: Element[], type?: str e.style.textShadow = ""; e.style.backgroundColor = ""; e.style.fontSize = ""; - if (e.classList.contains("av")) { - e.querySelector(".av__container").setAttribute("style", "--av-background:var(--b3-theme-background)"); - } + e.style.removeProperty("--b3-parent-background") } else if (type === "style1") { const colorList = color.split(Constants.ZWSP); e.style.backgroundColor = colorList[0]; e.style.color = colorList[1]; - if (e.classList.contains("av")) { - e.querySelector(".av__container").setAttribute("style", `--av-background:${colorList[0]}`); - } + e.style.setProperty('--b3-parent-background', colorList[0]); } else if (type === "style2") { e.style.webkitTextStroke = "0.2px var(--b3-theme-on-background)"; e.style.webkitTextFillColor = "transparent"; @@ -242,9 +238,7 @@ export const fontEvent = (protyle: IProtyle, nodeElements: Element[], type?: str e.style.color = color; } else if (type === "backgroundColor") { e.style.backgroundColor = color; - if (e.classList.contains("av")) { - e.querySelector(".av__container").setAttribute("style", `--av-background:${color}`); - } + e.style.setProperty('--b3-parent-background', color); } else if (type === "fontSize") { e.style.fontSize = color; }