Как стилизовать Angular Material mat-form-field/matInputCSS

Разбираемся в CSS
Ответить
Anonymous
 Как стилизовать Angular Material mat-form-field/matInput

Сообщение Anonymous »

Я использую последнюю версию материала Angular (v16) и пытаюсь стилизовать matInput (внутри поля mat-form-field), и у меня возникают некоторые проблемы с поведением. Я просто хочу переопределить цвет ввода, когда я не прикасался. Я также хочу изменить цвет заполнителя и метки мата.
Какие решения мне нужно изменить, чтобы изменить только цвет границы, но не повлиять на поведение компонента материала?
Я нашел решение с ng-deep, которое работает частично, но стиль остается примененным, даже если входные данные имеют ошибку или сфокусированы. Он всегда сохраняет этот зеленый цвет для границы, но если есть ошибки, я хочу, чтобы граница была красного цвета, если она в фокусе, я хочу иметь цвет по умолчанию для фокуса (в данном случае синий).
::ng-deep .mdc-notched-outline__leading {
border-color: green !important;
}
::ng-deep .mdc-notched-outline__notch {
border-color: green !important;
}
::ng-deep .mdc-notched-outline__trailing {
border-color: green !important;
}


Подробнее здесь: https://stackoverflow.com/questions/772 ... d-matinput
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»