Как я могу удалить красную границу из этого div при нажатии?

Question

Я использую шрифт потрясающие иконки внутри div. При нажатии я меняю цвет на синий. Тем не менее, я не хочу красную рамку, которая появляется при нажатии. Как это убрать?

HTML

   <div class="row tile-container"> 
      <div class="tile-art search"  (click)="changeSearchClass();" 
       [ngClass]="clicksearch ? 'blue': 'search'" routerLink="/app-quotation">
            <i class="fas fa-search fa-lg"></i>
      </div>
   </div>

CSS

 .tile-container{
  box-shadow: 1px 2px;
  color: lightgrey;
 }

 .search{
   padding-top:10px;
 }

 .blue{
   color:blue;
 }

Answer 1

Это может помочь

.tile-art:focus {
  outline: none !important;
}

Answer 2

Использовать контур CSS 0 для этого класса

.tile-art, .tile-art i {
    outline: 0;
}

Answer 3

changeSearchClass(){ this.clicked = !this.clicked; }

и в вашем html

  <div class="tile-art search"  (click)="changeSearchClass();" [style.border]="clicked ?  none :'red' "
       [ngClass]="clicksearch ? 'blue': 'search'" routerLink="/app-quotation">
            <i class="fas fa-search fa-lg"></i>
      </div>