nodebb-theme-persona 12.1.6 → 12.1.8

package/templates/account/categories.tpl

@@ -3,21 +3,21 @@
 
 	<div class="row">
 		<h1>{title}</h1>
-		<div class="col-lg-12 mb-2">
+		<div class="col-lg-12">
 			<div class="btn-group bottom-sheet" component="category/watch/all">
-				<button class="btn btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown" type="button">
+				<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" type="button">
 					<span>[[user:change_all]]</span>
 					<span class="caret"></span>
 				</button>
 				<ul class="dropdown-menu">
-					<li><a class="dropdown-item" href="#" component="category/watching" data-state="watching"><i class="fa fa-fw fa-inbox"></i> [[category:watching]]<p class="help-text"><small>[[category:watching.description]]</small></p></a></li>
-					<li><a class="dropdown-item" href="#" component="category/notwatching" data-state="notwatching"><i class="fa fa-fw fa-clock-o"></i> [[category:not-watching]]<p class="help-text"><small>[[category:not-watching.description]]</small></p></a></li>
-					<li><a class="dropdown-item" href="#" component="category/ignoring" data-state="ignoring"><i class="fa fa-fw fa-eye-slash"></i> [[category:ignoring]]<p class="help-text"><small>[[category:ignoring.description]]</small></p></a></li>
+					<li><a href="#" component="category/watching" data-state="watching"><i class="fa fa-fw fa-inbox"></i> [[category:watching]]<p class="help-text"><small>[[category:watching.description]]</small></p></a></li>
+					<li><a href="#" component="category/notwatching" data-state="notwatching"><i class="fa fa-fw fa-clock-o"></i> [[category:not-watching]]<p class="help-text"><small>[[category:not-watching.description]]</small></p></a></li>
+					<li><a href="#" component="category/ignoring" data-state="ignoring"><i class="fa fa-fw fa-eye-slash"></i> [[category:ignoring]]<p class="help-text"><small>[[category:ignoring.description]]</small></p></a></li>
 				</ul>
 			</div>
 		</div>
 		<div class="col-lg-12">
-			<ul class="categories list-unstyled" itemscope itemtype="http://www.schema.org/ItemList">
+			<ul class="categories" itemscope itemtype="http://www.schema.org/ItemList">
 				{{{each categories}}}
 				<!-- IMPORT partials/account/category-item.tpl -->
 				{{{end}}}

package/templates/account/consent.tpl

@@ -10,7 +10,7 @@
 		<div class="col-sm-6">
 			<!-- IF gdpr_consent -->
 			<div class="alert alert-success">
-				<i class="fa fa-check float-end fa-3x"></i>
+				<i class="fa fa-check pull-right fa-3x"></i>
 				[[user:consent.received]]
 			</div>
 			<!-- ELSE -->
@@ -22,8 +22,8 @@
 				</div>
 			</div>
 			<!-- END -->
-			<div class="card">
-				<div class="card-body">
+			<div class="panel panel-default">
+				<div class="panel-body">
 					<p>[[user:consent.email_intro]]</p>
 					<!-- IF digest.enabled -->
 					<p>[[user:consent.digest_frequency, {digest.frequency}]]</p>
@@ -32,7 +32,7 @@
 					<!-- END -->
 
 					<div class="text-center">
-						<a class="btn btn-outline-secondary" href="./settings">
+						<a class="btn btn-default" href="./settings">
 							<i class="fa fa-cog"></i>
 							[[pages:account/settings]]
 						</a>
@@ -41,8 +41,8 @@
 			</div>
 		</div>
 		<div class="col-sm-6">
-			<div class="card">
-				<div class="card-body">
+			<div class="panel panel-default">
+				<div class="panel-body">
 					<p><strong>[[user:consent.right_of_access]]</strong></p>
 					<p>[[user:consent.right_of_access_description]]</p>
 					<p><strong>[[user:consent.right_to_rectification]]</strong></p>
