We used to ship with a css class that dimmed the entire page, but it was deemed to jarring for users. Note that you can write your own css that uses the existing phx-disconnected class to toggle the main content and show a full loading page just like an SPA, but our generators don’t do this out of the box. Another minor nuance is we set cursor: wait;
and pointer-events: none;
to give feedback no interaction can happen, and also prevent any interaction on links/buttons from happening. ie new app.scss with --live have this:
.phx-disconnected{
cursor: wait;
}
.phx-disconnected *{
pointer-events: none;
}
So you can imagine defining a couple more lines of code to do the SPA style content swap