Layout

Layout is controlled by LayoutService.

Open layout.service.ts file and find setAppLayout() method definition. Change the options in layoutConf as your need.

Options

navigationPos: "side"(For side/verticle navigation) or "top"(For top/horizontal navigation)

sidebarStyle: "full" or "compact" or "closed" (Default state of sidebar. Only works when navigationPos is "side")

sidebarColor: Background color for left sidebar (e.g. black). View colors

dir: "ltr" or "rtl" (Document direction)

useBreadcrumb: true or false (Show/Hide breadcrumb)

breadcrumb: "simple"(Displays simple breadcrumb) or "title" (Displays breadcurmb with title)

topbarFixed: true or false (true makes topbar fixed, Only works when navigationPos is "side", because topbar for top navigation is always fixed)

topbarColor: Background color for Topbar (e.g. white). View colors

Available Colors
  • White
  • Black
  • gray
  • dark-gray
  • slate-gray
  • dark-purple
  • dark-blue
  • blue
  • indigo
  • yellow
  • green
  • red
  • orange
  • pink

NB: You can add new color variable in "src/assets/styles/scss/_colors.scss". Then you will be able to apply that color in layout options.