Investigate removal of the hard CSS reset

[GauBen]

Context

Root investigation ticket

Since 2bc53db (2019), Moonstone contains a hard reset:

/* Something similar to this */
* {
    margin: 0;
    padding: 0;
}

This is fine most of the time but it may collide with user styles in context such as the editframe:

(Screenshot of Luxe that shows a mix of Luxe styles and Moonstone components)

jContent contains a workaround: all injected styles are scoped on the fly by a very expensive function (it takes a few seconds on a mac M4 to scope all moonstone).

The goal of the spike is to remove this hard reset from Moonstone and see what breaks.

On a similar note, all Moonstone styles should be scoped, using whatever CSS-in-JS is trendy right now instead of using global classes

Outcomes

• A PR and follow up tickets if things are broken

Notes

Useful information (Technical, Design)

[GauBen]

Other ideas worth investigating:

• Using CSS encapsulation/shadow DOM to avoid CSS collisions
• Placing the reset in its own entrypoint (import "@jahia/moonstone/reset.css" instead of import "@jahia/moonstone")