nodebb-theme-harmony 1.0.0-beta.6 → 1.0.0-beta.61

package/templates/partials/topic/post.tpl

@@ -1,3 +1,11 @@
+{{{ if (!./index && widgets.mainpost-header.length) }}}
+<div data-widget-area="mainpost-header">
+	{{{ each widgets.mainpost-header }}}
+	{widgets.mainpost-header.html}
+	{{{ end }}}
+</div>
+{{{ end }}}
+
 <div class="d-flex align-items-start gap-3">
 	<div class="icon py-1 bg-body d-none d-sm-block">
 		<a class="d-inline-block position-relative text-decoration-none" href="{{{ if ./user.userslug }}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}">
@@ -25,14 +33,14 @@
 			{{{ end }}}
 			{{{ end }}}
 
-			<!-- IF posts.user.banned -->
+			{{{ if posts.user.banned }}}
 			<span class="badge bg-danger rounded-1">[[user:banned]]</span>
-			<!-- ENDIF posts.user.banned -->
+			{{{ end }}}
 
 			<div class="d-flex gap-1 hidden-xs align-items-center">
 				{{{ if posts.toPid }}}
 				<span class="text-muted">replied to</span><!-- FIX THIS, DOES NOT l10n PROPERLY -->
-				<a component="post/parent" data-topid="{posts.toPid}" href="{config.relative_path}/post/{posts.toPid}"><!-- IF posts.parent.username -->{posts.parent.username}<!-- ELSE -->[[global:guest]]<!-- ENDIF posts.parent.username --></a>
+				<a component="post/parent" data-topid="{posts.toPid}" href="{config.relative_path}/post/{posts.toPid}">{{{ if posts.parent.username }}}{posts.parent.username}{{{ else }}}[[global:guest]]{{{ end }}}</a>
 				{{{ else }}}
 				<span class="text-muted">wrote</span><!-- FIX THIS, DOES NOT l10n PROPERLY -->
 				{{{ end }}}
@@ -45,16 +53,17 @@
 
 			<div>
 				<span>
-					<!-- IF posts.user.custom_profile_info.length -->
+					{{{ if posts.user.custom_profile_info.length }}}
 					&#124;
-					{{{each posts.user.custom_profile_info}}}
+					{{{ each posts.user.custom_profile_info }}}
 					{posts.user.custom_profile_info.content}
-					{{{end}}}
-					<!-- ENDIF posts.user.custom_profile_info.length -->
+					{{{ end }}}
+					{{{ end }}}
 				</span>
 			</div>
 			<div class="d-flex align-items-center gap-1 flex-grow-1 justify-content-end">
 				<span class="bookmarked opacity-0 text-primary"><i class="fa fa-bookmark-o"></i></span>
+				<a href="{config.relative_path}/post/{./pid}" class="post-index text-muted d-none d-md-inline">#{increment(./index, "1")}</a>
 			</div>
 		</div>
 
@@ -74,7 +83,7 @@
 		<a component="post/reply-count" data-target-component="post/replies/container" href="#" class="d-flex gap-2 align-items-center mt-2 btn-outline border rounded-1 p-1 threaded-replies user-select-none float-start text-muted text-decoration-none {{{ if !posts.replies.count }}}hidden{{{ end }}}">
 			<span component="post/reply-count/avatars" class="avatars d-inline-flex gap-1 align-items-top {{{ if posts.replies.hasMore }}}hasMore{{{ end }}}">
 				{{{each posts.replies.users}}}
-				<span>{buildAvatar(posts.replies.users, "20px", true, "")}</span>
+				<span>{buildAvatar(posts.replies.users, "20px", true, "avatar-tooltip")}</span>
 				{{{end}}}
 				{{{ if posts.replies.hasMore}}}
 				<span><i class="fa fa-ellipsis"></i></span>
@@ -104,7 +113,7 @@
 				<i class="fa fa-chevron-up text-primary"></i>
 			</a>
 
-			<div class="d-inline-block px-3 btn-ghost-sm" component="post/vote-count" data-votes="{posts.votes}">{posts.votes}</div>
+			<div class="d-inline-block px-2 mx-1 btn-ghost-sm" component="post/vote-count" data-votes="{posts.votes}">{posts.votes}</div>
 
 			{{{ if !downvote:disabled }}}
 			<a component="post/downvote" href="#" class="btn-ghost-sm {{{ if posts.downvoted }}}downvoted{{{ end }}}">
@@ -116,4 +125,12 @@
 
 		<!-- IMPORT partials/topic/post-menu.tpl -->
 	</div>
