iframe was great because we controlled our page context to style things
easily, handle assets easily.
But since it's not on the same domain as the services consuming it, it
implied configuration here and there. Also some behaviors were annoying
to implement (for example, keyboard navigation). I'm sure everything we
do is possible via iframe but I feel like I'll go from barrier to
barrier at every new thing we want to do…
I feel like, at the cost of handling style-conflicts, just rendering
everything in the real page context is more future-proof.
- the CSS that included the DSFR excerpt we needed styled some base html
tags directly. It might collide with a service CSS already there. Now a
postcss plugin applies a CSS prefix to everything
- we output in the lib two DSFR file versions: one with prefixed
selectors, one raw.
- we have a static astro website under /website. It has the
implementation docs of the homepage/gaufre templates, and it handles the
few API endpoints (the gaufre js, backgrounds, logos)
- we have a vite app under /packages/integration. It has the react
components generating the homepage and the gaufre button, and their css.
Its used to generate an npm package