Мат-меню теряет дизайн на странице перезагрузки - PullRequest
Новая
       15

Мат-меню теряет дизайн на странице перезагрузки

0 голосов
/ 18 февраля 2019

Если я хочу перезагрузить страницу, mat-menu rerectively mat-menu-item теряет свой дизайн.Но не на кнопке «Панель приборов».Кроме того, когда я нажимаю кнопку «Панель инструментов» после перезагрузки, она возвращает дизайн.

это мой HTML: 

<mat-drawer-container fullscreen class="sidenav-container" [hasBackdrop]="this.mobileChecker.checkIfMobile()"
 (window:resize)="onResize($event)" style="background: grey">
<mat-drawer #drawer [mode]="this.mobileChecker.checkIfMobile() ? 'over' : 'side'">
<!-- <button mat-menu-item class="sideNavButton">
  <mat-icon>
    <i class="material-icons">perm_identity</i>
  </mat-icon>
  {{ "APP_COMPONENT.menu.login" | translate}}
</button> -->
<div mat-menu-item>
  <mat-icon>
    <i class="material-icons">storage</i>
  </mat-icon>
  <app-project-selection [mode]="'Menu'"></app-project-selection>
</div>
<button mat-menu-item class="sideNavButton" (click)="clickDashboard()">
  <mat-icon>
    <i class="material-icons">dashboard</i>
  </mat-icon>
  {{ "APP_COMPONENT.menu.dashboard" | translate}}
</button>
<button mat-menu-item class="sideNavButton" (click)="clickNewProt()">
  <mat-icon>
    <i class="material-icons">list_alt</i>
  </mat-icon>
  {{ "APP_COMPONENT.menu.protocolWizzard" | translate}}
</button>
<button mat-menu-item class="sideNavButton" (click)="clickEditTasks()">
  <mat-icon>
    <i class="material-icons">border_color</i>
  </mat-icon>
  {{ "APP_COMPONENT.menu.taskUpdater" | translate}}
</button>
<button mat-menu-item *ngIf="isAdminButtonShown()" class="sideNavButton" (click)="clickLevelEditor()">
  <mat-icon>
    <i class="material-icons">border_color</i>
  </mat-icon>
  {{ "APP_COMPONENT.menu.levelFamily" | translate}}
</button>
<button mat-menu-item *ngIf="isAdminButtonShown()" class="sideNavButton" (click)="clickAdminEditor()">
  <mat-icon>
    <i class="material-icons">border_color</i>
  </mat-icon>
  Administration
</button>
<div class="inner-content" style="left: 15px">
  <mat-icon>
    <i class="material-icons">
      language
    </i>
  </mat-icon>
  <mat-button-toggle-group [(ngModel)]="this.language" style="margin-left: 15px; bottom: 8px" name="fontStyle" aria-label="Font Style"
    (valueChange)="languageChanged($event)">
    <mat-button-toggle style="color: black" value="en">EN</mat-button-toggle>
    <mat-button-toggle style="color: black" value="ger">DE</mat-button-toggle>
  </mat-button-toggle-group>
</div>
<!--<button mat-menu-item class="sideNavButton" (click)="clickProtEditor()">
  <mat-icon>
    <i class="material-icons">border_color</i>
  </mat-icon>
  Protocol Editor
</button>!-->

это мой css:

  .sideNavButton{
  background-color: #ffffff;
  width: 100%;
  }

это должно выглядеть так:

mat-menu design

и после перезагрузки страницы это выглядит так:

mat-menu design-error

Что нужно изменить, чтобы дизайн остался?

...