diff --git a/app.vue b/app.vue
index 68d61bf40..ddae9f249 100644
--- a/app.vue
+++ b/app.vue
@@ -1,11 +1,69 @@
-
-
+
\ No newline at end of file
+ this.themeChangeListener = (event) => {
+ const elementId = 'theme-link';
+ const linkElement = document.getElementById(elementId);
+ const cloneLinkElement = linkElement.cloneNode(true);
+ const newThemeUrl = linkElement.getAttribute('href').replace(this.$appState.theme, event.theme);
+
+ 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.$appState.theme = event.theme;
+ this.$appState.darkTheme = event.dark;
+ };
+
+ EventBus.on('theme-change', this.themeChangeListener);
+ EventBus.on('news-activate', this.newsActivate);
+ },
+ beforeUnmount() {
+ EventBus.off('theme-change', this.themeChangeListener);
+ EventBus.off('news-activate', this.newsActivate);
+ }
+ }
+
\ No newline at end of file
diff --git a/layouts/AppConfigurator.vue b/layouts/AppConfigurator.vue
index 428a8e55c..dce3104ff 100755
--- a/layouts/AppConfigurator.vue
+++ b/layouts/AppConfigurator.vue
@@ -433,7 +433,6 @@ export default {
event.preventDefault();
},
changeTheme(event, theme, dark) {
- debugger
EventBus.emit('theme-change', { theme: theme, dark: dark });
event.preventDefault();
},
diff --git a/layouts/default.vue b/layouts/default.vue
index bb9e383ca..2a19dfd5a 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -37,7 +37,7 @@ export default {
this.$toast.add({severity: 'warn', summary: 'Limited Functionality', detail: 'Although PrimeVue supports IE11, ThemeSwitcher in this application cannot be not fully supported by your browser. Please use a modern browser for the best experience of the showcase.'});
}
},
- watch: {
+/* watch: {
$route: {
immediate: true,
handler(to) {
@@ -55,7 +55,7 @@ export default {
this.$toast.removeAllGroups();
}
}
- },
+ }, */
methods: {
onMenuButtonClick() {
if (this.sidebarActive) {
diff --git a/nuxt.config.js b/nuxt.config.js
index 5b961b6fc..8359f4d90 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -2,8 +2,10 @@ import { defineNuxtConfig } from 'nuxt'
const path = require('path');
// https://v3.nuxtjs.org/api/configuration/nuxt.config
export default defineNuxtConfig({
+ ssr: true,
typescript: false,
components: true,
+
css: [
'@/assets/styles/primevue.css',
'/node_modules/primeflex/primeflex.css',
@@ -11,6 +13,22 @@ export default defineNuxtConfig({
'/node_modules/prismjs/themes/prism-coy.css',
'@/assets/styles/flags.css'
],
+ app: {
+ head: {
+ link: [
+ {
+ id: 'theme-link',
+ rel: 'stylesheet',
+ href: 'themes/lara-light-blue/theme.css'
+ },
+ {
+ id: 'home-table-link',
+ rel: 'stylesheet',
+ href: 'styles/landing/themes/lara-light-blue/theme.css'
+ }
+ ]
+ },
+ },
vite: {
resolve: {
alias: {
diff --git a/pages/index.vue b/pages/index.vue
index ebc442643..936e03125 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -66,7 +66,6 @@ export default {
this.replaceTableTheme(value);
},
replaceTableTheme(newTheme) {
- debugger
const elementId = 'home-table-link';
const linkElement = document.getElementById(elementId);
const tableThemeTokens = linkElement?.getAttribute('href').split('/') || null;
diff --git a/pages/landing/HeroSection.vue b/pages/landing/HeroSection.vue
index 9b37b574d..491749946 100644
--- a/pages/landing/HeroSection.vue
+++ b/pages/landing/HeroSection.vue
@@ -81,10 +81,10 @@
-
+
Get Started
-
+
npm i primevue