Theme Configuration

The theme values are of string type and can be configured as follows:

• To get the default value of direction, theme color go to src/store/setting/state.js

Theme Scheme Direction

• Property: "theme_scheme_direction"
• Choices: 'ltr' (left-to-right), 'rtl' (right-to-left)

Example

"theme_scheme_direction": {
    "value": "ltr"
},  

Theme Color

To change theme style appearance go to nuxt.config.ts

• Property: "theme_style_appearance"
• Choices: "dark", "hotstar", "amazonprime", "hulu"

Example

thtmlAttrs: {
        'data-bs-theme': 'hotstar',
        'style': '--header-height: 74px'
}  

To get the current value of the following you can use:

• import this file as top of your component using following example code in your component

import { useSetting } from "../../store/setting/index";

Then use the following code in your component to get the current value

• For accessing the state from the useSetting store.

const store = useSetting();

• For creating computed properties to reactively access the store's state.

theme_scheme_direction

const rtl = computed(() => store.theme_scheme_direction_value);