mirror of https://github.com/OpenVidu/openvidu.git
ov-components: load predefined themes dynamically in ThemeSelectorComponent
parent
7071385e22
commit
0cdb46a79c
|
@ -42,9 +42,13 @@ import { OpenViduThemeMode } from '../../../models/theme.model';
|
|||
styleUrl: './theme-selector.component.scss'
|
||||
})
|
||||
export class ThemeSelectorComponent {
|
||||
protected predefinedThemes: OpenViduThemeMode[] = Object.values(OpenViduThemeMode);
|
||||
protected predefinedThemes: OpenViduThemeMode[] = [];
|
||||
constructor(private themeService: OpenViduThemeService) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.predefinedThemes = this.themeService.getAllThemes();
|
||||
}
|
||||
|
||||
get currentTheme() {
|
||||
return this.themeService.getCurrentTheme();
|
||||
}
|
||||
|
|
|
@ -101,7 +101,12 @@ export const OPENVIDU_COMPONENTS_LIGHT_THEME: OpenViduThemeVariables = {
|
|||
'--ov-border-focus-color': '#4285f4',
|
||||
'--ov-activity-status-color': '#c8cdd6',
|
||||
'--ov-broadcasting-color': '#8837f1',
|
||||
'--ov-video-background': '#000000'
|
||||
'--ov-video-background': '#000000',
|
||||
|
||||
'--ov-toolbar-buttons-radius': '50%',
|
||||
'--ov-leave-button-radius': '10px',
|
||||
'--ov-video-radius': '5px',
|
||||
'--ov-surface-radius': '5px'
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -134,5 +139,10 @@ export const OPENVIDU_COMPONENTS_DARK_THEME: OpenViduThemeVariables = {
|
|||
'--ov-border-focus-color': '#5294ff',
|
||||
'--ov-activity-status-color': '#c8cdd6ff',
|
||||
'--ov-broadcasting-color': '#9d5af3ff',
|
||||
'--ov-video-background': '#000000'
|
||||
'--ov-video-background': '#000000',
|
||||
|
||||
'--ov-toolbar-buttons-radius': '50%',
|
||||
'--ov-leave-button-radius': '10px',
|
||||
'--ov-video-radius': '5px',
|
||||
'--ov-surface-radius': '5px'
|
||||
};
|
||||
|
|
|
@ -50,6 +50,10 @@ export class OpenViduThemeService {
|
|||
this.currentThemeSubject.next(initialTheme);
|
||||
}
|
||||
|
||||
getAllThemes(): OpenViduThemeMode[] {
|
||||
return Object.values(OpenViduThemeMode);
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets the current theme mode
|
||||
*/
|
||||
|
|
Loading…
Reference in New Issue