add dark mode config

This commit is contained in:
xmcp
2019-08-22 23:30:58 +08:00
parent 29a921cf26
commit 2ddfbe5d3b
2 changed files with 55 additions and 3 deletions

View File

@@ -21,7 +21,7 @@ class App extends Component {
search_text: null,
flow_render_key: +new Date(),
token: localStorage['TOKEN']||null,
darkmode: window.matchMedia('(prefers-color-scheme: dark)').matches,
darkmode: App.is_darkmode(),
};
this.show_sidebar_bound=this.show_sidebar.bind(this);
this.set_mode_bound=this.set_mode.bind(this);
@@ -33,9 +33,9 @@ class App extends Component {
componentDidMount() {
this.update_color_scheme();
window.matchMedia('(prefers-color-scheme: dark)').addListener((e)=>{
window.matchMedia('(prefers-color-scheme: dark)').addListener(()=>{
this.setState({
darkmode: e.matches,
darkmode: App.is_darkmode(),
});
});
}
@@ -45,6 +45,14 @@ class App extends Component {
this.update_color_scheme();
}
static is_darkmode() {
if(window.config.color_scheme==='dark') return true;
if(window.config.color_scheme==='light') return false;
else { // 'default'
return window.matchMedia('(prefers-color-scheme: dark)').matches;
}
}
update_color_scheme() {
if(this.state.darkmode)
document.body.classList.add('root-dark-mode');