Fixes and updates (#3152)

docs/docs/introduction/best-practices.md

@@ -1,6 +1,6 @@
 # Best Practices
 
-Managing a server is not easy. Here are a couple of best practices you should try to adhere to while managing your Hestia server.
+Managing a server is not easy. Here are some best practices you should try to adhere to while managing your Hestia server.
 
 ## Use a regular user
 

docs/index.md

@@ -25,7 +25,7 @@ hero:
 features:
   - icon: 🚀
     title: Fast & easy to learn
-    details: Hestia is made with ease of use in mind. Creating a user or a website is as easy as clicking a button and filling up a couple of fields, while advanced features are easily accessible.
+    details: Hestia is made with ease of use in mind. Creating a user or a website is as easy as clicking a button and filling out a couple of fields, while advanced features are easily accessible.
     link: /docs/introduction/getting-started
     linkText: Documentation
   - icon: ❤️
@@ -40,7 +40,7 @@ features:
     linkText: Help develop Hestia
   - icon: 🤝
     title: Supported by the community
-    details: Hestia has a great support community, join the forum or the Discord server! To keep the project running, we rely on donations, which can be done via PayPal or cryptocurrency.
+    details: Hestia has a great support community - join the forum or the Discord server! To keep the project running, we rely on donations, which can be made via PayPal or cryptocurrency.
     link: /donate
     linkText: Donate
 ---

web/css/src/themes/dark.css

@@ -375,10 +375,6 @@ strong {
 .units > div:last-child {
 }
 
-.l-unit-ft {
-	color: #cdcdcd;
-}
-
 .l-unit:hover .l-unit-toolbar__col--right {
 }
 
@@ -909,6 +905,7 @@ form#vstobjects.suspended {
 }
 
 .app-footer {
+	color: #cdcdcd;
 	border-color: #454545;
 }
 

web/css/src/themes/default.css

@@ -250,6 +250,8 @@
 
 .top-bar-notification-delete {
 	display: none;
+	background-color: transparent;
+	border: 0;
 	padding-left: 5px;
 	padding-right: 5px;
 
@@ -263,8 +265,12 @@
 	}
 }
 
-.top-bar-notification-mark-all {
+.top-bar-notification-delete-all {
 	display: block;
+	background-color: transparent;
+	border: 0;
+	color: inherit;
+	width: 100%;
 	text-align: center;
 	padding: 10px 15px;
 
@@ -1011,11 +1017,6 @@
 	border-bottom: none;
 }
 
-.l-unit-ft {
-	color: #7c7c7c;
-	padding: 0 0 0 15px;
-}
-
 .l-unit:hover .l-unit-toolbar__col--right {
 	display: block;
 }
@@ -1132,10 +1133,6 @@
 	padding-left: 16px;
 }
 