@@ -52,14 +52,14 @@
 					<p><strong>[[user:consent.right_to_data_portability]]</strong></p>
 					<p>[[user:consent.right_to_data_portability_description]]</p>
 
-					<div class="btn-group-vertical d-grid">
-						<a data-action="export-profile" class="btn btn-outline-secondary">
+					<div class="btn-group-vertical btn-block">
+						<a data-action="export-profile" class="btn btn-default">
 							<i class="fa fa-download"></i> [[user:consent.export_profile]]
 						</a>
-						<a data-action="export-posts" class="btn btn-outline-secondary">
+						<a data-action="export-posts" class="btn btn-default">
 							<i class="fa fa-download"></i> [[user:consent.export_posts]]
 						</a>
-						<a data-action="export-uploads" class="btn btn-outline-secondary">
+						<a data-action="export-uploads" class="btn btn-default">
 							<i class="fa fa-download"></i> [[user:consent.export_uploads]]
 						</a>
 					</div>

package/templates/account/edit/password.tpl

@@ -5,24 +5,26 @@
 		<!-- disables autocomplete on FF --><input type="password" style="display:none">
 
 		<!-- IF isSelf -->
-		<div class="mb-2">
-			<label class="form-label fw-bold" for="inputCurrentPassword">[[user:current_password]]</label>
-			<input autocomplete="off" class="form-control" type="password" id="inputCurrentPassword" placeholder="[[user:current_password]]" value=""<!-- IF !hasPassword --> disabled<!-- ENDIF !hasPassword -->>
+		<div class="form-group">
+			<label class="control-label" for="inputCurrentPassword">[[user:current_password]]</label>
+			<div class="controls">
+				<input autocomplete="off" class="form-control" type="password" id="inputCurrentPassword" placeholder="[[user:current_password]]" value=""<!-- IF !hasPassword --> disabled<!-- ENDIF !hasPassword -->>
+			</div>
 		</div>
 		<!-- ENDIF isSelf -->
 
-		<div class="mb-2">
-			<label class="form-label fw-bold" for="inputNewPassword">[[user:new_password]]</label>
+		<div class="form-group">
+			<label class="control-label" for="inputNewPassword">[[user:password]]</label>
 			<input class="form-control" type="password" id="inputNewPassword" placeholder="[[user:password]]" value="">
 			<span class="form-feedback" id="password-notify"></span>
 		</div>
 
-		<div class="mb-2">
-			<label class="form-label fw-bold" for="inputNewPasswordAgain">[[user:confirm_password]]</label>
+		<div class="form-group">
+			<label class="control-label" for="inputNewPasswordAgain">[[user:confirm_password]]</label>
 			<input class="form-control" type="password" id="inputNewPasswordAgain" placeholder="[[user:confirm_password]]" value="">
 			<span class="form-feedback" id="password-confirm-notify"></span>
 		</div>
-
+		
 		<div class="form-actions">
 			<button id="changePasswordBtn" class="btn btn-primary btn-block"><i class="hide fa fa-spinner fa-spin"></i> [[user:change_password]]</button>
 		</div>

package/templates/account/edit/username.tpl

@@ -2,17 +2,21 @@
 	<!-- IMPORT partials/account/header.tpl -->
 
 	<form class="form-horizontal edit-form">
-		<div class="mb-2">
-			<label class="form-label fw-bold" for="inputNewUsername">[[user:username]]</label>
-			<input class="form-control" type="text" id="inputNewUsername" placeholder="[[user:username]]" value="{username}">
+		<div class="control-group">
+			<label class="control-label" for="inputNewUsername">[[user:username]]</label>
+			<div class="controls">
+				<input class="form-control" type="text" id="inputNewUsername" placeholder="[[user:username]]" value="{username}">
+			</div>
 		</div>
 
 		<!-- disables autocomplete on FF --><input type="password" style="display:none">
 
 		<!-- IF isSelf -->
