nebular switcher-background-percentage code example

Example: nebular switcher-background-percentage

$nb-enabled-themes: (default);

$nb-themes: nb-register-theme((
  calendar-active-item-bg: #FFDB06,
  calendar-selected-item-bg: #FFDB06,
  checkbox-checked-border-color: #FFDB06,
  color-fg-highlight: #FFDB06,
  color-primary: #FFDB06,
  context-menu-active-bg: #FFDB06,
  context-menu-border: #FFDB06,
  form-control-selected-border-color: #FFDB06,
  link-color-hover: #a4abb3,
  link-color:	#FFDB06,
  menu-submenu-active-border-color: #FFDB06,
  popover-border: #FFDB06,
  radio-checked-border-color: #FFDB06,
  radio-checked-checkmark: #FFDB06,
  route-tabs-selected: #FFDB06,
  smart-table-paging-bg-active: #FFDB06,
  tabs-selected: #FFDB06,
  form-control-border-width: 1px,
  stepper-step-padding: 1em,
  btn-hero-primary-degree: 3deg,
  btn-fg: #424242,
// app wise variables for each theme
  sidebar-header-gap: 2rem,
  sidebar-header-height: initial,
  layout-content-width: 1400px,

  font-main: Roboto,
  font-secondary: Exo,

  switcher-background: #ebeff5,
  switcher-background-percentage: 50%,
  drops-icon-line-gadient: -webkit-linear-gradient(#FFDB06, #FFDB06),

  list-item-border-width: 1px,

  slide-out-container-width: 30%,
  slide-out-background: linear-gradient(270deg, #f7fafb 0%, #ecf2f5 100%),
  slide-out-shadow-color: 0 4px 14px 0 #a2d2c8,
  slide-out-shadow-color-rtl: 0 4px 14px 0 #a2d2c8,

  chart-panel-summary-box-shadow: none,
  chart-panel-summary-background-color: #ecf2f5,
  chart-panel-summary-border-color: #ebeff1,
  chart-panel-summary-border-width: 1px,

  ecommerce-card-border-width: 1px,

  progress-bar-background: linear-gradient(90deg, #FFDB06 0%, #FFDB06 100%),
), default, default);

Tags:

Misc Example