vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Sync table theme with dark/light mode

pull/2207/head
Cagatay Civici 2022-02-24 00:19:22 +03:00
parent eb5f453b24
commit 843320f519
1 changed files with 17 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/Home.vue
View File

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