-		<div class="mb-2">
-			<label class="form-label fw-bold" for="inputCurrentPassword">[[user:current_password]]</label>
-			<input autocomplete="off" class="form-control" type="password" id="inputCurrentPassword" placeholder="[[user:current_password]]" value=""<!-- IF !hasPassword --> disabled<!-- ENDIF !hasPassword -->>
+		<div class="control-group">
+			<label class="control-label" for="inputCurrentPassword">[[user:current_password]]</label>
+			<div class="controls">
+				<input autocomplete="off" class="form-control" type="password" id="inputCurrentPassword" placeholder="[[user:current_password]]" value=""<!-- IF !hasPassword --> disabled<!-- ENDIF !hasPassword -->>
+			</div>
 		</div>
 		<!-- ENDIF isSelf -->
 

package/templates/account/edit.tpl

@@ -2,18 +2,18 @@
 	<!-- IMPORT partials/account/header.tpl -->
 	<!-- IF sso.length --><div><!-- ENDIF sso.length -->
 		<div class="row">
-			<div class="col-md-3 col-sm-4">
+			<div class="col-md-2 col-sm-4">
 				<div class="account-picture-block text-center">
-					<div class="row mb-3">
-						<div class="col-12 hidden-xs">
+					<div class="row">
+						<div class="col-xs-12 hidden-xs">
 							<!-- IF picture -->
-							<img id="user-current-picture" class="avatar avatar-rounded" style="--avatar-size: 128px;" src="{picture}" />
+							<img id="user-current-picture" class="avatar avatar-xl avatar-rounded" src="{picture}" />
 							<!-- ELSE -->
-							<div class="avatar avatar-rounded" style="background-color: {icon:bgColor}; --avatar-size: 128px;">{icon:text}</div>
+							<div class="avatar avatar-xl avatar-rounded" style="background-color: {icon:bgColor};">{icon:text}</div>
 							<!-- ENDIF picture -->
 						</div>
 					</div>
-					<ul class="list-group mb-3">
+					<ul class="list-group">
 						<!-- IF allowProfilePicture -->
 						<a id="changePictureBtn" href="#" class="list-group-item">[[user:change_picture]]</a>
 						<!-- ENDIF allowProfilePicture -->
@@ -50,31 +50,31 @@
 
 			<div class="<!-- IF !sso.length -->col-md-9 col-sm-8<!-- ELSE -->col-md-5 col-sm-4<!-- ENDIF !sso.length -->">
 				<form role="form" component="profile/edit/form">
-					<div class="mb-2">
-						<label class="form-label fw-bold" for="fullname">[[user:fullname]]</label>
+					<div class="form-group">
+						<label for="fullname">[[user:fullname]]</label>
 						<input class="form-control" type="text" id="fullname" name="fullname" placeholder="[[user:fullname]]" value="{fullname}">
 					</div>
 					<!-- IF allowWebsite -->
-					<div class="mb-2">
-						<label class="form-label fw-bold" for="website">[[user:website]]</label>
+					<div class="form-group">
+						<label for="website">[[user:website]]</label>
 						<input class="form-control" type="text" id="website" name="website" placeholder="http://..." value="{website}">
 					</div>
 					<!-- ENDIF allowWebsite -->
 
-					<div class="mb-2">
-						<label class="form-label fw-bold" for="location">[[user:location]]</label>
+					<div class="form-group">
+						<label for="location">[[user:location]]</label>
 						<input class="form-control" type="text" id="location" name="location" placeholder="[[user:location]]" value="{location}">
 					</div>
 
-					<div class="mb-2">
-						<label class="form-label fw-bold" for="birthday">[[user:birthday]]</label>
+					<div class="form-group">
+						<label for="birthday">[[user:birthday]]</label>
 						<input class="form-control" type="date" id="birthday" name="birthday" value="{birthday}" placeholder="mm/dd/yyyy">
 					</div>
 
