diff --git a/src/app/@theme/components/header/header.component.html b/src/app/@theme/components/header/header.component.html index 759c4c88..1f287d0f 100644 --- a/src/app/@theme/components/header/header.component.html +++ b/src/app/@theme/components/header/header.component.html @@ -8,7 +8,7 @@ [matRippleCentered]="true" (click)="toggleSidebar()" > - + diff --git a/src/app/@theme/components/header/header.component.ts b/src/app/@theme/components/header/header.component.ts index a556db90..41f5e940 100644 --- a/src/app/@theme/components/header/header.component.ts +++ b/src/app/@theme/components/header/header.component.ts @@ -4,7 +4,7 @@ import { NbMediaBreakpointsService, NbMenuService, NbSidebarService, NbThemeServ import { UserData } from '../../../@core/data/users'; import { LayoutService } from '../../../@core/utils'; import { map, takeUntil } from 'rxjs/operators'; -import { Subject } from 'rxjs'; +import { Subject, Observable } from 'rxjs'; import { RippleService } from '../../../@core/utils/ripple.service'; @Component({ @@ -15,6 +15,7 @@ import { RippleService } from '../../../@core/utils/ripple.service'; export class HeaderComponent implements OnInit, OnDestroy { private destroy$: Subject = new Subject(); + public readonly materialTheme$: Observable; userPictureOnly: boolean = false; user: any; @@ -49,13 +50,20 @@ export class HeaderComponent implements OnInit, OnDestroy { userMenu = [ { title: 'Profile' }, { title: 'Log out' } ]; - constructor(private sidebarService: NbSidebarService, - private menuService: NbMenuService, - private themeService: NbThemeService, - private userService: UserData, - private layoutService: LayoutService, - private breakpointService: NbMediaBreakpointsService, - private rippleService: RippleService) { + public constructor( + private sidebarService: NbSidebarService, + private menuService: NbMenuService, + private themeService: NbThemeService, + private userService: UserData, + private layoutService: LayoutService, + private breakpointService: NbMediaBreakpointsService, + private rippleService: RippleService, + ) { + this.materialTheme$ = this.themeService.onThemeChange() + .pipe(map(theme => { + const themeName: string = theme?.name || ''; + return themeName.startsWith('material'); + })); } ngOnInit() { diff --git a/src/app/pages/forms/buttons/buttons.component.html b/src/app/pages/forms/buttons/buttons.component.html index 394e9424..a4673f5d 100644 --- a/src/app/pages/forms/buttons/buttons.component.html +++ b/src/app/pages/forms/buttons/buttons.component.html @@ -120,7 +120,7 @@ - + diff --git a/src/app/pages/forms/buttons/buttons.component.ts b/src/app/pages/forms/buttons/buttons.component.ts index adeb3d58..52e8506b 100644 --- a/src/app/pages/forms/buttons/buttons.component.ts +++ b/src/app/pages/forms/buttons/buttons.component.ts @@ -1,30 +1,26 @@ -import { Component, OnInit, OnDestroy } from '@angular/core'; +import { Component } from '@angular/core'; import { NbComponentShape, NbComponentSize, NbComponentStatus, NbThemeService } from '@nebular/theme'; -import { Subscription } from 'rxjs'; +import { Observable } from 'rxjs'; +import { map } from 'rxjs/operators'; @Component({ selector: 'ngx-buttons', styleUrls: ['./buttons.component.scss'], templateUrl: './buttons.component.html', }) -export class ButtonsComponent implements OnInit, OnDestroy { - public constructor(private readonly themeService: NbThemeService) {} +export class ButtonsComponent { + public constructor(private readonly themeService: NbThemeService) { + this.materialTheme$ = this.themeService.onThemeChange() + .pipe(map(theme => { + const themeName: string = theme?.name || ''; + return themeName.startsWith('material'); + })); + } - private readonly subscription: Subscription = new Subscription(); + public readonly materialTheme$: Observable; public readonly statuses: NbComponentStatus[] = [ 'primary', 'success', 'info', 'warning', 'danger' ]; public readonly shapes: NbComponentShape[] = [ 'rectangle', 'semi-round', 'round' ]; public readonly sizes: NbComponentSize[] = [ 'tiny', 'small', 'medium', 'large', 'giant' ]; - public materialThemeActivated: boolean = false; - public ngOnInit(): void { - this.subscription.add(this.themeService.onThemeChange().subscribe(theme => { - const themeName: string = theme?.name || ''; - this.materialThemeActivated = themeName.startsWith('material'); - })); - } - - public ngOnDestroy(): void { - this.subscription.unsubscribe(); - } } diff --git a/src/app/pages/forms/form-inputs/form-inputs.component.html b/src/app/pages/forms/form-inputs/form-inputs.component.html index a17368a9..8b7a71c9 100644 --- a/src/app/pages/forms/form-inputs/form-inputs.component.html +++ b/src/app/pages/forms/form-inputs/form-inputs.component.html @@ -85,7 +85,7 @@ -
+
diff --git a/src/app/pages/forms/form-inputs/form-inputs.component.ts b/src/app/pages/forms/form-inputs/form-inputs.component.ts index 1e720912..5ede35ff 100644 --- a/src/app/pages/forms/form-inputs/form-inputs.component.ts +++ b/src/app/pages/forms/form-inputs/form-inputs.component.ts @@ -1,30 +1,25 @@ -import { Component, OnDestroy, OnInit } from '@angular/core'; +import { Component } from '@angular/core'; import { NbThemeService } from '@nebular/theme'; -import { Subscription } from 'rxjs'; +import { Observable } from 'rxjs'; +import { map } from 'rxjs/operators'; @Component({ selector: 'ngx-form-inputs', styleUrls: ['./form-inputs.component.scss'], templateUrl: './form-inputs.component.html', }) -export class FormInputsComponent implements OnInit, OnDestroy { - public constructor(private readonly themeService: NbThemeService) {} +export class FormInputsComponent { + public constructor(private readonly themeService: NbThemeService) { + this.materialTheme$ = this.themeService.onThemeChange() + .pipe(map(theme => { + const themeName: string = theme?.name || ''; + return themeName.startsWith('material'); + })); + } - private readonly subscription: Subscription = new Subscription(); + public readonly materialTheme$: Observable; - public materialThemeActivated: boolean = false; public starRate: number = 2; public heartRate: number = 4; public radioGroupValue: string = 'This is value 2'; - - public ngOnInit(): void { - this.subscription.add(this.themeService.onThemeChange().subscribe(theme => { - const themeName: string = theme?.name || ''; - this.materialThemeActivated = themeName.startsWith('material'); - })); - } - - public ngOnDestroy(): void { - this.subscription.unsubscribe(); - } }