85042: Make AdminSidebarComponent themeable

This commit is contained in:
Yura Bondarenko
2021-11-23 15:38:34 +01:00
parent 816af086a4
commit d982fe59b4
4 changed files with 33 additions and 6 deletions

View File

@@ -62,11 +62,11 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
constructor(protected menuService: MenuService, constructor(protected menuService: MenuService,
protected injector: Injector, protected injector: Injector,
private variableService: CSSVariableService, protected variableService: CSSVariableService,
private authService: AuthService, protected authService: AuthService,
private modalService: NgbModal, protected modalService: NgbModal,
private authorizationService: AuthorizationDataService, protected authorizationService: AuthorizationDataService,
private scriptDataService: ScriptDataService, protected scriptDataService: ScriptDataService,
) { ) {
super(menuService, injector); super(menuService, injector);
} }

View File

@@ -0,0 +1,25 @@
import { Component } from '@angular/core';
import { ThemedComponent } from '../../shared/theme-support/themed.component';
import { AdminSidebarComponent } from './admin-sidebar.component';
/**
* Themed wrapper for AdminSidebarComponent
*/
@Component({
selector: 'ds-themed-admin-sidebar',
styleUrls: [],
templateUrl: '../../shared/theme-support/themed.component.html',
})
export class ThemedAdminSidebarComponent extends ThemedComponent<AdminSidebarComponent> {
protected getComponentName(): string {
return 'AdminSidebarComponent';
}
protected importThemedComponent(themeName: string): Promise<any> {
return import(`../../../themes/${themeName}/app/admin/admin-sidebar/admin-sidebar.component`);
}
protected importUnthemedComponent(): Promise<any> {
return import('./admin-sidebar.component');
}
}

View File

@@ -52,6 +52,7 @@ import { IdleModalComponent } from './shared/idle-modal/idle-modal.component';
import { UUIDService } from './core/shared/uuid.service'; import { UUIDService } from './core/shared/uuid.service';
import { CookieService } from './core/services/cookie.service'; import { CookieService } from './core/services/cookie.service';
import { ThemedAdminSidebarComponent } from './admin/admin-sidebar/themed-admin-sidebar.component';
export function getBase() { export function getBase() {
return environment.ui.nameSpace; return environment.ui.nameSpace;
@@ -158,6 +159,7 @@ const DECLARATIONS = [
HeaderNavbarWrapperComponent, HeaderNavbarWrapperComponent,
ThemedHeaderNavbarWrapperComponent, ThemedHeaderNavbarWrapperComponent,
AdminSidebarComponent, AdminSidebarComponent,
ThemedAdminSidebarComponent,
AdminSidebarSectionComponent, AdminSidebarSectionComponent,
ExpandableAdminSidebarSectionComponent, ExpandableAdminSidebarSectionComponent,
FooterComponent, FooterComponent,

View File

@@ -1,5 +1,5 @@
<div class="outer-wrapper" *ngIf="!shouldShowFullscreenLoader; else fullScreenLoader"> <div class="outer-wrapper" *ngIf="!shouldShowFullscreenLoader; else fullScreenLoader">
<ds-admin-sidebar></ds-admin-sidebar> <ds-themed-admin-sidebar></ds-themed-admin-sidebar>
<div class="inner-wrapper" [@slideSidebarPadding]="{ <div class="inner-wrapper" [@slideSidebarPadding]="{
value: (!(sidebarVisible | async) ? 'hidden' : (slideSidebarOver | async) ? 'shown' : 'expanded'), value: (!(sidebarVisible | async) ? 'hidden' : (slideSidebarOver | async) ? 'shown' : 'expanded'),
params: {collapsedSidebarWidth: (collapsedSidebarWidth | async), totalSidebarWidth: (totalSidebarWidth | async)} params: {collapsedSidebarWidth: (collapsedSidebarWidth | async), totalSidebarWidth: (totalSidebarWidth | async)}