-
Notifications
You must be signed in to change notification settings - Fork 79
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Page's html and body styling still applied #68
Comments
Inherited styles such as |
Is there a good way of resetting these styles? I’m also trying to use Material UI within the shadow dom, which is proving to be a little difficult. |
Yes with |
As an example: https://codesandbox.io/s/react-shadow-4rcso |
Thanks - I reset some of the styles using that approach, but with Material UI it’s still inheriting some of external page’s styling. That is, there are styles such as the font-size (defines in the html tag) which impact the size of fonts of mui, which are defined in rem. I followed the answer provided here: https://stackoverflow.com/questions/51832583/react-components-material-ui-theme-not-scoped-locally-to-shadow-dom, but I’m still having some issues with minor differences across sites. |
Well that's problematic as |
I’m going to close the ticket, but please let me know if you need any more help. |
I am building a chrome extension and am injecting code directly in the page. To avoid conflicting styles, I have utilized the react-shadow package and have been mostly successful in isolating the CSS. However, I am still getting issues with leakage of styles into the page.
For instance, in Gmail my extension looks like this:
But in Stack Overflow it looks like this:
![Screen Shot 2020-01-16 at 5 31 08 PM](https://user-images.githubusercontent.com/17213698/72576994-0e01e600-3886-11ea-9160-80e42edd54ce.png)
I looked at the rendered HTML in the browser and it seems like there is still leakage of the styling on the html and body tags from the page into my page. Does anyone know why this might be the case?
The text was updated successfully, but these errors were encountered: