Изменить размер флажка в списке выбора угловых материалов

Question

Можно ли изменить размер флажка в Список выбора угловых материалов ? Я попытался изменить размер mat-pseudo-checkbox в CSS, но из-за этого флажок был установлен неправильно:

mat-pseudo-checkbox {
  height: 10px;
  width: 10px;
}

Есть ли другой селектор, который мне нужно отрегулировать, чтобы исправить это?

Answer 1

С Angular 7 мне удалось:

mat-checkbox ::ng-deep .mat-checkbox-inner-container {width: 30px;height: 30px;}

Answer 2

Да, флажок - это просто псевдоэлемент внутри флажка. Вы можете переопределить его стили так же, как и в самой коробке.

Для вашего случая с размером блока 10px будет работать следующий CSS (для других размеров значения должны быть скорректированы):

.mat-pseudo-checkbox-checked::after {
    top: 0px;
    left: -1px;
    width: 6px;
    height: 2px;
}