'General styling but different nuances depending on the component - Angular

I'm trying to apply some styling to my Angular application and I'd like, for most of the views, to have a certain style. However, I'd like to apply a different style for a bunch of other components.

Is it possible to ask Angular to apply a certain css for some components, and a different style for others by using scss or any other tool that Angular provides and I'm not aware about? Like *ngIf in the app.component.html and retrieve in the .ts the component that is currently being displayed in the <router-outlet>? Or it's just not possible



Solution 1:[1]

Let's say the desired component selector is: selector: 'app-message-list' You could only target the component with css by:

app-message-list {
width: 80%;
background: red;
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Joosep Parts