@danielmm1997 I agree with you. In theory not using /deep/ should be good, but in practice I don’t think that’s good.
From a commentary I saw (that I agree):
Custom properties — These are not suited or intended for wholesale styling of shadow descendants, as CSS WG members have said. They are far too unwieldy when exposing lots of properties, and they put an onus on the component author to anticipate all possible use-cases in advance. If the component you’re using doesn’t expose a custom property to do what you want, you’re out of luck.
Source: https://medium.com/@jonrimmer/8c8043c015dc (it’s about angular css, but based on shadow dom / native encapsulation)
In an ideal world, every library would provide every expected css variable so as to make the use of hacks such as
/deep/ unecessary. Unfortunately, they are people with limited resources and time, and it’s expected that their components will have css properties that the consumers can’t override through css because of the shadow DOM. Such problems would be greatly mitigated with
I don’t consider shadow dom production ready while there isn’t a way to access inner components in shadow dom through css (unless I’m not using 3rd party components, which is not the case when using ionic components), because of the reasons above.
The intent of the ionic team for using it should be good, but I don’t think that the result is good, at least for now, and without a way to disable it (to use the ionic components without shadow dom).