UI fixes (#3461)

* Tidy recent password strength JS

* Improve toolbar spacing on mobile

* Remove "Error" from global error dialogs for now

fixes #3460

* Remove opacity from modal background (dark theme)

* Update links in edit_server.php

---------

Co-authored-by: Jaap Marcus <9754650+jaapmarcus@users.noreply.github.com>

web/css/src/themes/dark.css

@@ -771,7 +771,7 @@ strong {
    ========================================================================== */
 
 .modal {
-	background-color: rgb(45 45 45 / 95%);
+	background-color: #2c2c2c;
 	border-color: rgb(80 80 80 / 97%);
 	box-shadow: inset 0 1px 3px rgb(0 0 0 / 25%), 0 8px 25px rgb(0 0 0 / 90%);
 }

web/css/src/themes/default.css

@@ -602,7 +602,6 @@
 .toolbar-sorting {
 	position: relative;
 	font-size: 0.8rem;
-	padding-bottom: 5px;
 
 	& form {
 		flex-grow: 1;
@@ -616,10 +615,6 @@
 			margin-left: 10px;
 		}
 	}
-
-	@media (--viewport-large) {
-		padding-bottom: 0;
-	}
 }
 
 .toolbar-sorting-toggle {
@@ -829,8 +824,11 @@
 }
 
 .toolbar-search {
+	margin-top: 5px;
+
 	@media (--viewport-large) {
 		margin-left: 12px;
+		margin-top: 0;
 	}
 }
 
@@ -1731,7 +1729,7 @@
 .modal {
 	border-radius: var(--border-radius-base);
 	box-shadow: inset 0 1px 3px rgb(0 0 0 / 25%), 0 8px 40px 0 rgb(0 0 0 / 35%);
-	background-color: rgb(255 255 255 / 90%);
+	background-color: #f0efef;
 	border: 1px solid rgb(255 255 255 / 98%);
 
 	@media (--viewport-small) {

web/js/pages/add_mail_acc.js

@@ -92,10 +92,12 @@ applyRandomPassword = function (min_length = 16) {
 		passwordInput.value = randomPassword;
 		VE.helpers.recalculatePasswordStrength(passwordInput);
 		const passwordOutput = document.querySelector('.js-password-output');
-		if (passwordInput.getAttribute('type') === 'text' && passwordOutput) {
-			passwordOutput.textContent = randomPassword;
-		} else {
-			passwordOutput.textContent = Array(randomPassword.length + 1).join('*');
+		if (passwordOutput) {
+			if (passwordInput.getAttribute('type') === 'text') {
+				passwordOutput.textContent = randomPassword;
+			} else {
+				passwordOutput.textContent = Array(randomPassword.length + 1).join('*');
+			}
 		}
 		generate_mail_credentials();
 	}

web/js/pages/edit_mail_acc.js

@@ -83,10 +83,12 @@ applyRandomPassword = function (min_length = 16) {
 		passwordInput.value = randomPassword;
 		VE.helpers.recalculatePasswordStrength(passwordInput);
 		const passwordOutput = document.querySelector('.js-password-output');
-		if (passwordInput.getAttribute('type') === 'text' && passwordOutput) {
-			passwordOutput.textContent = randomPassword;
-		} else {
-			passwordOutput.textContent = Array(randomPassword.length + 1).join('*');
+		if (passwordOutput) {
+			if (passwordInput.getAttribute('type') === 'text') {
+				passwordOutput.textContent = randomPassword;
+			} else {
+				passwordOutput.textContent = Array(randomPassword.length + 1).join('*');
+			}
 		}
 		generate_mail_credentials();
 	}

web/templates/footer.php

@@ -75,7 +75,6 @@
 	<script>
 		window.addEventListener("load", (event) => {
 			VE.helpers.createConfirmationDialog({
-				title: '<?= _("Error") ?>',
 				message: '<?= htmlentities($_SESSION["error_msg"]) ?>'
 			});
 		});

web/templates/pages/edit_server.php

@@ -685,7 +685,7 @@
 						<label for="v_backup_mode" class="form-label">
 							<?= _("Compression") ?>
 							<a
-								href="http://docs.hestiacp.com/admin_docs/backups.html#what-is-the-difference-between-zstd-and-gzip"
+								href="https://hestiacp.com/docs/server-administration/backup-restore.html#what-is-the-difference-between-zstd-and-gzip"
 								target="_blank"
 								class="u-ml5"
 							>
@@ -705,7 +705,7 @@
 						<label for="v_backup_gzip" class="form-label">
 							<?= _("Compression level") ?>
 							<a
-								href="http://docs.hestiacp.com/admin_docs/backups.html#what-is-the-optimal-compression-ratio"
+								href="https://hestiacp.com/docs/server-administration/backup-restore.html#what-is-the-optimal-compression-ratio"
 								target="_blank"
 								class="u-ml5"
 							>
@@ -728,7 +728,7 @@
 						<label for="v_backup_dir" class="form-label">
 							<?= _("Directory") ?>
 							<a
-								href="https://hestiacp.com/docs/server-administration/backup-restore.html#how-to-change-default-backup-folder"
+								href=""
 								target="_blank"
 								class="u-ml5"
 							>
@@ -761,7 +761,7 @@
 							<label for="backup_type" class="form-label">
 								<?= _("Protocol") ?>
 								<a
-									href="http://docs.hestiacp.com/admin_docs/backups.html#what-kind-of-protocols-are-currently-supported"
+									href="https://hestiacp.com/docs/server-administration/backup-restore.html#what-kind-of-protocols-are-currently-supported"
 									target="_blank"
 									class="u-ml5"
 								>