-</div>
+</div>
+
+{{{ if (!./index && widgets.mainpost-footer.length) }}}
+<div data-widget-area="mainpost-footer">
+	{{{ each widgets.mainpost-footer }}}
+	{widgets.mainpost-footer.html}
+	{{{ end }}}
+</div>
+{{{ end }}}

package/templates/partials/topic/quickreply.tpl

@@ -1,7 +1,7 @@
-<!-- IF privileges.topics:reply -->
-<div component="topic/quickreply/container" class="quick-reply d-flex gap-3">
+{{{ if privileges.topics:reply }}}
+<div component="topic/quickreply/container" class="quick-reply d-flex gap-3 mb-4">
 	<div class="icon hidden-xs">
-		<a class="d-inline-block position-relative" href="<!-- IF loggedInUser.userslug -->{config.relative_path}/user/{loggedInUser.userslug}<!-- ELSE -->#<!-- ENDIF loggedInUser.userslug -->">
+		<a class="d-inline-block position-relative" href="{{{ if loggedInUser.userslug }}}{config.relative_path}/user/{loggedInUser.userslug}{{{ else }}}#{{{ end }}}">
 			{buildAvatar(loggedInUser, "48px", true, "", "user/picture")}
 			{{{ if loggedInUser.status }}}<span component="user/status" class="position-absolute translate-middle-y badge border border-white border-2 rounded-circle status {loggedInUser.status}"><span class="visually-hidden">[[global:{loggedInUser.status}]]</span></span>{{{ end }}}
 		</a>
@@ -14,9 +14,9 @@
 			<div class="imagedrop"><div>[[topic:composer.drag_and_drop_images]]</div></div>
 		</div>
 		<div>
-			<div class="btn-group">
+			<div class="d-flex justify-content-end gap-2">
+				<button type="submit" component="topic/quickreply/expand" class="btn btn-sm btn-outline" formmethod="get"><i class="fa fa-expand"></i></button>
 				<button type="submit" component="topic/quickreply/button" class="btn btn-sm btn-primary">[[topic:post-quick-reply]]</button>
-				<button type="submit" component="topic/quickreply/expand" class="btn btn-sm btn-primary" formmethod="get"><i class="fa fa-expand"></i></button>
 			</div>
 		</div>
 	</form>
@@ -25,4 +25,4 @@
 	</form>
 
 </div>
-<!-- ENDIF privileges.topics:reply -->
+{{{ end }}}

package/templates/partials/topic/reply-button.tpl

@@ -1,4 +1,4 @@
-<div component="topic/reply/container" class="btn-group action-bar bottom-sheet {{{ if !privileges.topics:reply }}}hidden{{{ end }}}">
+<div component="topic/reply/container" class="btn-group action-bar {{{ if !privileges.topics:reply }}}hidden{{{ end }}}">
 	<a href="{config.relative_path}/compose?tid={tid}&title={title}" class="d-flex align-items-center btn btn-sm btn-primary px-3 fw-semibold " component="topic/reply" data-ajaxify="false" role="button"><i class="fa fa-reply d-sm-block d-md-none"></i><span class="d-none d-md-block"> [[topic:reply]]</span></a>
 	<button type="button" class="btn btn-sm btn-primary dropdown-toggle" data-bs-toggle="dropdown">
 		<span class="caret"></span>

package/templates/partials/topic/topic-menu-list.tpl

@@ -1,10 +1,8 @@
-<!-- THIS FILE IS STILL PERSONA -->
-
 {{{ if privileges.editable }}}