-					<div class="mb-2">
-						<label class="form-label fw-bold" for="groupTitle">[[user:grouptitle]]</label>
+					<div class="form-group">
+						<label for="groupTitle">[[user:grouptitle]]</label>
 
-						<select class="form-select" id="groupTitle" name="groupTitle" <!-- IF allowMultipleBadges --> size="{groupSelectSize}" multiple<!-- ENDIF allowMultipleBadges -->>
+						<select class="form-control" id="groupTitle" name="groupTitle" <!-- IF allowMultipleBadges --> size="{groupSelectSize}" multiple<!-- ENDIF allowMultipleBadges -->>
 							<option value="">[[user:no-group-title]]</option>
 							{{{each groups}}}
 							<!-- IF groups.userTitleEnabled -->
@@ -89,16 +89,16 @@
 					</div>
 
 					<!-- IF allowAboutMe -->
-					<div class="mb-2">
-						<label class="form-label fw-bold" for="aboutme">[[user:aboutme]]</label> <small><label id="aboutMeCharCountLeft"></label></small>
+					<div class="form-group">
+						<label for="aboutme">[[user:aboutme]]</label> <small><label id="aboutMeCharCountLeft"></label></small>
 						<textarea class="form-control" id="aboutme" name="aboutme" rows="5">{aboutme}</textarea>
 					</div>
 					<!-- ENDIF allowAboutMe -->
 
 					<!-- IF allowSignature -->
 					<!-- IF !disableSignatures -->
-					<div class="mb-2">
-						<label class="form-label fw-bold" for="signature">[[user:signature]]</label> <small><label id="signatureCharCountLeft"></label></small>
+					<div class="form-group">
+						<label for="signature">[[user:signature]]</label> <small><label id="signatureCharCountLeft"></label></small>
 						<textarea class="form-control" id="signature" name="signature" rows="5">{signature}</textarea>
 					</div>
 					<!-- ENDIF !disableSignatures -->
@@ -111,13 +111,13 @@
 			</div>
 
 			<!-- IF sso.length -->
-			<div class="col-md-4 col-sm-4">
+			<div class="col-md-5 col-sm-4">
 				<label>[[user:sso.title]]</label>
 				<div class="list-group">
 					{{{each sso}}}
 					<div class="list-group-item">
 						<!-- IF ../deauthUrl -->
-						<a data-component="{../component}" class="btn btn-outline-secondary btn-sm float-end" href="{../deauthUrl}">[[user:sso.dissociate]]</a>
+						<a data-component="{../component}" class="btn btn-default btn-xs pull-right" href="{../deauthUrl}">[[user:sso.dissociate]]</a>
 						<!-- END -->
 						<a data-component="{../component}" href="{../url}" target="<!-- IF ../associated -->_blank<!-- ELSE -->_top<!-- ENDIF ../associated -->">
 							<!-- IF ../icon --><i class="fa {../icon}"></i><!-- ENDIF ../icon -->

package/templates/account/followers.tpl

@@ -2,16 +2,16 @@
 	<!-- IMPORT partials/account/header.tpl -->
 
 	<div class="users row">
-		<div class="col-12">
 		<h1>[[pages:{template.name}, {username}]]</h1>
 
-		<!-- IMPORT partials/users_list.tpl -->
+		<ul id="users-container" class="users-container" data-nextstart="{nextStart}">
+			<!-- IMPORT partials/users_list.tpl -->
+		</ul>
 
 		<!-- IF !users.length -->
 		<div class="alert alert-warning text-center">[[user:has_no_follower]]</div>
 		<!-- ENDIF !users.length -->
 
 		<!-- IMPORT partials/paginator.tpl -->
-		</div>
 	</div>
 </div>

package/templates/account/following.tpl

@@ -2,16 +2,16 @@
 	<!-- IMPORT partials/account/header.tpl -->
 
 	<div class="users row">
