Layout fixes

eternity/styles/styles.css

@@ -80,15 +80,42 @@ body .link:hover,
 }
 
 #logo {
+  max-height: 100px;
+  max-width: 100%;
   font-family: var(--font-family-monospace);
   font-weight: 500;
   letter-spacing: 1px;
 }
 
-#taskmenu,
-#taskmenu .action-buttons,
-#layout-menu .menu,
-.toolbar,
+/* Guard the login layout in case the parent Elastic stylesheet did not load
+   (e.g. it was not compiled/built), so credentials never render unstyled. */
+body.task-login #layout {
+  display: flex;
+  height: 100%;
+  width: 100%;
+}
+
+body.task-login #layout-content {
+  display: block;
+  width: 100%;
+  text-align: center;
+}
+
+body.task-login #logo {
+  display: inline-block;
+  position: relative;
+  top: 16vh;
+  max-height: 100px;
+}
+
+#login-form {
+  position: relative;
+  top: 20vh;
+  width: 95%;
+  max-width: 320px;
+  margin: 0 auto;
+}
+
 #messagelist-header,
 #directorylist-header {
   font-family: var(--font-family-monospace);
@@ -96,10 +123,22 @@ body .link:hover,
   letter-spacing: 0.3px;
 }
 
+#taskmenu,
+#taskmenu .action-buttons,
+#layout-menu .menu,
+.toolbar {
+  font-family: var(--font-family-monospace);
+  letter-spacing: 0.2px;
+}
+
 #taskmenu .action-buttons a,
 #taskmenu a,
-#layout-menu .menu a {
+#layout-menu .menu a,
+.toolbar a.button {
   border-radius: 0;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 #taskmenu .action-buttons a.selected,