Как переопределить поведение отключенного элемента mat-menu с помощью CSS?

Question

Я использую меню угловой материал для создания пользовательского меню. В качестве первой информации я хочу отобразить имя и фамилию пользователя.

Здесь меня интересует поведение отключенного mat-menu-item из-за его не кликабельной природы, но я не могу переопределить поведение через CSS. Я хочу, чтобы оно было жирным, как в пользовательском меню gitlab, а не светло-серым, как есть.

<div>
  <button mat-icon-button [matMenuTriggerFor]="menu">
    <mat-icon>account_circle</mat-icon>
    <mat-icon>arrow_drop_down</mat-icon>
  </button>
  <mat-menu #menu="matMenu" yPosition="below" >
    <p class="user-info" mat-menu-item disabled>Name Surname</p>
    <mat-divider></mat-divider>
    <button class="menu-item" mat-menu-item>Profile</button>
    <mat-divider></mat-divider>
    <button mat-menu-item>Sign out</button>
  </mat-menu>
</div>

Answer 1

В вашем css вы можете сказать:

.mat-menu-item[disabled] {
    color: default;
}