ModelHandle/website/o3dv/js/themehandler.js
2021-09-01 06:45:28 +02:00

49 lines
1.8 KiB
JavaScript

OV.ThemeHandler = class {
constructor () {
this.css = {
'--ov_foreground_color': {},
'--ov_background_color': {},
'--ov_button_color': {},
'--ov_button_hover_color': {},
'--ov_button_text_color': {},
'--ov_outline_button_color': {},
'--ov_outline_button_hover_color': {},
'--ov_outline_button_text_color': {},
'--ov_icon_color': {},
'--ov_hover_color': {},
'--ov_light_icon_color': {},
'--ov_logo_text_color': {},
'--ov_logo_border_color': {},
'--ov_toolbar_background_color': {},
'--ov_toolbar_selected_color': {},
'--ov_toolbar_separator_color': {},
'--ov_treeview_selected_color': {},
'--ov_dialog_foreground_color': {},
'--ov_dialog_background_color': {},
'--ov_border_color': {},
'--ov_shadow': {}
};
let root = document.querySelector (':root');
let style = window.getComputedStyle (root);
for (let property in this.css) {
if (Object.prototype.hasOwnProperty.call (this.css, property)) {
this.css[property].light = style.getPropertyValue (property);
this.css[property].dark = style.getPropertyValue (property + '_dark');
}
}
}
SwitchTheme (name)
{
let root = document.querySelector (':root');
for (let property in this.css) {
if (Object.prototype.hasOwnProperty.call (this.css, property)) {
let value = this.css[property][name];
if (value !== undefined) {
root.style.setProperty (property, value);
}
}
}
}
};