-<li <!-- IF locked -->hidden<!-- ENDIF locked -->><a component="topic/lock" href="#" class="dropdown-item <!-- IF locked -->hidden<!-- ENDIF locked -->"><i class="fa fa-fw fa-lock"></i> [[topic:thread_tools.lock]]</a></li>
-<li <!-- IF !locked -->hidden<!-- ENDIF !locked -->><a component="topic/unlock" href="#" class="dropdown-item <!-- IF !locked -->hidden<!-- ENDIF !locked -->"><i class="fa fa-fw fa-unlock"></i> [[topic:thread_tools.unlock]]</a></li>
-<li <!-- IF pinned -->hidden<!-- ENDIF pinned -->><a component="topic/pin" href="#" class="dropdown-item <!-- IF pinned -->hidden<!-- ENDIF pinned -->"><i class="fa fa-fw fa-thumb-tack"></i> [[topic:thread_tools.pin]]</a></li>
-<li <!-- IF !pinned -->hidden<!-- ENDIF !pinned -->><a component="topic/unpin" href="#" class="dropdown-item <!-- IF !pinned -->hidden<!-- ENDIF !pinned -->"><i class="fa fa-fw fa-thumb-tack fa-rotate-90"></i> [[topic:thread_tools.unpin]]</a></li>
+<li {{{ if locked }}}hidden{{{ end }}}><a component="topic/lock" href="#" class="dropdown-item {{{ if locked }}}hidden{{{ end }}}"><i class="fa fa-fw fa-lock"></i> [[topic:thread_tools.lock]]</a></li>
+<li {{{ if !locked }}}hidden{{{ end }}}><a component="topic/unlock" href="#" class="dropdown-item {{{ if !locked }}}hidden{{{ end }}}"><i class="fa fa-fw fa-unlock"></i> [[topic:thread_tools.unlock]]</a></li>
+<li {{{ if pinned }}}hidden{{{ end }}}><a component="topic/pin" href="#" class="dropdown-item {{{ if pinned }}}hidden{{{ end }}}"><i class="fa fa-fw fa-thumb-tack"></i> [[topic:thread_tools.pin]]</a></li>
+<li {{{ if !pinned }}}hidden{{{ end }}}><a component="topic/unpin" href="#" class="dropdown-item {{{ if !pinned }}}hidden{{{ end }}}"><i class="fa fa-fw fa-thumb-tack fa-rotate-90"></i> [[topic:thread_tools.unpin]]</a></li>
 
 <li><a component="topic/move" class="dropdown-item" href="#"><i class="fa fa-fw fa-arrows"></i> [[topic:thread_tools.move]]</a></li>
 <li><a component="topic/merge" class="dropdown-item" href="#"><i class="fa fa-fw fa-code-fork"></i> [[topic:thread_tools.merge]]</a></li>
@@ -16,19 +14,19 @@
 <li class="dropdown-divider"></li>
 {{{ end }}}
 
-<!-- IF privileges.deletable -->
-<li <!-- IF deleted -->hidden<!-- ENDIF deleted -->><a component="topic/delete" href="#" class="dropdown-item <!-- IF deleted -->hidden<!-- ENDIF deleted -->"><i class="fa fa-fw fa-trash-o"></i> [[topic:thread_tools.delete]]</a></li>
+{{{ if privileges.deletable }}}
+<li {{{ if deleted }}}hidden{{{ end }}}><a component="topic/delete" href="#" class="dropdown-item {{{ if deleted }}}hidden{{{ end }}}"><i class="fa fa-fw fa-trash-o"></i> [[topic:thread_tools.delete]]</a></li>
 {{{ if !scheduled }}}
-<li <!-- IF !deleted -->hidden<!-- ENDIF !deleted -->><a component="topic/restore" href="#" class="dropdown-item <!-- IF !deleted -->hidden<!-- ENDIF !deleted -->"><i class="fa fa-fw fa-history"></i> [[topic:thread_tools.restore]]</a></li>
+<li {{{ if !deleted }}}hidden{{{ end }}}><a component="topic/restore" href="#" class="dropdown-item {{{ if !deleted }}}hidden{{{ end }}}"><i class="fa fa-fw fa-history"></i> [[topic:thread_tools.restore]]</a></li>
+{{{ end }}}
+{{{ if privileges.purge }}}
+<li {{{ if !deleted }}}hidden{{{ end }}}><a component="topic/purge" href="#" class="dropdown-item {{{ if !deleted }}}hidden{{{ end }}}"><i class="fa fa-fw fa-eraser"></i> [[topic:thread_tools.purge]]</a></li>
 {{{ end }}}
-<!-- IF privileges.purge -->
-<li <!-- IF !deleted -->hidden<!-- ENDIF !deleted -->><a component="topic/purge" href="#" class="dropdown-item <!-- IF !deleted -->hidden<!-- ENDIF !deleted -->"><i class="fa fa-fw fa-eraser"></i> [[topic:thread_tools.purge]]</a></li>
-<!-- END -->
-<!-- IF privileges.isAdminOrMod -->
+{{{ if privileges.isAdminOrMod }}}
 <li><a component="topic/delete/posts" class="dropdown-item" href="#"><i class="fa fa-fw fa-trash-o"></i> [[topic:thread_tools.delete-posts]]</a></li>
-<!-- ENDIF privileges.isAdminOrMod -->
+{{{ end }}}
 
-{{{each thread_tools}}}
-<li><a href="#" class="dropdown-item {thread_tools.class}"><i class="fa fa-fw {thread_tools.icon}"></i> {thread_tools.title}</a></li>
-{{{end}}}
-<!-- ENDIF privileges.deletable -->
+{{{ each thread_tools }}}
+<li><a href="#" class="dropdown-item {./class}"><i class="fa fa-fw {./icon}"></i> {./title}</a></li>
+{{{ end }}}
+{{{ end }}}

