Nishanth Prabhakaran
Nishanth Prabhakaran

Reputation: 359

How to remove outline for Material row header with MatSort in Angular 9?

I got an issue after implementing MatSort to my Material table. It's showing outline for the header column name when click on it to sort

enter image description here

Is it possible to disable it? If possible, Please help me on how to do it.

I implemented Material table with sorting as shown in the below link: https://material.angular.io/components/table/overview#sorting

Upvotes: 1

Views: 1391

Answers (3)

Gerard Ferrer Birbe
Gerard Ferrer Birbe

Reputation: 105

I had to use the following:

::ng-deep .mat-sort-header-button {
    outline: none !important;
}

Upvotes: 2

Deian
Deian

Reputation: 1364

As of may-2021 I had to use the following:

::ng-deep .mat-sort-header-container {
  box-shadow: none !important;
}

Upvotes: 1

Peyman
Peyman

Reputation: 64

use this code in style.css

 .mat-sort-header-button {
    outline: none !important;
  }

Upvotes: 1

Related Questions