search

brisa-build / brisa

The Web Platform Framework.
https://brisa.build
MIT License
452 stars 12 forks source link

feat: adapt global styles in WCs SSR #502

Closed aralroca closed 1 month ago

aralroca commented 1 month ago

Related https://github.com/brisa-build/brisa/issues/156

The imported CSS files were correctly adapted in the Web Components, but the SSR part was missing, which this application also does unless you disable the adaptation of global styles inside the WCs. Now it works, without any FOUC anymore.

Before this PR, it was already working for the inline style, and with this change it is still working. It is only adapted to work with CSS files as well.

So adding this to the layout:

Screenshot 2024-09-30 at 16 34 54

Then the DSD of the Web Components:

<my-element>
  <template shadowroot="open">
    <!-- ... -->
      <style>@import '/style-1234.css';@import '/nav-1234.css';@import '/footer-1234.css'</style>
  </template>
</my-element>

*1234 is an example of hash.

This is the current way to do it with DSD. In the future when they accept this proposal, it will be different and we will adapt.