When provided with dynamic values, previously it would be included to the scoped variables, which is "counter-intuitive" towards its behavior. Now, the dynamic variables are now inserted directly to the document (in CSS, this would be :root. The new behavior is also SSR-friendly, as the variables are generated with :root style and inserted alongside the accompanied style sheet.
Internally, this introduces a new primitive called useSolidStyledGlobal.
Fixes #28
Since :global and @global are still declared in a "local sheet", their behavior will remain as-is. In the future, this behavior might be fixed for consistency.
Fix vars declaration to only generate if there's actually any dynamic styles.
<style jsx global>now has a different behavior:root. The new behavior is also SSR-friendly, as the variables are generated with:rootstyle and inserted alongside the accompanied style sheet.useSolidStyledGlobal.:globaland@globalare still declared in a "local sheet", their behavior will remain as-is. In the future, this behavior might be fixed for consistency.@global(Fixes #18)