I tried to add a component scss file containing that code:
Code: Select all
:host {
@media (max-width: 1024px) {
.topbar-badge {
padding: 4px 5px 3px 5px;
font-size: 14px;
font-weight: bold;
}
}
}
As you can see the global style takes the lead for the already defined properties and my override is quite canceled.
I tried to add a class to be more specific and it didn't work either:
Code: Select all
:host {
@media (max-width: 1024px) {
.topbar-badge {
&.big {
padding: 4px 5px 3px 5px;
font-size: 14px;
font-weight: bold;
}
}
}
}
How to override the global UltimaNG theme?
Please note I don't want to have to use !important keyword as it sounds not to be a proper solution to me, nor a good practice.
Thanks and have a nice day!