Or how to send years of development in semantics and accessibility down the trash.
Some will argue that there is accessibility options (see https://github.com/necolas/react-native-web/blob/master/docs/guides/accessibility.md) but this is an afterthought that 90% of devs will not use.
No, it just provides a way to force another theme and pass it to the themeProvider method. What I meant is a way to actually pass a value to the browser (for example, dark) so you can use the (prefers-color-scheme: dark) media-query in CSS without any additional JS to actually apply the theme.
Well, I totally get your point but someone could still include another global stylesheet and blow your components :-) Your scoped component is only declared as “#random_id_generated-by-vue .your .selector” so anything that is not declared in there will still inherit global styles. It all comes down to technical debt, coding standards and QA. Real…
It was just a simple example. Of course you can’t use “nav ul li” if you have different navigations (although they might benefit common declarations), but it doesn’t change the fact you shouldn’t have the same class applied to every single “‘li”.
Re scoped CSS, it doesn’t stop the cascade, it just adds the ID of the…
It is somehow explained in the code which says both blocks will be blue.
If you apply 2 classes on the same element, and these 2 classes change the same property, the last declared class will override the previous one (only for the properties they have in common).
What would be nice is a way to force a specific preferred-color-scheme, regardless of the current dark mode setting (so you can create a manual switcher à la Twitter). I know you could set a class to html and duplicate your declarations but that’s not very elegant.
That expensive descendant selector concept is an urban legend that is hard to kill. It was probably invented by BEM fanatics.
The only downside of descendant selectors (some would say the cascade is a downside) is it can potentially take more space in your CSS, although you often need far…
Make sure IE11 doesn’t run in compatible mode when testing this. Open the developer tools and see what version is listed in the top right corner. Anything else than IE11 (possibly IE10 as it had early support for flexbox) will fail.
Anyway, hopefully everybody reads…