- Move all styles to ng-devtools/src/styles.
- Create a BrowserService that detects the browsers and adds it as a class to the body. Move global browser styles.
- Create theme mixins that incorporate the browser type into them.
- Refactor some of the affected code along with the introduced changes.
PR Close#59589
Previously the DevTools demo app and browser app had duplicated styles in their respective styles.scss files.
This commit creates a global styles.scss that is imported with sass @use into the demo and browser app styles.scss files. This will prevent any issues where css changes to one are missed in the other. Also reduces duplication of material css theme definitions by consolidating it inone place. The respective styles.scss files for the demo app and browser app continue to exist incase those need environment specific css. For example the browser app requires that height: 100% is set on a document in order to render properly in a browsers devtools tab.
PR Close#49001
In the #48216 Material deps were updated to v15,
but the components and modules in DevTools were not
updated to MDC nor replaced with the legacy definitions.
PR Close#48420
