uetchy / Polyglot

🌏 The missing Safari extension that translates selected text into your native language.
Other
482 stars 44 forks source link

Popup with translation can be broken by styles of page where it is open #92

Open davidyuk opened 3 years ago

davidyuk commented 3 years ago

Describe the bug Popup with translation in some cases can be broken by the styles of the page where it is open.

To Reproduce

  1. Go to example.com
  2. Select some text to translate
  3. See a popup with extra padding like on the screenshots below

Expected behavior A popup without extra paddings.

Screenshots Screenshot 2021-02-28 at 20 18 41

Version:

Additional context Instead of the current styles isolation approach (polyglot namespace and !important) I'm proposing to put popups into a shadow DOM (part of Web Components API) this should allow completely isolate styles of extension's popups from the styles of the opened page. Web Components seems to be well-supported by the latest versions of Safari.