Sync table theme with dark/light mode
parent
eb5f453b24
commit
843320f519
27
src/Home.vue
27
src/Home.vue
|
@ -49,6 +49,8 @@ export default {
|
||||||
expire.setTime(today.getTime() + 3600000*24*7);
|
expire.setTime(today.getTime() + 3600000*24*7);
|
||||||
document.cookie = 'primeaffiliateid=' + afId + ';expires=' + expire.toUTCString() + ';path=/; domain:primefaces.org';
|
document.cookie = 'primeaffiliateid=' + afId + ';expires=' + expire.toUTCString() + ';path=/; domain:primefaces.org';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.replaceTableTheme(this.$appState.darkTheme ? 'lara-dark-indigo': 'lara-light-indigo');
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
onThemeToggle() {
|
onThemeToggle() {
|
||||||
|
@ -64,18 +66,23 @@ export default {
|
||||||
replaceTableTheme(newTheme) {
|
replaceTableTheme(newTheme) {
|
||||||
const elementId = 'home-table-link';
|
const elementId = 'home-table-link';
|
||||||
const linkElement = document.getElementById(elementId);
|
const linkElement = document.getElementById(elementId);
|
||||||
const cloneLinkElement = linkElement.cloneNode(true);
|
const tableThemeTokens = linkElement.getAttribute('href').split('/');
|
||||||
const newThemeUrl = linkElement.getAttribute('href').replace(this.tableTheme, newTheme);
|
const currentTableTheme = tableThemeTokens[tableThemeTokens.length - 2];
|
||||||
|
|
||||||
|
if (currentTableTheme !== newTheme) {
|
||||||
|
const newThemeUrl = linkElement.getAttribute('href').replace(currentTableTheme, newTheme);
|
||||||
|
|
||||||
cloneLinkElement.setAttribute('id', elementId + '-clone');
|
const cloneLinkElement = linkElement.cloneNode(true);
|
||||||
cloneLinkElement.setAttribute('href', newThemeUrl);
|
cloneLinkElement.setAttribute('id', elementId + '-clone');
|
||||||
cloneLinkElement.addEventListener('load', () => {
|
cloneLinkElement.setAttribute('href', newThemeUrl);
|
||||||
linkElement.remove();
|
cloneLinkElement.addEventListener('load', () => {
|
||||||
cloneLinkElement.setAttribute('id', elementId);
|
linkElement.remove();
|
||||||
});
|
cloneLinkElement.setAttribute('id', elementId);
|
||||||
linkElement.parentNode.insertBefore(cloneLinkElement, linkElement.nextSibling);
|
});
|
||||||
|
linkElement.parentNode.insertBefore(cloneLinkElement, linkElement.nextSibling);
|
||||||
|
|
||||||
this.tableTheme = newTheme;
|
this.tableTheme = newTheme;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|
Loading…
Reference in New Issue