package/templates/partials/topic/watch.tpl

@@ -1,5 +1,5 @@
 {{{ if config.loggedIn }}}
-<div class="btn-group topic-watch-dropdown bottom-sheet" component="topic/watch">
+<div class="btn-group bottom-sheet" component="topic/watch">
 	<button class="btn-ghost-sm d-flex gap-2 align-items-baseline dropdown-toggle" data-bs-toggle="dropdown" type="button">
 		<span component="topic/following/menu" class="d-flex gap-2 align-items-center{{{ if !isFollowing }}} hidden{{{ end }}}">
 			<i class="fa fa-fw fa-bell-o link-primary"></i>
@@ -17,11 +17,35 @@
 		</span>
 	</button>
 	<ul class="dropdown-menu">
-		<li><a class="dropdown-item" href="#" component="topic/following"><i component="topic/following/check" class="fa fa-fw {{{ if isFollowing }}}fa-check{{{ end }}}"></i><i class="fa fa-fw fa-bell-o"></i> [[topic:watching]]<p class="help-text text-muted"><small>[[topic:watching.description]]</small></p></a></li>
+		<li>
+			<a class="dropdown-item d-flex" href="#" component="topic/following">
+				<span><i component="topic/following/check" class="fa fa-fw {{{ if isFollowing }}}fa-check{{{ end }}}"></i></span>
+				<div class="d-flex flex-column">
+					<span><i class="fa fa-fw fa-bell-o"></i> [[topic:watching]]</span>
+					<p class="help-text text-muted"><small>[[topic:watching.description]]</small></p>
+				</div>
+			</a>
+		</li>
 
-		<li><a class="dropdown-item" href="#" component="topic/not-following"><i component="topic/not-following/check" class="fa fa-fw {{{ if isNotFollowing }}}fa-check{{{ end }}}"></i><i class="fa fa-fw fa-bell-slash-o"></i> [[topic:not-watching]]<p class="help-text text-muted"><small>[[topic:not-watching.description]]</small></p></a></li>
+		<li>
+			<a class="dropdown-item d-flex" href="#" component="topic/not-following">
+				<span><i component="topic/not-following/check" class="fa fa-fw {{{ if isNotFollowing }}}fa-check{{{ end }}}"></i></span>
+				<div class="d-flex flex-column">
+					<span><i class="fa fa-fw fa-bell-slash-o"></i> [[topic:not-watching]]</span>
+					<p class="help-text text-muted"><small>[[topic:not-watching.description]]</small></p>
+				</div>
+			</a>
+		</li>
 
-		<li><a class="dropdown-item" href="#" component="topic/ignoring"><i component="topic/ignoring/check" class="fa fa-fw {{{ if isIgnoring }}}fa-check{{{ end }}}"></i><i class="fa fa-fw fa-eye-slash"></i> [[topic:ignoring]]<p class="help-text text-muted"><small>[[topic:ignoring.description]]</small></p></a></li>
+		<li>
+			<a class="dropdown-item d-flex" href="#" component="topic/ignoring">
+				<span><i component="topic/ignoring/check" class="fa fa-fw {{{ if isIgnoring }}}fa-check{{{ end }}}"></i></span>
+				<div class="d-flex flex-column">
+					<span><i class="fa fa-fw fa-eye-slash"></i> [[topic:ignoring]]</span>
+					<p class="help-text text-muted"><small>[[topic:ignoring.description]]</small></p>
+				</div>
+			</a>
+		</li>
 	</ul>
 </div>
 {{{ end }}}

package/templates/partials/topic-list-bar.tpl

@@ -1,6 +1,6 @@
-<nav class="topic-list-header {{{ if config.stickyToolbar }}} sticky-tools{{{ end }}} navbar navbar-expand p-0 border-0 rounded">
-	<div class="card card-header flex-row p-2 border rounded ff-secondary w-100">
-		<ul class="navbar-nav me-auto gap-2 align-items-center">
+<nav class="topic-list-header {{{ if config.theme.stickyToolbar }}} sticky-tools{{{ end }}} navbar navbar-expand p-0 border-0 rounded mb-3">
+	<div class="card card-header flex-row p-2 gap-1 border rounded ff-secondary w-100">
+		<ul component="category/controls" class="navbar-nav me-auto gap-2 align-items-center">
 			{{{ if template.category }}}
 			<!-- IMPORT partials/category/watch.tpl -->
 			<!-- IMPORT partials/category/sort.tpl -->
