How to change the reconnect overlay in serverside blazor

Question

I would like to chance the overlay when the site is disconnected.

("Reconnection failed. Try reloading the page if youre unable to reconnect. [Retry]")

Is this possible?

Answer 1

Is possible. Overwrite with custom css. Please read the following manual. https://docs.microsoft.com/en-us/aspnet/core/blazor/hosting-models?view=aspnetcore-3.0#reconnection-to-the-same-server

Answer 2

I came across an article explaining how to integrate blazor server side with an existing mvc project and found an explanation on how to override the reconnect message. It seems blazor creates the following:

<div id="components-reconnect-modal" class="reconnect-block">
   <div class="reconnect-wait">
      Connection lost -- please wait, attempting to reconnect
   </div>
   <div class="reconnect-button">
      Unable to reconnect. Click to attempt to reconnect:
      <input type="button" value="Reconnect" onclick="Reconnect()" />
   </div>
</div>

<script>
   function Reconnect() {
     window.Blazor.reconnect();
   }
</script>

I'm sure this can be overwritten with whatever you'd like. Hope this helps.

Source: Article