Themes

Vuely comes with interactive themes. You can select any one of them according to your needs. In this section you will get detailed documentation on the usage of these themes.

Vuely have 6 predefined themes which you can see under the src->themes folder:

-themes
 --accentTheme.js            // Accent theme
 --dangerTheme.js            // Danger theme
 --infoTheme.js              // Info theme
 --primaryTheme.js           // Primary theme
 --successTheme.js           // Success theme
 --warningTheme.js           // Warning theme

There is a number assigned to each & every theme in the vuely. You can use this number to update the theme settings of your template. Check about the number assigned to particular theme in the given table:

Theme Name	Number Assigned
Primary Theme	0
Warning Theme	1
Success Theme	2
Danger Theme	3
Info Theme	4
Accent Theme	5

Open src->store->modules->settings->index.js file to update the theme settings of your project. Search for the selectedTheme key and update the value to theme[Number_Assigned_To_Selected_Theme]

For Example:

index.js

const state = {
  ...
  selectedTheme: themes[3],// for danger theme, like wise themes[0] for Primary Theme
  ...
}