-
Notifications
You must be signed in to change notification settings - Fork 13.5k
Converting Scoped to Shadow
Liam DeBeasi edited this page Jul 7, 2021
·
1 revision
There will be some CSS issues when converting to shadow. Below are some of the differences.
Targeting host + slotted child
/* IN SCOPED */
:host(.ion-color)::slotted(ion-segment-button)
/* IN SHADOW*/
:host(.ion-color) ::slotted(ion-segment-button)Targeting host-context + host (with a :not)
/* IN SCOPED */
:host-context(ion-toolbar.ion-color):not(.ion-color) {
/* IN SHADOW */
:host-context(ion-toolbar.ion-color):host(:not(.ion-color)) {Targeting host-context + host (with a :not) > slotted child
/* IN SCOPED */
:host-context(ion-toolbar:not(.ion-color)):not(.ion-color)::slotted(ion-segment-button) {
/* IN SHADOW*/
:host-context(ion-toolbar:not(.ion-color)):host(:not(.ion-color)) ::slotted(ion-segment-button) {