How to reduce matInput height to certain value?

I have simple matInput element from angular-material library:

<mat-form-field class="example-form-field">
<mat-label>Clearable input</mat-label>
<input matInput type="text" [(ngModel)]="value">
@if (value) {
<button matSuffix mat-icon-button aria-label="Clear" (click)="value=''">
<mat-icon>close</mat-icon>
</button>
}
</mat-form-field>


This matInput has a height of 56px. I need to reduce this height to 28px. Please help me.

Here is a live demo.



Continue reading...