Layout Settings
For theme or layout related settins changes, you have to just change in one file
settings.ts. You can find config file in
core/modules folder.
Note: we store theme related data in localstorage in browser,
so whenever you chagne in config file please clear your browser data first.
export interface AppSettings {
navPos: 'side' | 'top';
dir: 'ltr' | 'rtl';
theme: 'light' | 'dark';
color: 'purple' | 'red' | 'teal' | 'orange' | 'amber' | 'green' | 'default';
showHeader: boolean;
headerPos: 'fixed' | 'static' | 'above';
showFooter: boolean;
footerPos: 'fixed' | 'static';
showUserPanel: boolean;
sidenavOpened: boolean;
sidenavCollapsed: boolean;
language: string;
}
export const defaults: AppSettings = {
navPos: 'side',
dir: 'ltr',
theme: 'light',
color: 'default',
showHeader: true,
headerPos: 'fixed',
showFooter: true,
footerPos: 'static',
showUserPanel: true,
sidenavOpened: true,
sidenavCollapsed: false,
language: 'en-US',
};
| Options | Description |
|---|---|
navPos |
For navbar position, set it to side, for set menu in left side
or in RTL set to to right side, and top for set menu postion to
top.
|
dir |
For RTL layout set it to rtl, for LTR layout set it to
ltr.
|
theme |
For use light template layout value is light & for dark
template use
darkin value.
|
color |
You have multiple theme color options, you can chose any theme color from
purple, red, teal, orange, amber, green, default.
|
showHeader |
boolean value true or false for show or hide
header
|
headerPos |
You can choose header postion between three options
fixed, static, above
|
showFooter |
boolean value true or false for show or hide
footer
|
footerPos |
You can choose footer postion between two options
fixed, static
|
sidenavOpened |
boolean value true or false for show or hide
Sidenav
|
sidenavCollapsed |
boolean value true or false for collapse or not
Sidenav
|
language |
Set language for template, here en-US for english language. You can choose any one from en-US for English, de-DE for German and es-ES for Spanish. |