Как переопределить стиль компонента библиотеки в CSS приложения React? ⇐ CSS

[Гость]

У меня есть компонент React, который показывает компонент оповещения с помощью scss.

Код: Выделить всё

export function MyComponent() {
return (



);
}

MyComponent.module.css

Код: Выделить всё

.alert {
width: 390px;
margin-top: 182px;
margin-bottom: 22px;
}

Теперь мне нужно, помимо прочего, изменить цвет и цвет фона. Когда я смотрю на стиль метки внутри предупреждения в DevTools, я вижу стиль ниже.
Стиль в DevTools:

Код: Выделить всё

div.alert .message {
font-size: 0.875rem;
font-weight: 700;
}

Редактирование этого стиля в DevTools на стиль ниже меняет внешний вид веб-страницы.
Отредактированный стиль в DevTools (меняет внешний вид):

Код: Выделить всё

div.alert .message {
font-size: 0.875rem;
font-weight: 700;
color: white;
}

Однако, если я добавлю этот стиль из DevTools в CSS моего компонента, он не будет работать.
Отредактированный стиль из DevTools добавлен в CSS (НЕ меняет внешний вид):

Код: Выделить всё

div.alert .message {
font-size: 0.875rem;
font-weight: 700;
color: white;
}

Так как же это сделать? Ниже приведен стиль элемента для div, который содержит сообщение предупреждения:



Подробнее здесь: https://stackoverflow.com/questions/781 ... ct-app-css