33 lines
889 B
TypeScript
33 lines
889 B
TypeScript
|
import { Component } from "preact";
|
||
|
|
import { settings } from "./globalSettings";
|
||
|
|
|
||
|
|
// @ts-ignore
|
||
|
|
import style_dark from "./scss/main-dark.scss" assert {type: "css"};
|
||
|
|
// @ts-ignore
|
||
|
|
import style_light from "./scss/main-light.scss" assert {type: "css"};
|
||
|
|
|
||
|
|
export const default_theme = "dark";
|
||
|
|
|
||
|
|
const themes: { [key: string]: string } = {
|
||
|
|
"dark": style_dark,
|
||
|
|
"light": style_light,
|
||
|
|
}
|
||
|
|
|
||
|
|
export class ThemeLoader extends Component<{}, { sheet: string }> {
|
||
|
|
componentDidMount() {
|
||
|
|
this.setCorrectStyle(settings.theme);
|
||
|
|
settings.registerListener((key: string) => {
|
||
|
|
if (key != "theme") return;
|
||
|
|
this.setCorrectStyle(settings.theme);
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
setCorrectStyle(theme: string) {
|
||
|
|
this.setState({ sheet: themes[theme] })
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
if (!this.state.sheet) return;
|
||
|
|
return <style>{this.state.sheet}</style>
|
||
|
|
}
|
||
|
|
}
|