<div class="wrapper"> <div class="sidebar"><app-sidebar></app-sidebar></div> <div class="main-panel"> <app-navbar></app-navbar> <router-outlet></router-outlet> <app-footer></app-footer> </div> </div> <div class=" fixed-plugin"> <div class=" show-dropdown" ngbDropdown> <a data-toggle="dropdown" ngbDropdownToggle> <i class=" fa fa-cog fa-2x"> </i> </a> <ul ngbDropdownMenu> <li class=" header-title">Sidebar Background</li> <li class=" adjustments-line"> <a class=" switch-trigger background-color" href="javascript:void(0)"> <div class=" badge-colors text-center"> <span class=" badge filter badge-danger" [ngClass]="{'active':sidebarColor==='red'}" (click)="changeSidebarColor('red')" > </span> <span class=" badge filter badge-primary" [ngClass]="{'active':sidebarColor==='primary'}" (click)="changeSidebarColor('primary')" > </span> <span class=" badge filter badge-info" [ngClass]="{'active':sidebarColor==='blue'}" (click)="changeSidebarColor('blue')"> </span> <span class=" badge filter badge-success" [ngClass]="{'active':sidebarColor==='green'}" (click)="changeSidebarColor('green')"> </span> </div> <div class=" clearfix"></div> </a> </li> <li class=" adjustments-line text-center color-change"> <span class=" color-label"> LIGHT MODE </span> <span class=" badge light-badge mr-2" (click)="changeDashboardColor('white-content')"> </span> <span class=" badge dark-badge ml-2" (click)="changeDashboardColor('black-content')"> </span> <span class=" color-label"> DARK MODE </span> </li> </ul> </div> </div>