@@ -10,15 +10,15 @@
 			{{{ end }}}
 			{{{ if (template.unread || (template.recent || (template.popular || template.top))) }}}
 			<!-- IMPORT partials/topic-filters.tpl -->
-			<!-- IMPORT partials/category-filter.tpl -->
+			<!-- IMPORT partials/category/filter-dropdown-left.tpl -->
 			{{{ end }}}
 			{{{ if template.unread }}}
 			<div class="markread btn-group {{{ if !topics.length }}}hidden{{{ end }}}">
-				<!-- IMPORT partials/category-selector.tpl -->
+				<!-- IMPORT partials/category/selector-dropdown-left.tpl -->
 			</div>
 			{{{ end }}}
 			{{{ if template.tag }}}
-			<!-- IMPORT partials/category-filter.tpl -->
+			<!-- IMPORT partials/category/filter-dropdown-left.tpl -->
 			{{{ end }}}
 			<!-- IMPORT partials/category/tools.tpl -->
 
@@ -27,11 +27,11 @@
 			{{{ end }}}
 
 			<a href="{config.relative_path}{{{ if template.category }}}{url}{{{ else }}}/{selectedFilter.url}{querystring}{{{ end }}}" class="d-inline-block text-decoration-none">
-				<div class="alert alert-warning h-100 m-0 px-2 py-1 d-flex align-items-center hide" id="new-topics-alert"></div>
+				<div class="d-md-block alert alert-warning h-100 m-0 px-2 py-1 line-clamp-2 text-sm text-break hide" id="new-topics-alert">There is a new post. Click here to reload.</div>
 			</a>
 		</ul>
 
-		<div class="d-flex gap-1 align-items-stretch">
+		<div class="d-flex gap-1 align-items-center">
 			{{{ if template.category }}}
 				{{{ if privileges.topics:create }}}
 				<a href="{config.relative_path}/compose?cid={cid}" component="category/post" id="new_topic" class="btn btn-primary btn-sm text-nowrap" data-ajaxify="false" role="button">[[category:new_topic_button]]</a>

package/templates/partials/topics_list.tpl

@@ -1,4 +1,4 @@
-<ul component="category" class="list-unstyled topic-list pt-4 overflow-auto position-relative" itemscope itemtype="http://www.schema.org/ItemList" data-nextstart="{nextStart}" data-set="{set}">
+<ul component="category" class="list-unstyled topic-list overflow-auto position-relative" itemscope itemtype="http://www.schema.org/ItemList" data-nextstart="{nextStart}" data-set="{set}">
 
 	{{{ each topics }}}
 	<li component="category/topic" class="category-item position-relative {function.generateTopicClass}" <!-- IMPORT partials/data/category.tpl -->>
@@ -16,7 +16,7 @@
 							{{{ if ./thumbs.length }}}
 							<img class="topic-thumb rounded-1" width="80" height="auto" src="{./thumbs.0.url}" class="not-responsive" />
 							{{{ else }}}
-							{buildAvatar(./user, "40px", true, "not-responsive")}
+							{buildAvatar(./user, "40px", true, "avatar-tooltip not-responsive")}
 							{{{ end }}}
 						</a>
 					</div>
@@ -70,48 +70,50 @@
 				</div>
 			</div>
 
-			<div class="col-md-2 d-none d-lg-flex stats text-muted gap-2 px-0">
-				{{{ if !reputation:disabled }}}
-				<div class="stats-votes flex-1">
-					<div class="align-items-center card card-header px-0 py-2 border-0 rounded-1">
-						<span class="human-readable-number fs-5 fw-semibold ff-secondary lh-1" title="{./votes}" data-toFixed="0">{./votes}</span>
-						<span class="text-lowercase text-xs">[[global:votes]]</span>
+			<div class="meta row col-md-5 col-sm-3 d-none d-md-flex align-self-stretch align-self-lg-start">
+				<div class="col-md-5 d-none d-lg-flex stats text-muted gap-2 px-0">
+					{{{ if !reputation:disabled }}}
+					<div class="stats-votes flex-1">
+						<div class="align-items-center card card-header px-0 py-2 border-0 rounded-1">
+							<span class="human-readable-number fs-5 fw-semibold ff-secondary lh-1" title="{./votes}" data-toFixed="0">{./votes}</span>
+							<span class="text-lowercase text-xs">[[global:votes]]</span>
+						</div>
 					</div>
