Fixed to viewport via layout's inFront only allows a single element

[adamnfish]

It'd be great to be able to add multiple separate elements that are fixed to the viewport!

inFront on the layout is the only way to add "fixed-position" elements that are stuck to the viewport.

Let's say you have an application with a sticky header for nav. No worries, this goes into the layout call's inFront attribute ✅

But what if you now need to show some kind of a popup/overlay during the application lifecycle? Maybe a help box, or some error kind of error toast. In any case, we're already using the layout's inFront for the header 😬

I think we have three options:

1. the header will have to vanish / flick to another position when we show the popup. Not great!
2. we have to show the popup inFront of another element, it's no longer attached to the viewport so we just have to hope it is properly in view. Not great!
3. we add a single giant inFront that includes the header and the popup, properly laid out. This is harder than it sounds!

To dig on on 3, as well as being super inconvenient on the face of it, we now have the huge issue of mouse/touch events being absorbed by the shroud element we're using to lay out our popup / header combo. You end up having to add custom attributes that disable pointer events whatever container element you're using for the layout inFront attribute, and adding more custom attributes to re-enable pointer events for the actual relevant parts. It's a bit of a hack and I'm super nervous about the accessibility and stability of this approach.

Here's an example. In this case I have fixed information toasts at the top of the page and fixed error information at the bottom, so the whole page in between is covered by container that is used as the layout's inFront element, which needs width fill and height fill.

Maybe this is something that would fit into the v2 changes, if that's still on the cards.

Apologies if I've missed something!