[proxy] complete the text content and styling of web UI pages written so far

1 files changed, 29 insertions, 10 deletions

diff --git a/src/hydrilla/proxy/web_ui/templates/items/load_from_disk.html.jinja b/src/hydrilla/proxy/web_ui/templates/items/load_from_disk.html.jinja
index 84ade45..30179dd 100644
--- a/src/hydrilla/proxy/web_ui/templates/items/load_from_disk.html.jinja
+++ b/src/hydrilla/proxy/web_ui/templates/items/load_from_disk.html.jinja
@@ -19,7 +19,9 @@ file's licenses. Although I request that you do not make use this code
 in a proprietary work, I am not going to enforce this in court.
 #}
 {% extends "base.html.jinja" %}
+
 {% block title %} {{ _('web_ui.load_from_disk.title') }} {% endblock %}
+
 {% block style %}
   {{ super() }}
 
@@ -27,20 +29,37 @@ in a proprietary work, I am not going to enforce this in court.
   input[type="file"]::file-selector-button {
       display: none;
   }
+
+  input[type="file"] {
+      display: block;
+      font-size: inherit;
+      font-style: inherit;
+  }
 {% endblock %}
+
 {% block main %}
   <h3>{{ _('web_ui.load_from_disk.heading') }}</h3>
+
   <form method="POST" enctype="multipart/form-data">
-    <div>
-      <input id="items_zipfile" name="items_zipfile" type="file"
-             accept=".zip,application/zip" required="">
-    </div>
-    <div>
-      <label class="green-button" for="items_zipfile">
-        {{ _('web_ui.load_from_disk.choose_zipfile_button') }}
-      </label>
-    </div>
-    <div>
+    {% if uploaded_file_not_zip is defined %}
+      {{ error_note(_('web_ui.err.uploaded_file_not_zip')) }}
+    {% endif %}
+
+    {% if invalid_uploaded_malcontent is defined %}
+      {{ error_note(_('web_ui.err.invalid_uploaded_malcontent')) }}
+    {% endif %}
+
+    <input id="items_zipfile" name="items_zipfile" type="file"
+           accept=".zip,application/zip" required=""
+           class="block-with-bottom-margin">
+
+    <label class="green-button block-with-bottom-margin" for="items_zipfile">
+      {{ _('web_ui.load_from_disk.choose_zipfile_button') }}
+    </label>
+
+    <div class="horizontal-separator"></div>
+
+    <div class="flex-row">
       <button class="green-button">
         {{ _('web_ui.load_from_disk.install_button') }}
       </button>