2023-09-04 17:47:24 +09:00
|
|
|
import type { Directive } from "vue";
|
2023-07-20 04:17:05 +09:00
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
mounted(src, binding, vn) {
|
|
|
|
|
const getBgColor = (el: HTMLElement) => {
|
|
|
|
|
const style = window.getComputedStyle(el);
|
|
|
|
|
if (
|
|
|
|
|
style.backgroundColor &&
|
|
|
|
|
!["rgba(0, 0, 0, 0)", "rgba(0,0,0,0)", "transparent"].includes(
|
|
|
|
|
style.backgroundColor,
|
|
|
|
|
)
|
|
|
|
|
) {
|
|
|
|
|
return style.backgroundColor;
|
|
|
|
|
} else {
|
|
|
|
|
return el.parentElement ? getBgColor(el.parentElement) : "transparent";
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const parentBg = getBgColor(src.parentElement);
|
|
|
|
|
|
|
|
|
|
const myBg = getComputedStyle(document.documentElement).getPropertyValue(
|
|
|
|
|
"--panel",
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
if (parentBg === myBg) {
|
|
|
|
|
src.style.backgroundColor = "var(--bg)";
|
|
|
|
|
} else {
|
|
|
|
|
src.style.backgroundColor = "var(--panel)";
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
} as Directive;
|