-.l-unit__col--right.back {
-	padding-left: 78px;
-}
-
 .l-unit__suspended {
 	display: none;
 	font-size: 0.8rem;
@@ -2475,10 +2472,21 @@ form#vstobjects.suspended {
 }
 
 .app-footer {
+	color: #7c7c7c;
 	border-top: 1px solid #ddd;
 	font-size: 0.8rem;
-	padding-top: 30px;
-	padding-bottom: 30px;
+	padding-top: 20px;
+	padding-bottom: 20px;
+
+	@media (--viewport-medium) {
+		padding-top: 40px;
+		padding-bottom: 40px;
+	}
+}
+
+.app-footer-inner {
+	padding-left: 15px;
+	padding-right: 15px;
 }
 
 /* Collapse component

web/js/main.js

@@ -114,8 +114,6 @@ function randomString(length = 16) {
 }
 
 document.addEventListener('alpine:init', () => {
-	const token = document.querySelector('#token').getAttribute('token');
-
 	// Sticky class helper
 	window.addEventListener('scroll', () => {
 		const toolbar = document.querySelector('.toolbar');
@@ -188,6 +186,7 @@ document.addEventListener('alpine:init', () => {
 			}
 		},
 		async list() {
+			const token = document.querySelector('#token').getAttribute('token');
 			const res = await fetch(`/list/notifications/?ajax=1&token=${token}`);
 			this.initialized = true;
 			if (!res.ok) {
@@ -200,6 +199,7 @@ document.addEventListener('alpine:init', () => {
 			);
 		},
 		async remove(id) {
+			const token = document.querySelector('#token').getAttribute('token');
 			await fetch(`/delete/notification/?delete=1&notification_id=${id}&token=${token}`);
 
 			this.notifications = this.notifications.filter((notification) => notification.ID != id);
@@ -208,6 +208,7 @@ document.addEventListener('alpine:init', () => {
 			}
 		},
 		async removeAll() {
+			const token = document.querySelector('#token').getAttribute('token');
 			await fetch(`/delete/notification/?delete=1&token=${token}`);
 
 			this.notifications = [];

web/templates/includes/panel.php

@@ -85,13 +85,13 @@
 								>
 									<div class="top-bar-notification-header">
 										<p x-text="notification.TOPIC" class="top-bar-notification-title"></p>
-										<a
+										<button
 											x-on:click="remove(notification.ID)"
-											href="#"
+											type="button"
 											class="top-bar-notification-delete"
 										>
 											<i class="fas fa-xmark"></i>
-										</a>
+										</button>
 									</div>
 									<div x-html="notification.NOTICE"></div>
 									<p
@@ -102,14 +102,14 @@
 							</template>
 							<template x-if="initialized && notifications.length > 2">
 								<li>
-									<a
+									<button
 										x-on:click="removeAll()"
-										href="#"
-										class="top-bar-notification-mark-all"
+										type="button"
+										class="top-bar-notification-delete-all"
 									>
 										<i class="fas fa-check"></i>
 										<?= _("Delete all notifications") ?>
-									</a>
+									</button>
 								</li>
 							</template>
 						</ul>

web/templates/pages/list_access_keys.php

@@ -98,11 +98,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d Access Key", "%d Access Keys", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d Access Key", "%d Access Keys", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_backup.php

@@ -121,11 +121,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d backup", "%d backups", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d backup", "%d backups", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_backup_detail.php

@@ -236,13 +236,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right total clearfix">
-				<?php printf(ngettext('%d item', '%d items', $i),$i); ?>
-			</div>
-			<div class="l-unit__col l-unit__col--right back clearfix">
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext('%d item', '%d items', $i),$i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_backup_exclusions.php

@@ -53,10 +53,4 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right total clearfix">
-			</div>
-		</div>
-	</div>
 </footer>

web/templates/pages/list_cron.php

@@ -145,11 +145,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d cron job", "%d cron jobs", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d cron job", "%d cron jobs", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_db.php

@@ -189,11 +189,9 @@ if (!empty($_SESSION["DB_PGA_ALIAS"])) {
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d SQL database", "%d SQL databases", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d SQL database", "%d SQL databases", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_dns.php

@@ -157,11 +157,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext('%d DNS zone', '%d DNS zones', $i),$i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext('%d DNS zone', '%d DNS zones', $i),$i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_dns_rec.php

@@ -138,13 +138,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right total clearfix">
-				<?php printf(ngettext("%d DNS record", "%d DNS records", $i), $i); ?>
-			</div>
-			<div class="l-unit__col l-unit__col--right back clearfix">
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d DNS record", "%d DNS records", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_firewall.php

@@ -133,11 +133,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext('%d firewall rule', '%d firewall rules', $i),$i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext('%d firewall rule', '%d firewall rules', $i),$i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_firewall_banlist.php

@@ -73,19 +73,15 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php
-					if ( $i == 0) {
-						echo _('There are currently no banned IP addresses.');
-					} else {
-						printf(ngettext('%d banned IP address', '%d banned IP addresses', $i),$i);
-					}
-				?>
-			</div>
-			<div class="l-unit__col l-unit__col--right back clearfix">
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php
+				if ( $i == 0) {
+					echo _('There are currently no banned IP addresses.');
+				} else {
+					printf(ngettext('%d banned IP address', '%d banned IP addresses', $i),$i);
+				}
+			?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_firewall_ipset.php

@@ -79,19 +79,15 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php
-					if ( $i == 0) {
-						echo _('There are currently no IP lists defined.');
-					} else {
-						printf(ngettext('%d Ipset list', '%d Ipset lists', $i),$i);
-					}
-				?>
-			</div>
-			<div class="l-unit__col l-unit__col--right back clearfix">
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php
+				if ( $i == 0) {
+					echo _('There are currently no IP lists defined.');
+				} else {
+					printf(ngettext('%d Ipset list', '%d Ipset lists', $i),$i);
+				}
+			?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_ip.php

@@ -98,11 +98,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d IP address", "%d IP addresses", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d IP address", "%d IP addresses", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_key.php

@@ -59,11 +59,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext('%d SSH Key', '%d SSH Keys', $i),$i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext('%d SSH Key', '%d SSH Keys', $i),$i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_log.php

@@ -96,11 +96,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext('%d log record', '%d log records', $i),$i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext('%d log record', '%d log records', $i),$i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_log_auth.php

@@ -83,11 +83,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit_col l-unit_col--right clearfix">
-				<?php printf(ngettext("%d log record", "%d log records", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d log record", "%d log records", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_mail.php

@@ -219,11 +219,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext('%d mail domain', '%d mail domains', $i),$i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext('%d mail domain', '%d mail domains', $i),$i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_mail_acc.php

@@ -196,13 +196,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d mail account", "%d mail accounts", $i), $i); ?>
-			</div>
-			<div class="l-unit__col l-unit__col--right back clearfix">
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d mail account", "%d mail accounts", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_mail_dns.php

@@ -113,12 +113,4 @@ if (!empty($_SESSION["WEBMAIL_ALIAS"])) {
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-			</div>
-			<div class="l-unit__col l-unit__col--right back clearfix">
-			</div>
-		</div>
-	</div>
 </footer>

web/templates/pages/list_packages.php

@@ -213,11 +213,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d package", "%d packages", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d package", "%d packages", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_rrd.php

@@ -34,5 +34,4 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container"></div>
 </footer>

web/templates/pages/list_search.php

@@ -158,11 +158,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext('%d object', '%d objects', $i),$i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext('%d object', '%d objects', $i),$i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_server_preview.php

@@ -36,9 +36,4 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right"></div>
-		</div>
-	</div>
 </footer>

web/templates/pages/list_services.php

@@ -178,10 +178,4 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--left clearfix"></div>
-			<div class="l-unit__col l-unit__col--right"></div>
-		</div>
-	</div>
 </footer>

web/templates/pages/list_stats.php

@@ -224,11 +224,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d month", "%d months", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d month", "%d months", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_updates.php

@@ -74,5 +74,4 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container"></div>
 </footer>

web/templates/pages/list_user.php

@@ -179,11 +179,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d user account", "%d user accounts", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d user account", "%d user accounts", $i), $i); ?>
+		</p>
 	</div>
 </footer>

web/templates/pages/list_web.php

@@ -242,11 +242,9 @@
 </div>
 
 <footer class="app-footer">
-	<div class="container">
-		<div class="l-unit-ft">
-			<div class="l-unit__col l-unit__col--right">
-				<?php printf(ngettext("%d web domain", "%d web domains", $i), $i); ?>
-			</div>
-		</div>
+	<div class="container app-footer-inner">
+		<p>
+			<?php printf(ngettext("%d web domain", "%d web domains", $i), $i); ?>
+		</p>
 	</div>
 </footer>