Fix logout button styling on mobile

less/header.less

@@ -421,7 +421,8 @@ label.dropdown-toggle {
 	}
 }
 
-.dropdown-menu > li > form > button {
+.dropdown-menu > li > form {
+	> button, > .btn-link {
 		text-align: left;
 		width: 100%;
 		background: none;
@@ -441,6 +442,7 @@ label.dropdown-toggle {
 			background-color: @dropdown-link-hover-bg;
 		}
 	}
+}
 
 html[data-dir="rtl"] {
 	.dropdown-menu > li > form > button {

less/mobile.less

@@ -63,14 +63,14 @@
 		background-color: #1D1F20;
 		background-image: linear-gradient(145deg, #1D1F20, #404348);
 
-		a {
+		a, button {
 			color: #fff;
 			text-decoration: none;
-		}
 
-		a:hover {
+			&:hover {
 				text-decoration: underline;
 			}
+		}
 
 		.chat-list {
 			max-height: 100%;
@@ -190,16 +190,18 @@
 		margin: 10px 0;
 		list-style: none;
 
-		a {
+		a, button {
 			display: block;
 			padding: 10px 20px;
-		}
+			text-align: left;
+			width: 100%;
 
-		a:hover {
+			&:hover {
 				background-color: rgba(255, 255, 255, 0.1);
 				text-decoration: none;
 			}
 		}
+	}
 
 	.slideout-panel {
 		position: relative;

templates/partials/menu.tpl

@@ -127,7 +127,9 @@
 								<form method="post" action="{relative_path}/logout">
 									<input type="hidden" name="_csrf" value="{config.csrf_token}">
 									<input type="hidden" name="noscript" value="true">
-									<button type="submit"><i class="fa fa-fw fa-sign-out"></i><span> [[global:logout]]</span></button>
+									<button type="submit" class="btn btn-link">
+										<i class="fa fa-fw fa-sign-out"></i><span> [[global:logout]]</span>
+									</button>
 								</form>
 							</li>
 						</ul>