-		<div class="col-12">
 		<h1>[[pages:{template.name}, {username}]]</h1>
 
-		<!-- IMPORT partials/users_list.tpl -->
+		<ul id="users-container" class="users-container" data-nextstart="{nextStart}">
+			<!-- IMPORT partials/users_list.tpl -->
+		</ul>
 
 		<!-- IF !users.length -->
 		<div class="alert alert-warning text-center">[[user:follows_no_one]]</div>
 		<!-- ENDIF !users.length -->
 
 		<!-- IMPORT partials/paginator.tpl -->
-		</div>
 	</div>
 </div>

package/templates/account/groups.tpl

@@ -3,8 +3,8 @@
 
 	<div class="row">
 		<h1>[[pages:{template.name}, {username}]]</h1>
-
-		<div class="col-12 groups list">
+		
+		<div class="groups list">
 			<div component="groups/container" id="groups-list" class="row">
 				<!-- IF !groups.length -->
 				<div class="alert alert-warning text-center">[[groups:no_groups_found]]</div>

package/templates/account/info.tpl

@@ -2,16 +2,16 @@
 	<!-- IMPORT partials/account/header.tpl -->
 
 	<!-- IF sessions.length -->
-	<div class="row mb-3">
-		<div class="col-12 col-md-12">
+	<div class="row">
+		<div class="col-xs-12 col-md-12">
 			<h4>[[global:sessions]]</h4>
 			<ul class="list-group" component="user/sessions">
 				{{{each sessions}}}
 				<li class="list-group-item" data-uuid="{../uuid}">
-					<div class="float-end">
+					<div class="pull-right">
 						<!-- IF isSelfOrAdminOrGlobalModerator -->
 						<!-- IF !../current -->
-						<button class="btn btn-sm btn-outline-secondary" type="button" data-action="revokeSession">Revoke Session</button>
+						<button class="btn btn-xs btn-default" type="button" data-action="revokeSession">Revoke Session</button>
 						<!-- ENDIF !../current -->
 						<!-- ENDIF isSelfOrAdminOrGlobalModerator -->
 						{function.userAgentIcons}
@@ -31,11 +31,11 @@
 
 	<div class="row">
 		<div class="col-sm-6">
-			<div class="card mb-3">
-				<h5 class="card-header">
-					[[global:recentips]]
-				</h5>
-				<div class="card-body">
+			<div class="panel panel-default">
+				<div class="panel-heading">
+					<h3 class="panel-title">[[global:recentips]]</h3>
+				</div>
+				<div class="panel-body">
 					<ul>
 						{{{each ips}}}
 						<li>{@value}</li>
@@ -44,32 +44,32 @@
 				</div>
 			</div>
 
-			<div class="card mb-3">
-				<h5 class="card-header">
-					[[user:info.username-history]]
-				</h5>
-				<div class="card-body">
+			<div class="panel panel-default">
+				<div class="panel-heading">
+					<h3 class="panel-title">[[user:info.username-history]]</h3>
+				</div>
+				<div class="panel-body">
 					<ul class="list-group">
 						{{{each usernames}}}
 						<li class="list-group-item">
 							{../value}
-							<small class="float-end"><span class="timeago" title="{../timestampISO}"></span></small>
+							<small class="pull-right"><span class="timeago" title="{../timestampISO}"></span></small>
 						</li>
 						{{{end}}}
 					</ul>
 				</div>
 			</div>
 
-			<div class="card">
-				<h5 class="card-header">
-					[[user:info.email-history]]
-				</h5>
-				<div class="card-body">
+			<div class="panel panel-default">
+				<div class="panel-heading">
+					<h3 class="panel-title">[[user:info.email-history]]</h3>
+				</div>
+				<div class="panel-body">
 					<ul class="list-group">
 						{{{each emails}}}
 						<li class="list-group-item">
 							{../value}