-				</div>
-				{{{ end }}}
-				<div class="stats-postcount flex-1">
-					<div class="align-items-center card card-header px-0 py-2 border-0 rounded-1">
-						<span class="human-readable-number fs-5 fw-semibold ff-secondary lh-1" title="{./postcount}" data-toFixed="0">{./postcount}</span>
-						<span class="text-lowercase text-xs">[[global:posts]]</span>
+					{{{ end }}}
+					<div class="stats-postcount flex-1">
+						<div class="align-items-center card card-header px-0 py-2 border-0 rounded-1">
+							<span class="human-readable-number fs-5 fw-semibold ff-secondary lh-1" title="{./postcount}" data-toFixed="0">{./postcount}</span>
+							<span class="text-lowercase text-xs">[[global:posts]]</span>
+						</div>
 					</div>
-				</div>
-				<div class="stats-viewcount flex-1">
-					<div class="align-items-center card card-header px-0 py-2 border-0 rounded-1">
-						<span class="human-readable-number fs-5 fw-semibold ff-secondary lh-1" title="{./viewcount}" data-toFixed="0">{./viewcount}</span>
-						<span class="text-lowercase text-xs">[[global:views]]</span>
+					<div class="stats-viewcount flex-1">
+						<div class="align-items-center card card-header px-0 py-2 border-0 rounded-1">
+							<span class="human-readable-number fs-5 fw-semibold ff-secondary lh-1" title="{./viewcount}" data-toFixed="0">{./viewcount}</span>
+							<span class="text-lowercase text-xs">[[global:views]]</span>
+						</div>
 					</div>
 				</div>
-			</div>
 
-			<div class="col-md-3 col-sm-3 teaser d-none d-md-block overflow-hidden" component="topic/teaser">
-				<div class="lastpost background-link-container border-start border-2 h-100" style="border-color: {./category.bgColor}!important;">
-					<a class="background-link" href="{config.relative_path}/topic/{./slug}/{./teaser.index}"></a>
-					{{{ if ./unreplied }}}
-					<p class="ps-3 text-xs lh-1">
-						[[category:no_replies]]
-					</p>
-					{{{ else }}}
-					{{{ if ./teaser.pid }}}
-					<p class="ps-3 mb-0 lh-1">
-						<a href="{config.relative_path}/user/{./teaser.user.userslug}" class="text-decoration-none">{buildAvatar(./teaser.user, "18px", true, "not-responsive")}</a>
-						<a class="permalink text-muted timeago text-xs" href="{config.relative_path}/topic/{./slug}/{./teaser.index}" title="{./teaser.timestampISO}">
-						</a>
-					</p>
-					<div class="post-content overflow-hidden text-xs line-clamp-2 ps-3">
-						{./teaser.content}
+				<div class="col-md-7 col-sm-3 teaser d-none d-md-block overflow-hidden" component="topic/teaser">
+					<div class="lastpost background-link-container border-start border-2 h-100" style="border-color: {./category.bgColor}!important;">
+						<a class="background-link" href="{config.relative_path}/topic/{./slug}/{./teaser.index}"></a>
+						{{{ if ./unreplied }}}
+						<p class="ps-3 text-xs lh-1">
+							[[category:no_replies]]
+						</p>
+						{{{ else }}}
+						{{{ if ./teaser.pid }}}
+						<p class="ps-3 mb-0 lh-1">
+							<a href="{config.relative_path}/user/{./teaser.user.userslug}" class="text-decoration-none">{buildAvatar(./teaser.user, "18px", true, "avatar-tooltip not-responsive")}</a>
+							<a class="permalink text-muted timeago text-xs" href="{config.relative_path}/topic/{./slug}/{./teaser.index}" title="{./teaser.timestampISO}">
+							</a>
+						</p>
+						<div class="post-content overflow-hidden text-xs line-clamp-2 ps-3">
+							{./teaser.content}
+						</div>
+						{{{ end }}}
+						{{{ end }}}
 					</div>
-					{{{ end }}}
-					{{{ end }}}
 				</div>
 			</div>
 

package/templates/partials/users/filter-dropdown-content.tpl

