Fixed ban messages on the mobile site not being displayed.

src/middleware/auth.js

@@ -65,13 +65,28 @@ async function auth(request, response, next) {
 		// This includes ban checks for both Juxt specifically and the account server, ideally this should be squashed
 		// assuming we support more gradual bans on PNID's
 		if (user && (user.account_status < 0 || user.account_status > 1 || request.user.accessLevel < 0)) {
-			response.render(request.directory + '/partials/ban_notification.ejs', {
-				user: user,
-				moment: moment,
-				cdnURL: config.CDN_domain,
-				lang: request.lang,
-				pid: request.pid
-			});
+			if (includes(request, 'juxt')) {
+				let banMessage = '';
+				switch (user.account_status) {
+					case 2:
+						banMessage = `${request.user.username} has been banned until: ${ moment(user.ban_lift_date) }. \n\nReason: ${user.ban_reason}. \n\nIf you have any questions contact the developers in the Discord server.`;
+						break;
+					case 3:
+						banMessage = `${request.user.username} has been banned forever. \n\nReason: ${user.ban_reason}. \n\nIf you have any questions contact the developers in the Discord server.`;
+						break;
+					default:
+						banMessage = `${request.user.username} has been banned. \n\nIf you have any questions contact the developers in the Discord server.`;
+				}
+				return response.render('web/login.ejs', {toast: banMessage, cdnURL: config.CDN_domain,});
+			} else {
+				response.render(request.directory + '/partials/ban_notification.ejs', {
+					user: user,
+					moment: moment,
+					cdnURL: config.CDN_domain,
+					lang: request.lang,
+					pid: request.pid
+				});
+			}
 		}
 	}
 

src/webfiles/web/css/login.css

@@ -156,18 +156,20 @@ form.account.register div:last-child {
 
 #toast {
     opacity: 0;
-    min-width: 250px;
-    margin-left: -141px;
-    background-color: #A9375B;
-    color: var(--text);
-    text-align: center;
-    position: fixed;
-    z-index: 10;
-    left: 50%;
-    bottom: 5em;
-    border-radius: 1em;
-    padding: 1ch;
-    transition: all 0.5s ease;
+	min-width: 250px;
+	background-color: #A9375B;
+	color: var(--text);
+	text-align: center;
+	position: fixed;
+	z-index: 10;
+	left: 50%;
+	bottom: 5em;
+	border-radius: 1em;
+	padding: 1ch;
+	transition: all 0.5s ease;
+	transform: translate(-50%);
+	max-width: 80%;
+	white-space: break-spaces;
 }
 
 #toast.show {

src/webfiles/web/login.ejs

@@ -92,10 +92,10 @@
         let x = document.getElementById("toast");
         x.innerText = text;
         x.className = "show";
-        setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
+        setTimeout(function(){ x.className = x.className.replace("show", ""); }, 10000);
     }
     <%if(toast) {%>
-        Toast("<%=toast%>");
+        Toast(`<%=toast%>`);
     <%}%>
 </script>
 </body></html>