Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
43 lines (33 sloc) 1.17 KB
import {Component, h, State} from '@stencil/core';
import {take} from 'rxjs/operators';
import {ThemeService} from '../../../services/theme/theme.service';
@Component({
tag: 'app-general-settings'
})
export class AppGeneralSettings {
private themeService: ThemeService;
constructor() {
this.themeService = ThemeService.getInstance();
}
componentWillLoad() {
this.themeService.watch().pipe(take(1)).subscribe((dark: boolean) => {
this.darkTheme = dark;
});
}
async toggleTheme() {
this.darkTheme = !this.darkTheme;
await this.themeService.switch(this.darkTheme);
}
@State()
private darkTheme: boolean;
render() {
return [
<h1 class="ion-padding-top">Settings</h1>,
<ion-list class="ion-padding-top ion-padding-bottom">
<ion-item>
<ion-label>{this.darkTheme ? 'Dark' : 'Light'} theme {this.darkTheme ? '🌑' : '☀️'}</ion-label>
<ion-toggle slot="end" checked={this.darkTheme} mode="md" color="switcher" onIonChange={() => this.toggleTheme()}></ion-toggle>
</ion-item>
</ion-list>];
}
}
You can’t perform that action at this time.