From 38324ef14ff08c17c004aef3108243ba9749b58f Mon Sep 17 00:00:00 2001
From: =?utf8?q?Tim=20D=C3=BCsterhus?= <duesterhus@woltlab.com>
Date: Tue, 27 Apr 2021 11:33:55 +0200
Subject: [PATCH] Fix table containing TOTP devices overflowing the viewport on
 mobile

---
 .../__multifactorTotpDevicesContainer.tpl     | 38 ++++++++++---------
 1 file changed, 20 insertions(+), 18 deletions(-)

diff --git a/com.woltlab.wcf/templates/__multifactorTotpDevicesContainer.tpl b/com.woltlab.wcf/templates/__multifactorTotpDevicesContainer.tpl
index a7238b297d..22848ac2d8 100644
--- a/com.woltlab.wcf/templates/__multifactorTotpDevicesContainer.tpl
+++ b/com.woltlab.wcf/templates/__multifactorTotpDevicesContainer.tpl
@@ -14,24 +14,26 @@
 		{/if}
 	{/if}
 	
-	<table class="table table-responsive">
-		<thead>
-			<tr>
-				<th class="columnText">{lang}wcf.user.security.multifactor.totp.deviceName{/lang}</th>
-				<th class="columnText">{lang}wcf.user.security.multifactor.totp.createTime{/lang}</th>
-				<th class="columnText">{lang}wcf.user.security.multifactor.totp.useTime{/lang}</th>
-				<th></th>
-			</tr>
-		</thead>
-		
-		<tbody>
-			{foreach from=$container item='child'}
-				{if $child->isAvailable()}
-					{@$child->getHtml()}
-				{/if}
-			{/foreach}
-		</tbody>
-	</table>
+	<div class="tabularBox">
+		<table class="table">
+			<thead>
+				<tr>
+					<th class="columnText">{lang}wcf.user.security.multifactor.totp.deviceName{/lang}</th>
+					<th class="columnText">{lang}wcf.user.security.multifactor.totp.createTime{/lang}</th>
+					<th class="columnText">{lang}wcf.user.security.multifactor.totp.useTime{/lang}</th>
+					<th></th>
+				</tr>
+			</thead>
+			
+			<tbody>
+				{foreach from=$container item='child'}
+					{if $child->isAvailable()}
+						{@$child->getHtml()}
+					{/if}
+				{/foreach}
+			</tbody>
+		</table>
+	</div>
 </section>
 
 {include file='__formContainerDependencies'}
-- 
2.20.1