fix theme switching

pull/2182/head
Tuğçe Küçükoğlu 2022-02-16 10:21:31 +03:00 committed by Tuğçe Küçükoğlu
parent 071afce1f3
commit c3c8c3959d
1 changed files with 17 additions and 20 deletions

View File

@ -49,7 +49,6 @@ export default {
} }
this.newsActive = this.newsActive && sessionStorage.getItem('primevue-news-hidden') == null; this.newsActive = this.newsActive && sessionStorage.getItem('primevue-news-hidden') == null;
this.initTheme();
}, },
watch: { watch: {
$route: { $route: {
@ -69,22 +68,6 @@ export default {
} }
}, },
methods: { methods: {
initTheme() {
let appTheme;
const queryString = window.location.search;
if (queryString)
appTheme = new URLSearchParams(queryString.substring(1)).get('theme');
else
appTheme = localStorage.getItem('primevue-theme');
if (appTheme) {
let darkTheme = this.isDarkTheme(appTheme);
this.changeTheme({
theme: appTheme,
dark: darkTheme
});
}
},
onMenuButtonClick() { onMenuButtonClick() {
if (this.sidebarActive) { if (this.sidebarActive) {
this.sidebarActive = false; this.sidebarActive = false;
@ -105,10 +88,12 @@ export default {
event.stopPropagation(); event.stopPropagation();
}, },
changeTheme(event) { changeTheme(event) {
let themeElement = document.getElementById('theme-link'); let themeLink = document.getElementById('theme-link');
themeElement.setAttribute('href', themeElement.getAttribute('href').replace(this.theme, event.theme)); let href = 'themes/' + event.theme + '/theme.css';
this.theme = event.theme; this.theme = event.theme;
this.replaceLink(themeLink, href);
this.activeMenuIndex = null; this.activeMenuIndex = null;
EventBus.emit('change-theme', event); EventBus.emit('change-theme', event);
@ -117,8 +102,20 @@ export default {
if (event.theme.startsWith('md')) { if (event.theme.startsWith('md')) {
this.$primevue.config.ripple = true; this.$primevue.config.ripple = true;
} }
},
replaceLink(linkElement, href) {
const id = linkElement.getAttribute('id');
const cloneLinkElement = linkElement.cloneNode(true);
localStorage.setItem('primevue-theme', this.theme); cloneLinkElement.setAttribute('href', href);
cloneLinkElement.setAttribute('id', id + '-clone');
linkElement.parentNode.insertBefore(cloneLinkElement, linkElement.nextSibling);
cloneLinkElement.addEventListener('load', () => {
linkElement.remove();
cloneLinkElement.setAttribute('id', id);
});
}, },
addClass(element, className) { addClass(element, className) {
if (!this.hasClass(element, className)) { if (!this.hasClass(element, className)) {