-							<small class="float-end"><span class="timeago" title="{../timestampISO}"></span></small>
+							<small class="pull-right"><span class="timeago" title="{../timestampISO}"></span></small>
 						</li>
 						{{{end}}}
 					</ul>
@@ -77,13 +77,13 @@
 			</div>
 		</div>
 		<div class="col-sm-6">
-			<div class="card mb-3">
-				<h5 class="card-header">
-					[[user:info.latest-flags]]
-				</h5>
-				<div class="card-body">
+			<div class="panel panel-default">
+				<div class="panel-heading">
+					<h3 class="panel-title">[[user:info.latest-flags]]</h3>
+				</div>
+				<div class="panel-body">
 					<!-- IF history.flags.length -->
-					<ul class="recent-flags list-unstyled">
+					<ul class="recent-flags">
 						{{{each history.flags}}}
 						<li>
 							<p>
@@ -103,27 +103,30 @@
 				</div>
 			</div>
 
-			<div class="card mb-3">
-				<h5 class="card-header">
-					[[user:info.ban-history]]
+			<div class="panel panel-default">
+				<div class="panel-heading">
+					<h3 class="panel-title">
 
-					<!-- IF !banned -->
-					<!-- IF !isSelf -->
-					<button class="btn btn-sm float-end btn-danger" component="account/ban">[[user:ban_account]]</button>
-					<!-- ENDIF !isSelf -->
-					<!-- ELSE -->
-					<!-- IF !isSelf -->
-					<button class="btn btn-sm float-end btn-success" component="account/unban">[[user:unban_account]]</button>
-					<!-- ENDIF !isSelf -->
-					<!-- ENDIF !banned -->
-				</h5>
-				<div class="card-body">
+						[[user:info.ban-history]]
+
+						<!-- IF !banned -->
+						<!-- IF !isSelf -->
+						<button class="btn btn-xs pull-right btn-danger" component="account/ban">[[user:ban_account]]</button>
+						<!-- ENDIF !isSelf -->
+						<!-- ELSE -->
+						<!-- IF !isSelf -->
+						<button class="btn btn-xs pull-right btn-success" component="account/unban">[[user:unban_account]]</button>
+						<!-- ENDIF !isSelf -->
+						<!-- ENDIF !banned -->
+					</h3>
+				</div>
+				<div class="panel-body">
 					<!-- IF history.bans.length -->
-					<ul class="ban-history list-unstyled">
+					<ul class="ban-history">
 						{{{each history.bans}}}
 						<li>
 							<p>
-								<a href="{config.relative_path}/user/{history.bans.user.userslug}">{buildAvatar(history.bans.user, "24px", true)}</a>
+								<a href="{config.relative_path}/user/{history.bans.user.userslug}">{buildAvatar(history.bans.user, "sm", true)}</a>
 								<strong>
 									<a href="<!-- IF history.bans.user.userslug -->{config.relative_path}/user/{history.bans.user.userslug}<!-- ELSE -->#<!-- ENDIF history.bans.user.userslug -->" itemprop="author" data-username="{history.bans.user.username}" data-uid="{history.bans.user.uid}">{history.bans.user.username}</a>
 								</strong>
@@ -144,27 +147,29 @@
 				</div>
 			</div>
 
-			<div class="card mb-3">
-				<h5 class="card-header">
-					[[user:info.mute-history]]
+			<div class="panel panel-default">
+				<div class="panel-heading">
+					<h3 class="panel-title">
+						[[user:info.mute-history]]
 
