angular-material

I am using Angular Material 14 with Angular 15 and below is the code to display Menu items with mat-nav-list <mat-nav-list role="list"> <a mat-list-item role="listitem" class="list-item-setting" matTooltipPosition="right" routerLinkActive="active" [routerLinkActiveOptions]="{exact:true}" class="admin-link"> <mat-icon class="list-item-setting">user1</mat-icon> <span>User 1</span> </a> <a mat-list-item role="listitem" class="list-item-setting" matTooltipPosition="right"…

I was trying to customize the style of the scrollbar angular material sidenav element to match my design, and i am stuck doing it Explanation: To remove the default style of blue background color, enter image description here

I am trying to update the css of specific dates in mat calendar, when the user clicks on a button. This is the code I have: app.component.ts: import { Component, ViewEncapsulation } from '@angular/core'; import { MatCalendarCellClassFunction } from '@angular/material/datepicker';…

I have set the outline color on hover successfully. But when I try to set outline color for hover in invalid state it does not work. My code is given below: &.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-form-field-flex:hover .mat-form-field-outline { //It works it set the…

I am showing Angular error messages using the following code: <mat-error> {{error}} </mat-error> Sometimes I need to change the left position of the error message. The class that responsible for showing errors is this: ".mat-mdc-form-field-error-wrapper".I can override it like this:…