Investigate using shadow root for shared component (styles)

Created by: felixfbecker

Shadow root would allow us to encapsulate styles in components that are also rendered in the browser extension and not leak global class names or Bootstrap styles. We could import Bootstrap just for our components with adoptedStylesheets. To still inherit code host styles (like Bootstrap used on GitHub), the browser extension can manually inherit with adoptedStylesheets = [...document.styleSheets, customStyleSheet]. If a page does not use Bootstrap, we can pass props like buttonClassName for various elements that we are using and the host can style them this way.

Constructable stylesheets can also be simulated by appending <style> tags for browsers that don't support it. Polyfill: https://www.npmjs.com/package/construct-style-sheets-polyfill

More info on constructible style sheets: https://developers.google.com/web/updates/2019/02/constructable-stylesheets