font consistency fixes

web/css/form.css

@@ -41,6 +41,7 @@ legend {
 
 fieldset {
 	border: 0;
+	padding: 0;
 }
 
 fieldset > *:last-child {

web/css/nav.css

@@ -53,7 +53,6 @@ header {
 }
 
 header h1 {
-	font-size: 18px;
 	margin: 0;
 	background-color: var(--nav-header-bg-color);
 	color: var(--nav-header-text-color);
@@ -61,8 +60,8 @@ header h1 {
 }
 
 nav {
+	font-size: var(--small-font-size);
 	overflow: hidden;
-	font-size: larger;
 	width: fit-content;
 }
 

web/css/style.css

@@ -3,6 +3,9 @@
 	--positive-color: #0f0;
 	--highlight-color: yellow;
 	--lightbg-text-color: black;
+	--large-font-size: 32px;
+	--medium-font-size: 24px;
+	--small-font-size: 16px;
 }
 
 @media screen and (prefers-color-scheme: dark) {
@@ -41,9 +44,22 @@
 	}
 }
 
-* {
+*, h1, h2, h3, p {
 	box-sizing: border-box;
 	font-family: monospace;
+	
+}
+
+h1, p {
+	font-size: var(--small-font-size);
+}
+
+h2 {
+	font-size: var(--large-font-size);
+}
+
+h3 {
+	font-size: var(--medium-font-size);
 }
 
 html {

web/html/account.html

@@ -39,13 +39,9 @@
 			<h2>Account</h2>
 			<section class="w3-card w3-padding">
 				<h3>Account Details</h3>
-				<p id="username">Username: {{.account.Username}}</p>
-			</section>
-			<section class="w3-card w3-padding">
-				<div class="flex row nowrap">
-					<h3>Password</h3>
-					<button class="w3-button w3-margin" id="change-password" type="button">Change Password</button>
-				</div>
+				<p id="username">Username: {{.account.Username.UserID}}@{{.account.Username.Realm}}</p>
+				<p id="email">Email: {{.account.Mail}}</p>
+				<p>Password: <button class="w3-button" id="change-password" type="button" style="padding: 0em; height: 1.5em; line-height: 1.5em;">Change Password</button></p>
 			</section>
 			{{range $poolname, $pool := .account.Pools}}
 				{{template "pool-resources" $pool}}

web/html/index.html

@@ -72,7 +72,7 @@
 				<div class="w3-card w3-padding">
 					<div class="flex row nowrap" style="margin-top: 1em; justify-content: space-between;">
 						<form id="vm-search" role="search" class="flex row nowrap" tabindex="0">
-							<img alt="Search Instances" aria-label="Search Instances" src="images/common/search.svg#symb">
+							<button type="submit"><img alt="Search Instances" aria-label="Search Instances" src="images/common/search.svg#symb"></button>
 							<input type="search" id="search" class="w3-input w3-border" style="height: 1lh; max-width: fit-content;" aria-label="search instances by name">
 						</form>
 						<!--Add Instance Button & Dialog Template-->

web/scripts/clientsync.js

@@ -3,7 +3,7 @@ import { getSyncSettings, requestAPI } from "./utils.js";
 export async function setupClientSync (callback) {
 	const { scheme, rate } = getSyncSettings();
 	if (scheme === "never") {
-		return
+		return;
 	}
 	else if (scheme === "always") {
 		window.setInterval(callback, rate * 1000);