@@ -0,0 +1,20 @@
+<button type="button" class="btn-ghost-sm dropdown-toggle" data-bs-toggle="dropdown">
+	{{{ if selectedUser }}}
+	<span class="fw-semibold">{buildAvatar(selectedUser, "20px", true, "not-responsive")} {selectedUser.username}</span>
+	{{{ else }}}
+	<span class="fw-semibold">[[users:all-users]]</span>
+	{{{ end }}} <span class="caret"></span>
+</button>
+<ul class="dropdown-menu" role="menu">
+	<li role="presentation" class="user {{{ if !selectedUser}}}selected{{{end}}}">
+		<a class="dropdown-item" role="menu-item" href="{config.relative_path}/{allUsersUrl}"><i class="fa fa-fw {{{ if !selectedUser }}}fa-check{{{ end }}}"></i>[[users:all-users]]</a>
+	</li>
+	{{{ each users }}}
+	<li role="presentation" class="user {{{ if ./selected}}}selected{{{end}}}">
+		<a class="dropdown-item" role="menu-item" href="{config.relative_path}/{./url}">
+			<i class="fa fa-fw {{{ if ./selected }}}fa-check{{{ end }}}"></i>
+			<div class="d-inline-flex gap-1 align-items-center">{buildAvatar(@value, "24px", true, "not-responsive")} {./username}</div>
+		</a>
+	</li>
+	{{{end}}}
+</ul>

package/templates/popular.tpl

@@ -7,7 +7,7 @@
 	<!-- IMPORT partials/topic-list-bar.tpl -->
 	<div class="category">
 		{{{ if !topics.length }}}
-		<div class="alert alert-warning" id="category-no-topics">[[recent:no_popular_topics]]</div>
+		<div class="alert alert-info mt-3" id="category-no-topics">[[recent:no_popular_topics]]</div>
 		{{{ end }}}
 
 		<!-- IMPORT partials/topics_list.tpl -->

package/templates/post-queue.tpl

