I’m reviewing some themes and see that for mobile styles, declarations are now overwritten by core declarations.
When I declare a rule directly in mobile/mobile.scss, it has precedence and is applied. But when I use @import in mobile.scss, the imported declarations are overwritten.
E.g. some @imported declarations I have in themes that are now overwritten by declarations in core:
#list-area { background: xxx;}
body { background-color: xxx;}
Hmm, that’s surprising. The theme stylesheets, whether mobile or desktop, are set to be loaded after core ones, see:
Are you sure there isn’t something else happening, like a selector specificity issue? Often core gets updates with more specific selectors which can mean themes using the original selector would regress.
It wasn’t about specificity as I switched exactly same declarations between mobile.scss and using @import in mobile.scss. First was applied and the other was overwritten in the browser inspector.
But now I also can’t reproduce it! Just created a blank component with only a mobile.scss to try it again and declarations are applied both ways.
So sorry for the false report! Though I’m at loss what caused it before… had it in different browsers as well…
No worries! Maybe this happens under a specific set of conditions…