Scope css, improve image error handling, show progress bar

- Errors are shown if some images fail to load.
- Progress bar is shown while images are loading.
- .pack is called after all images have been loaded.

1 files changed, 11 insertions, 1 deletions

diff --git a/resources/css/style.css b/resources/css/style.css
index a380707..76af98e 100644
--- a/resources/css/style.css
+++ b/resources/css/style.css
@@ -47,7 +47,7 @@ img {
                 var(--fg-inactive) 0px 0px 0px 1px inset;
 }
 
-input, .alert {
+#login-form input, .alert {
     color: var(--fg-main);
     background-color: var(--bg-main);
     border: 1px var(--bg-active) solid;
@@ -109,3 +109,13 @@ img, .text { width: 400px; }
 .alert {
     background-color: var(--red-subtle-bg);
 }
+#loading-progress, #loading-error { margin-bottom: 2em; }
+#loading-error { display: none; }
+#loading-error button {
+    float: right;
+    color: var(--fg-main);
+    background-color: var(--bg-main);
+    border: 1px var(--bg-active) solid;
+    padding: 0.25em 1em;
+}
+#loading-progress { width: 100%; }