1 import { Injectable } from '@angular/core'
4 export class ThemeService {
5 private theme = document.querySelector('body')
6 private previousTheme = {}
9 // initialise the alternative theme with dark theme colors
10 this.previousTheme['mainBackgroundColor'] = '#111111'
11 this.previousTheme['mainForegroundColor'] = '#fff'
12 this.previousTheme['submenuColor'] = 'rgb(32,32,32)'
13 this.previousTheme['inputColor'] = 'gray'
14 this.previousTheme['inputPlaceholderColor'] = '#fff'
19 this.switchProperty('mainBackgroundColor')
20 this.switchProperty('mainForegroundColor')
21 this.switchProperty('submenuColor')
22 this.switchProperty('inputColor')
23 this.switchProperty('inputPlaceholderColor')
26 private switchProperty (property, newValue?) {
27 const propertyOldvalue = window.getComputedStyle(this.theme).getPropertyValue('--' + property)
28 this.theme.style.setProperty('--' + property, (newValue) ? newValue : this.previousTheme[property])
29 this.previousTheme[property] = propertyOldvalue