@@ -0,0 +1,120 @@
+<!-- IMPORT partials/breadcrumbs.tpl -->
+
+{{{ if (!singlePost && posts.length) }}}
+<div class="btn-toolbar justify-content-end">
+	<div class="me-2">
+	<!-- IMPORT partials/category/filter-dropdown-right.tpl -->
+	</div>
+	<div class="btn-group bottom-sheet" component="post-queue/bulk-actions">
+		<button type="button" class="btn-ghost-sm dropdown-toggle" data-bs-toggle="dropdown" autocomplete="off" aria-haspopup="true" aria-expanded="false">
+			<i class="fa fa-clone"></i><span class="fw-semibold"> [[post-queue:bulk-actions]]</span>
+		</button>
+		<ul class="dropdown-menu dropdown-menu-end">
+			{{{ if canAccept }}}
+			<li><a class="dropdown-item" href="#" data-action="accept-all">[[post-queue:accept-all]]</a></li>
+			<li><a class="dropdown-item" href="#" data-action="accept-selected">[[post-queue:accept-selected]]</a></li>
+			<li class="dropdown-divider"></li>
+			<li><a class="dropdown-item" href="#" data-action="reject-all">[[post-queue:reject-all]]</a></li>
+			<li><a class="dropdown-item" href="#" data-action="reject-selected">[[post-queue:reject-selected]]</a></li>
+			{{{ else }}}
+			<li><a class="dropdown-item" href="#" data-action="reject-all">[[post-queue:remove-all]]</a></li>
+			<li><a class="dropdown-item" href="#" data-action="reject-selected">[[post-queue:remove-selected]]</a></li>
+			{{{ end }}}
+		</ul>
+	</div>
+</div>
+
+<hr/>
+{{{ end }}}
+
+<div class="row">
+	<div class="col-12">
+		<div class="post-queue preventSlideout posts-list">
+			{{{ if (!posts.length && isAdmin) }}}
+			{{{ if !singlePost }}}
+			<div class="alert alert-info">
+				<p>[[post-queue:no-queued-posts]]</p>
+				{{{ if !enabled }}}<p>[[post-queue:enabling-help, {config.relative_path}/admin/settings/post#post-queue]]</p>{{{ end }}}
+			</div>
+			{{{ else }}}
+			<div class="alert alert-info d-flex align-items-center">
+				<p class="mb-0 me-auto">[[post-queue:no-single-post]]</p>
+				<a class="btn btn-sm btn-primary" href=".">[[post-queue:back-to-list]]</a>
+			</div>
+			{{{ end }}}
+			{{{ end }}}
+
+			{{{ each posts }}}
+			<div class="card mb-3" data-id="{posts.id}">
+				<div class="card-header">
+					{{{ if !singlePost }}}
+					<input type="checkbox" class="form-check-input" autocomplete="off" />
+					{{{ end }}}
+					<strong>{{{ if posts.data.tid }}}[[post-queue:reply]]{{{ else }}}[[post-queue:topic]]{{{ end }}}</strong>
+					<span class="timeago float-end" title={posts.data.timestampISO}></span>
+				</div>
+				<div class="card-body">
+					<div class="row">
+						<div class="col-lg-2 col-12">
+							<strong>[[post-queue:user]]</strong>
+							<div>
+								{{{ if posts.user.userslug}}}
+								<a href="{config.relative_path}/uid/{posts.user.uid}">{buildAvatar(posts.user, "24px", true, "not-responsive")} {posts.user.username}</a>
+								{{{ else }}}
+								{posts.user.username}
+								{{{ end }}}
+							</div>
+						</div>
+						<div class="col-lg-3 col-12">
+							<strong>[[post-queue:category]]{{{ if posts.data.cid}}} <i class="fa fa-fw fa-edit" data-bs-toggle="tooltip" title="[[post-queue:category-editable]]"></i>{{{ end }}}</strong>
+							<div class="topic-category" {{{if posts.data.cid}}}data-editable="editable"{{{end}}}">
+								<a href="{config.relative_path}/category/{posts.category.slug}">
+									<div class="category-item d-inline-block">
+										{buildCategoryIcon(./category, "24px", "rounded-circle")}
+										{posts.category.name}
+									</div>
+								</a>
+							</div>
+						</div>
+						<div class="col-lg-7 col-12">
+							<strong>{{{ if posts.data.tid }}}[[post-queue:topic]]{{{ else }}}[[post-queue:title]] <i class="fa fa-fw fa-edit" data-bs-toggle="tooltip" title="[[post-queue:title-editable]]"></i>{{{ end }}}</strong>
+							<div class="topic-title text-break">
+								{{{ if posts.data.tid }}}
+								<a href="{config.relative_path}/topic/{posts.data.tid}">{posts.topic.title}</a>
+								{{{ end }}}
+								<span class="title-text">{posts.data.title}</span>
+							</div>
+							{{{if !posts.data.tid}}}
+							<div class="topic-title-editable hidden">
+								<input class="form-control" type="text" value="{posts.data.title}"/>
+							</div>
+							{{{end}}}
+						</div>
+					</div>
+					<hr/>
+					<div>
+						<strong>[[post-queue:content]] <i class="fa fa-fw fa-edit" data-bs-toggle="tooltip" title="[[post-queue:content-editable]]"></i></strong>
+						<div class="post-content text-break">{posts.data.content}</div>
+						<div class="post-content-editable hidden">
+							<textarea class="form-control w-100" style="height:300px;">{posts.data.rawContent}</textarea>
+						</div>
+					</div>
+				</div>
+				<div class="card-footer text-end">
+					<div>
+						{{{ if canAccept }}}
+						<button class="btn btn-danger btn-sm" data-action="reject"><i class="fa fa-fw fa-times"></i> [[post-queue:reject]]</button>
+						<button class="btn btn-info btn-sm" data-action="notify"><i class="fa fa-fw fa-bell-o"></i> [[post-queue:notify]]</button>
+						<button class="btn btn-success btn-sm" data-action="accept"><i class="fa fa-fw fa-check"></i> [[post-queue:accept]] </button>
+						{{{ else }}}
+						<button class="btn btn-danger btn-sm" data-action="reject"><i class="fa fa-fw fa-times"></i> [[post-queue:remove]]</button>
+						{{{ end }}}
+					</div>
+				</div>
+			</div>
+			{{{ end }}}
+		</div>
+
+		<!-- IMPORT partials/paginator.tpl -->
+	</div>
+</div>

package/templates/recent.tpl

@@ -9,7 +9,7 @@
 
 	<div class="category">
 		{{{ if !topics.length }}}
-		<div class="alert alert-warning" id="category-no-topics">[[recent:no_recent_topics]]</div>
+		<div class="alert alert-info mt-3" id="category-no-topics">[[recent:no_recent_topics]]</div>
 		{{{ end }}}
 
 		<!-- IMPORT partials/topics_list.tpl -->

package/templates/register.tpl

@@ -8,7 +8,7 @@
 		<h2 class="tracking-tight fw-semibold text-center">[[global:register]]</h2>
 		<div class="row justify-content-center gap-5">
 
-			<div class="col-12 col-md-3 px-md-0">
+			<div class="col-12 col-md-5 col-lg-3 px-md-0">
 				<div class="register-block">
 					<div class="alert alert-danger{{{ if !error }}} hidden{{{ end }}}" id="register-error-notify" >
 						<strong>[[error:registration-error]]</strong>
@@ -66,7 +66,7 @@
 			</div>
 
 			{{{ if alternate_logins }}}
-			<div class="col-12 col-md-3 px-md-0">
+			<div class="col-12 col-md-5 col-lg-3 px-md-0">
 				<div class="alt-register-block d-flex flex-column gap-2">
 					<label>[[register:alternative_registration]]</label>
 					<ul class="alt-logins list-unstyled">