egirlskey/packages/frontend/src/directives/panel.ts

30 lines
831 B
TypeScript
Raw Normal View History

/*
* SPDX-FileCopyrightText: syuilo and other misskey contributors
* SPDX-License-Identifier: AGPL-3.0-only
*/
2021-11-28 11:07:37 +00:00
import { Directive } from 'vue';
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 {
2021-12-25 16:42:50 +00:00
return el.parentElement ? getBgColor(el.parentElement) : 'transparent';
2021-11-28 11:07:37 +00:00
}
};
2021-11-28 11:07:37 +00:00
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;