-					{{{ if !muted }}}
-					{{{ if !isSelf }}}
-					<button class="btn btn-sm float-end btn-danger" component="account/mute">[[user:mute_account]]</button>
-					{{{ end }}}
-					{{{ else }}}
-					{{{ if !isSelf }}}
-					<button class="btn btn-sm float-end btn-success" component="account/unmute">[[user:unmute_account]]</button>
-					{{{ end }}}
-					{{{ end }}}
-				</h5>
-				<div class="card-body">
+						{{{ if !muted }}}
+						{{{ if !isSelf }}}
+						<button class="btn btn-xs pull-right btn-danger" component="account/mute">[[user:mute_account]]</button>
+						{{{ end }}}
+						{{{ else }}}
+						{{{ if !isSelf }}}
+						<button class="btn btn-xs pull-right btn-success" component="account/unmute">[[user:unmute_account]]</button>
+						{{{ end }}}
+						{{{ end }}}
+					</h3>
+				</div>
+				<div class="panel-body">
 					{{{ if history.mutes.length }}}
-					<ul class="ban-history list-unstyled">
+					<ul class="ban-history">
 						{{{ each history.mutes }}}
 						<li>
 							<p>
-								<a href="{config.relative_path}/user/{history.mutes.user.userslug}">{buildAvatar(history.mutes.user, "24px", true)}</a>
+								<a href="{config.relative_path}/user/{history.mutes.user.userslug}">{buildAvatar(history.mutes.user, "sm", true)}</a>
 								<strong>
 									<a href="<!-- IF history.mutes.user.userslug -->{config.relative_path}/user/{history.mutes.user.userslug}<!-- ELSE -->#<!-- ENDIF history.mutes.user.userslug -->" itemprop="author" data-username="{history.mutes.user.username}" data-uid="{history.mutes.user.uid}">{history.mutes.user.username}</a>
 								</strong>
@@ -185,22 +190,22 @@
 			</div>
 
 			<!-- IF isAdminOrGlobalModerator -->
-			<div class="card">
-				<h5 class="card-header">
-					[[user:info.moderation-note]]
-				</h5>
-				<div class="card-body">
+			<div class="panel panel-default">
+				<div class="panel-heading">
+					<h3 class="panel-title">[[user:info.moderation-note]]</h3>
+				</div>
+				<div class="panel-body">
 					<textarea component="account/moderation-note" class="form-control"></textarea>
 					<br/>
-					<button class="btn btn-sm float-end btn-success" component="account/save-moderation-note">[[user:info.moderation-note.add]]</button>
+					<button class="btn btn-sm pull-right btn-success" component="account/save-moderation-note">[[user:info.moderation-note.add]]</button>
 					<br/>
 					<div component="account/moderation-note/list">
 						{{{each moderationNotes}}}
 						<hr/>
 
 						<div class="clearfix">
-							<div class="float-start">
-								<a href="<!-- IF moderationNotes.user.userslug -->{config.relative_path}/user/{moderationNotes.user.userslug}<!-- ELSE -->#<!-- ENDIF moderationNotes.user.userslug -->">{buildAvatar(moderationNotes.user, "24px", true)}</a>
+							<div class="pull-left">
+								<a href="<!-- IF moderationNotes.user.userslug -->{config.relative_path}/user/{moderationNotes.user.userslug}<!-- ELSE -->#<!-- ENDIF moderationNotes.user.userslug -->">{buildAvatar(moderationNotes.user, "sm", true)}</a>
 								<strong>
 									<a href="<!-- IF moderationNotes.user.userslug -->{config.relative_path}/user/{moderationNotes.user.userslug}<!-- ELSE -->#<!-- ENDIF moderationNotes.user.userslug -->" itemprop="author" data-username="{moderationNotes.user.username}" data-uid="{moderationNotes.user.uid}">{moderationNotes.user.username}</a>
 								</strong>

package/templates/account/posts.tpl

@@ -8,7 +8,7 @@
 			<div class="alert alert-warning text-center">{noItemsFoundKey}</div>
 		<!-- ENDIF !posts.length -->
 
-		<div class="col-12">
+		<div class="col-xs-12">
 			<!-- IMPORT partials/posts_list.tpl -->
 
 			<!-- IF config.usePagination -->