Initial loading screen isn't pretty

The first screen that users see when loading zulip isn’t pretty:

We should make a few changes here:

• The content should be centered on the page, horizontally and vertically
• We should include the zulip circle logo (it’s only 767 bytes, so we’re not really risking slowing things down much)
• If the user has prefers-color-scheme: dark, we should make the page background dark (It appears that currently we make the text the color that is correct for the dark colorscheme, but don’t change the background?)
• De-emphasize the “If this message does not go away, please wait a couple seconds and reload the page.” text, by moving it to the bottom of the page vertically.
• Consider changing the text to something like “Zulip is loading…” instead of just “Loading…”
• Consider adding a spinner in front of the “Zulip is loading…” or “Loading…” text

My impression is that Zulip loads quickly enough for most people that we don’t need to go out and make a whole fancy animated splash screen that shows the tip of the day or whatever, but I do think some simple visual improvements would go a long way 😃

[timabbott]

I agree this would be really nice to fix. I agree a logo with a loading indicator is basically all we need.

[timabbott]

This was completed, with everything except that we’ve kept the “Loading…” text. I’m not sure it makes sense to add a loading indicator, since in most cases the page loads so fast that you wouldn’t see the animation happen, at least if one counts loading time starting from when this page loads (which is after the server does all the work it’ll do on the backend). Maybe worth a #design discussion about any next steps.