⚙️Theme Settings

Manage the theme settings for Horizontal, Dark, and Box layout options.

Theme settings lie under config.ts file.

How to Set Default Settings?

// Config.ts
const config: ConfigProps = {
  sidebarDrawer: true,
  customizerDrawer: false,
  miniSidebar: false,
  isHorizontalLayout: false, // Horizontal layout
  actTheme: 'light',
  fontTheme: 'Inter-var',
  inputBg: false,
  themeContrast: false,
  boxed: false,
  isRtl: false,
}

How to Set Dark Theme?

// Config.ts
const config: ConfigProps = {
  sidebarDrawer: true,
  customizerDrawer: false,
  miniSidebar: false,
  isHorizontalLayout: false,
  actTheme: 'dark', // Set dark for Dark theme
  fontTheme: 'Inter-var',
  inputBg: false,
  themeContrast: false,
  boxed: false,
  isRtl: false,
}

How to Set Horizontal Layout?

// Config.ts
const config: ConfigProps = {
  sidebarDrawer: true,
  customizerDrawer: false,
  miniSidebar: false,
  isHorizontalLayout: true, // Change horizontal layout
  actTheme: 'light',
  fontTheme: 'Inter-var',
  inputBg: false,
  themeContrast: false,
  boxed: false,
  isRtl: false,
}

How to Change Contrast?

// Config.ts
const config: ConfigProps = {
  sidebarDrawer: true,
  customizerDrawer: false,
  miniSidebar: false,
  isHorizontalLayout: false, // Horizontal layout
  actTheme: 'light',
  fontTheme: 'Inter-var',
  inputBg: false,
  themeContrast: true, // Set to true value
  boxed: false,
  isRtl: false,
}

How to Set Boxed Layout?

// Config.ts
const config: ConfigProps = {
  sidebarDrawer: true,
  customizerDrawer: false,
  miniSidebar: false,
  isHorizontalLayout: false, // Horizontal layout
  actTheme: 'light',
  fontTheme: 'Inter-var',
  inputBg: false,
  themeContrast: false,
  boxed: true, // Set True here
  isRtl: false,
}

How to Change Input Text Background?

// Config.ts
const config: ConfigProps = {
  sidebarDrawer: true,
  customizerDrawer: false,
  miniSidebar: false,
  isHorizontalLayout: false, // Horizontal layout
  actTheme: 'light',
  fontTheme: 'Inter-var',
  inputBg: true, // Set True here
  themeContrast: false,
  boxed: false,
  isRtl: false,
}