nodebb-theme-persona 13.3.32 → 13.3.33

package/templates/partials/notifications_list.tpl

@@ -1,30 +1,44 @@
-
-<!-- IF !notifications.length -->
-<li class="no-notifs"><a href="#">[[notifications:no-notifs]]</a></li>
-<!-- ENDIF !notifications.length -->
-
-{{{each notifications}}}
-<li class="{notifications.readClass}" data-nid="{notifications.nid}" data-path="{notifications.path}" <!-- IF notifications.pid --> data-pid="{notifications.pid}"<!-- ENDIF notifications.pid --><!-- IF notifications.tid --> data-tid="{notifications.tid}"<!-- ENDIF notifications.tid -->>
-	<!-- IF notifications.image -->
-	<!-- IF notifications.from -->
-	<a href="{config.relative_path}/user/{notifications.user.userslug}"><img class="float-start user-img avatar avatar-rounded" style="--avatar-size: 32px;" src="{notifications.image}" /></a>
-	<!-- ENDIF notifications.from -->
-	<!-- ELSE -->
-	<a href="{config.relative_path}/user/{notifications.user.userslug}"><div class="float-start avatar avatar-rounded" style="--avatar-size: 32px; background-color: {notifications.user.icon:bgColor};">{notifications.user.icon:text}</div></a>
-	<!-- ENDIF notifications.image -->
-
-	<a href="{notifications.path}" class="notification-chat-content deco-none">
-		<span class="text">{notifications.bodyShort}</span>
-	</a>
-
-	<div class="notification-chat-controls">
-		{{{ if ./nid }}}
-		<div class="mark-read" aria-label="Mark Read">
-			<i class="unread fa fa-circle"></i>
-			<i class="read fa fa-circle-o"></i>
-		</div>
-		{{{ end }}}
-		<span class="relTime">{notifications.timeago}</span>
-	</div>
-</li>
-{{{end}}}
+{{{ if !notifications.length }}}
+<div class="no-notifs text-center p-4 d-flex flex-column">
+	<div class="p-4"><i class="fa-solid fa-wind fs-2 text-muted"></i></div>
+	<div class="text-xs fw-semibold text-muted">[[notifications:no-notifs]]</div>
+</div>
+{{{ end }}}
+
+{{{ each notifications }}}
+<div class="{./readClass}" data-nid="{./nid}" data-path="{./path}" {{{ if ./pid }}}data-pid="{./pid}"{{{ end }}}{{{ if ./tid }}}data-tid="{./tid}"{{{ end }}}>
+	<div class="d-flex gap-1 justify-content-between">
+		<div class="btn-ghost-sm d-flex gap-2 flex-grow-1 align-items-start">
+			<a class="flex-grow-0 flex-shrink-0" href="{{{ if ./user.userslug}}}{config.relative_path}/user/{./user.userslug}{{{ else }}}#{{{ end }}}">
+				{{{ if (./image && ./from) }}}
+				<img class="avatar avatar-rounded" style="--avatar-size: 32px;" src="{./image}" />
+				{{{ else }}}
+				{{{ if ./icon }}}
+				<div class="avatar avatar-rounded" style="--avatar-size: 32px;"><i class="text-secondary fa {./icon}"></i></div>
+				{{{ else }}}
+				<div class="avatar avatar-rounded" style="--avatar-size: 32px; background-color: {./user.icon:bgColor};">{./user.icon:text}</div>
+				{{{ end }}}
+				{{{ end }}}
+			</a>
+
+			<div class="d-flex flex-grow-1 flex-column align-items-start position-relative">
+				<a href="{./path}" class="text-decoration-none d-inline-block text-reset text-break text-sm ff-sans stretched-link" component="notifications/item/link">
+					{./bodyShort}
+				</a>
+				<div class="text-xs text-muted">{{{ if ./timeagoLong }}}{./timeagoLong}{{{ else }}}<span class="timeago" title="{./datetimeISO}"></span>{{{ end }}}</div>
+			</div>
+		</div>
+		<div>
+			{{{ if ./nid }}}
+			<button class="mark-read btn-ghost-sm flex-grow-0 flex-shrink-0 p-1" style="width: 1.5rem; height: 1.5rem;">
+				<i class="unread fa fa-2xs fa-circle text-primary {{{ if ./read }}}hidden{{{ end }}}" aria-label="[[unread:mark-as-read]]"></i>
+				<i class="read fa fa-2xs fa-circle-o text-secondary {{{ if !./read }}}hidden{{{ end }}}" aria-label="[[unread:mark-as-unread]]"></i>
+			</button>
+			{{{ end }}}
+		</div>
+	</div>
+</div>
+{{{ if !@last }}}
+<hr class="my-1" />
+{{{ end }}}
+{{{ end }}}

package/templates/partials/paginator.tpl

@@ -1,45 +1,45 @@
-<nav component="pagination" class="pagination-container<!-- IF !pagination.pages.length --> hidden<!-- ENDIF !pagination.pages.length -->" aria-label="[[global:pagination]]">
-	<ul class="pagination hidden-xs justify-content-center">
-		<li class="page-item previous float-start<!-- IF !pagination.prev.active --> disabled<!-- ENDIF !pagination.prev.active -->">
-			<a class="page-link" href="?{pagination.prev.qs}" data-page="{pagination.prev.page}" aria-label="[[global:pagination.previouspage]]"><i class="fa fa-chevron-left"></i> </a>
-		</li>
-
-		{{{each pagination.pages}}}
-			<!-- IF pagination.pages.separator -->
-			<li component="pagination/select-page" class="page-item page select-page">
-				<a class="page-link" href="#" aria-label="[[global:pagination.go-to-page]]"><i class="fa fa-ellipsis-h"></i></a>
-			</li>
-			<!-- ELSE -->
-			<li class="page-item page<!-- IF pagination.pages.active --> active<!-- ENDIF pagination.pages.active -->" >
-				<a class="page-link" href="?{pagination.pages.qs}" data-page="{pagination.pages.page}" aria-label="[[global:pagination.page-x, {./page}]]">{pagination.pages.page}</a>
-			</li>
-			<!-- ENDIF pagination.pages.separator -->
-		{{{end}}}
-
-		<li class="page-item next float-end<!-- IF !pagination.next.active --> disabled<!-- ENDIF !pagination.next.active -->">
-			<a class="page-link" href="?{pagination.next.qs}" data-page="{pagination.next.page}" aria-label="[[global:pagination.nextpage]]"><i class="fa fa-chevron-right"></i></a>
-		</li>
-	</ul>
-
-	<ul class="pagination hidden-sm hidden-md hidden-lg justify-content-center">
-		<li class="page-item first<!-- IF !pagination.prev.active --> disabled<!-- ENDIF !pagination.prev.active -->">
-			<a class="page-link" href="?{pagination.first.qs}" data-page="1" aria-label="[[global:pagination.firstpage]]"><i class="fa fa-fast-backward"></i> </a>
-		</li>
-
-		<li class="page-item previous<!-- IF !pagination.prev.active --> disabled<!-- ENDIF !pagination.prev.active -->">
-			<a class="page-link" href="?{pagination.prev.qs}" data-page="{pagination.prev.page}" aria-label="[[global:pagination.previouspage]]"><i class="fa fa-chevron-left"></i> </a>
-		</li>
-
-		<li component="pagination/select-page" class="page-item page select-page">
-			<a class="page-link" href="#" aria-label="[[global:pagination.go-to-page]]">{pagination.currentPage} / {pagination.pageCount}</a>
-		</li>
-
-		<li class="page-item next<!-- IF !pagination.next.active --> disabled<!-- ENDIF !pagination.next.active -->">
-			<a class="page-link" href="?{pagination.next.qs}" data-page="{pagination.next.page}" aria-label="[[global:pagination.nextpage]]"><i class="fa fa-chevron-right"></i></a>
-		</li>
-
-		<li class="page-item last<!-- IF !pagination.next.active --> disabled<!-- ENDIF !pagination.next.active -->">
-			<a class="page-link" href="?{pagination.last.qs}" data-page="{pagination.pageCount}" aria-label="[[global:pagination.lastpage]]"><i class="fa fa-fast-forward"></i> </a>
-		</li>
-	</ul>
+<nav component="pagination" class="pagination-container<!-- IF !pagination.pages.length --> hidden<!-- ENDIF !pagination.pages.length -->" aria-label="[[global:pagination]]">
+	<ul class="pagination hidden-xs justify-content-center">
+		<li class="page-item previous float-start<!-- IF !pagination.prev.active --> disabled<!-- ENDIF !pagination.prev.active -->">
+			<a class="page-link" href="?{pagination.prev.qs}" data-page="{pagination.prev.page}" aria-label="[[global:pagination.previouspage]]"><i class="fa fa-chevron-left"></i> </a>
+		</li>
+
+		{{{each pagination.pages}}}
+			<!-- IF pagination.pages.separator -->
+			<li component="pagination/select-page" class="page-item page select-page">
+				<a class="page-link" href="#" aria-label="[[global:pagination.go-to-page]]"><i class="fa fa-ellipsis-h"></i></a>
+			</li>
+			<!-- ELSE -->
+			<li class="page-item page<!-- IF pagination.pages.active --> active<!-- ENDIF pagination.pages.active -->" >
+				<a class="page-link" href="?{pagination.pages.qs}" data-page="{pagination.pages.page}" aria-label="[[global:pagination.page-x, {./page}]]">{pagination.pages.page}</a>
+			</li>
+			<!-- ENDIF pagination.pages.separator -->
+		{{{end}}}
+
+		<li class="page-item next float-end<!-- IF !pagination.next.active --> disabled<!-- ENDIF !pagination.next.active -->">
+			<a class="page-link" href="?{pagination.next.qs}" data-page="{pagination.next.page}" aria-label="[[global:pagination.nextpage]]"><i class="fa fa-chevron-right"></i></a>
+		</li>
+	</ul>
+
+	<ul class="pagination hidden-sm hidden-md hidden-lg justify-content-center">
+		<li class="page-item first<!-- IF !pagination.prev.active --> disabled<!-- ENDIF !pagination.prev.active -->">
+			<a class="page-link" href="?{pagination.first.qs}" data-page="1" aria-label="[[global:pagination.firstpage]]"><i class="fa fa-fast-backward"></i> </a>
+		</li>
+
+		<li class="page-item previous<!-- IF !pagination.prev.active --> disabled<!-- ENDIF !pagination.prev.active -->">
+			<a class="page-link" href="?{pagination.prev.qs}" data-page="{pagination.prev.page}" aria-label="[[global:pagination.previouspage]]"><i class="fa fa-chevron-left"></i> </a>
+		</li>
+
+		<li component="pagination/select-page" class="page-item page select-page">
+			<a class="page-link" href="#" aria-label="[[global:pagination.go-to-page]]">{pagination.currentPage} / {pagination.pageCount}</a>
+		</li>
+
+		<li class="page-item next<!-- IF !pagination.next.active --> disabled<!-- ENDIF !pagination.next.active -->">
+			<a class="page-link" href="?{pagination.next.qs}" data-page="{pagination.next.page}" aria-label="[[global:pagination.nextpage]]"><i class="fa fa-chevron-right"></i></a>
+		</li>
+
+		<li class="page-item last<!-- IF !pagination.next.active --> disabled<!-- ENDIF !pagination.next.active -->">
+			<a class="page-link" href="?{pagination.last.qs}" data-page="{pagination.pageCount}" aria-label="[[global:pagination.lastpage]]"><i class="fa fa-fast-forward"></i> </a>
+		</li>
+	</ul>
 </nav>

package/templates/partials/post_bar.tpl

@@ -1,20 +1,20 @@
-<div class="topic-main-buttons float-end d-inline-block">
-	<span class="loading-indicator btn float-start hidden" done="0">
-		<span class="hidden-xs">[[topic:loading-more-posts]]</span> <i class="fa fa-refresh fa-spin"></i>
-	</span>
-
-	<!-- IF loggedIn -->
-	<button component="topic/mark-unread" class="btn btn-sm btn-outline-secondary" title="[[topic:mark-unread]]">
-		<i class="fa fa-fw fa-inbox"></i><span class="visible-sm-inline visible-md-inline visible-lg-inline"></span>
-	</button>
-	<!-- ENDIF loggedIn -->
-
-	<!-- IMPORT partials/topic/watch.tpl -->
-
-	<!-- IMPORT partials/topic/sort.tpl -->
-
-	<div class="d-inline-block">
-	<!-- IMPORT partials/topic/tools.tpl -->
-	</div>
-	<!-- IMPORT partials/topic/reply-button.tpl -->
-</div>
+<div class="topic-main-buttons float-end d-inline-block">
+	<span class="loading-indicator btn float-start hidden" done="0">
+		<span class="hidden-xs">[[topic:loading-more-posts]]</span> <i class="fa fa-refresh fa-spin"></i>
+	</span>
+
+	<!-- IF loggedIn -->
+	<button component="topic/mark-unread" class="btn btn-sm btn-outline-secondary" title="[[topic:mark-unread]]">
+		<i class="fa fa-fw fa-inbox"></i><span class="visible-sm-inline visible-md-inline visible-lg-inline"></span>
+	</button>
+	<!-- ENDIF loggedIn -->
+
+	<!-- IMPORT partials/topic/watch.tpl -->
+
+	<!-- IMPORT partials/topic/sort.tpl -->
+
+	<div class="d-inline-block">
+	<!-- IMPORT partials/topic/tools.tpl -->
+	</div>
+	<!-- IMPORT partials/topic/reply-button.tpl -->
+</div>

package/templates/partials/posts_list.tpl

@@ -1,8 +1,8 @@
-<ul component="posts" class="posts-list list-unstyled" data-nextstart="{nextStart}">
-	{{{each posts}}}
-	<!-- IMPORT partials/posts_list_item.tpl -->
-	{{{end}}}
-</ul>
-<div component="posts/loading" class="loading-indicator text-center hidden">
-	<i class="fa fa-refresh fa-spin"></i>
+<ul component="posts" class="posts-list list-unstyled" data-nextstart="{nextStart}">
+	{{{each posts}}}
+	<!-- IMPORT partials/posts_list_item.tpl -->
+	{{{end}}}
+</ul>
+<div component="posts/loading" class="loading-indicator text-center hidden">
+	<i class="fa fa-refresh fa-spin"></i>
 </div>

package/templates/partials/posts_list_item.tpl

@@ -1,32 +1,32 @@
-<li component="post" class="posts-list-item row<!-- IF ../deleted --> deleted<!-- ELSE --><!-- IF ../topic.deleted --> deleted<!-- ENDIF --><!-- ENDIF -->{{{ if ../topic.scheduled }}} scheduled{{{ end }}}" data-pid="{../pid}" data-uid="{../uid}">
-    <div class="col-lg-11 col-sm-10 col-9 post-body">
-        <a class="topic-title" href="{config.relative_path}/post/{../pid}">
-            <!-- IF !../isMainPost -->RE: <!-- ENDIF -->{../topic.title}
-        </a>
-
-        <div component="post/content" class="content">
-            {../content}
-        </div>
-
-        <small class="topic-category"><a href="{config.relative_path}/category/{../category.slug}">[[global:posted-in, {../category.name}]]</a></small>
-
-        {{{ if ../isMainPost }}}
-        {{{ if ../topic.tags.length }}}
-        <span class="tag-list">
-            {{{ each ../topic.tags }}}
-            <a href="{config.relative_path}/tags/{topic.tags.valueEncoded}"><span class="tag tag-item tag-class-{topic.tags.class}">{topic.tags.valueEscaped}</span></a>
-            {{{ end }}}
-        </span>
-        {{{ end }}}
-        {{{ end }}}
-
-        <div class="post-info">
-            <a href="{config.relative_path}/user/{../user.userslug}">{buildAvatar(../user, "28px", true, "user-img not-responsive")}</a>
-
-            <div class="post-author">
-                <a href="{config.relative_path}/user/{../user.userslug}">{../user.displayname}</a><br />
-                <span class="timeago" title="{../timestampISO}"></span>
-            </div>
-        </div>
-    </div>
+<li component="post" class="posts-list-item row<!-- IF ../deleted --> deleted<!-- ELSE --><!-- IF ../topic.deleted --> deleted<!-- ENDIF --><!-- ENDIF -->{{{ if ../topic.scheduled }}} scheduled{{{ end }}}" data-pid="{../pid}" data-uid="{../uid}">
+    <div class="col-lg-11 col-sm-10 col-9 post-body">
+        <a class="topic-title" href="{config.relative_path}/post/{../pid}">
+            <!-- IF !../isMainPost -->RE: <!-- ENDIF -->{../topic.title}
+        </a>
+
+        <div component="post/content" class="content">
+            {../content}
+        </div>
+
+        <small class="topic-category"><a href="{config.relative_path}/category/{../category.slug}">[[global:posted-in, {../category.name}]]</a></small>
+
+        {{{ if ../isMainPost }}}
+        {{{ if ../topic.tags.length }}}
+        <span class="tag-list">
+            {{{ each ../topic.tags }}}
+            <a href="{config.relative_path}/tags/{topic.tags.valueEncoded}"><span class="tag tag-item tag-class-{topic.tags.class}">{topic.tags.valueEscaped}</span></a>
+            {{{ end }}}
+        </span>
+        {{{ end }}}
+        {{{ end }}}
+
+        <div class="post-info">
+            <a href="{config.relative_path}/user/{../user.userslug}">{buildAvatar(../user, "28px", true, "user-img not-responsive")}</a>
+
+            <div class="post-author">
+                <a href="{config.relative_path}/user/{../user.userslug}">{../user.displayname}</a><br />
+                <span class="timeago" title="{../timestampISO}"></span>
+            </div>
+        </div>
+    </div>
 </li>

package/templates/partials/quick-search-results.tpl

@@ -1,34 +1,34 @@
-<ul id="quick-search-results" class="quick-search-results list-unstyled mb-0 p-0 overflow-auto" style="max-width: {dropdown.maxWidth}; max-height: {dropdown.maxHeight};">
-{{{each posts}}}
-<li data-tid="{posts.topic.tid}" data-pid="{posts.pid}">
-	<a href="{config.relative_path}/post/{posts.pid}"
-		class="text-decoration-none text-reset clearfix d-block text-truncate px-3 py-1">
-		{buildAvatar(posts.user, "24px", true)}
-		<span class="quick-search-title fw-bold">{posts.topic.title}</span>
-		<br/>
-		<p class="snippet text-break text-wrap">
-		{posts.snippet}
-		</p>
-		<small class="post-info float-end">
-			<div class="category-item d-inline-block">
-				{buildCategoryIcon(./category, "24px", "rounded-circle")} {posts.category.name}
-				&bull; <span class="timeago" title="{posts.timestampISO}"></span>
-			</div>
-		</small>
-	</a>
-</li>
-<!-- IF !@last -->
-<li role="separator" class="dropdown-divider"></li>
-<!-- ENDIF -->
-{{{end}}}
-</ul>
-<!-- IF multiplePages -->
-<div class="text-center mt-2">
-	<a href="{url}">
-		[[search:see-more-results, {matchCount}]]
-	</a>
-</div>
-<!-- ENDIF multiplePages -->
-{{{if !posts.length}}}
-<div class="text-center no-results">[[search:no-matches]]</li>
+<ul id="quick-search-results" class="quick-search-results list-unstyled mb-0 p-0 overflow-auto" style="max-width: {dropdown.maxWidth}; max-height: {dropdown.maxHeight};">
+{{{each posts}}}
+<li data-tid="{posts.topic.tid}" data-pid="{posts.pid}">
+	<a href="{config.relative_path}/post/{posts.pid}"
+		class="text-decoration-none text-reset clearfix d-block text-truncate px-3 py-1">
+		{buildAvatar(posts.user, "24px", true)}
+		<span class="quick-search-title fw-bold">{posts.topic.title}</span>
+		<br/>
+		<p class="snippet text-break text-wrap">
+		{posts.snippet}
+		</p>
+		<small class="post-info float-end">
+			<div class="category-item d-inline-block">
+				{buildCategoryIcon(./category, "24px", "rounded-circle")} {posts.category.name}
+				&bull; <span class="timeago" title="{posts.timestampISO}"></span>
+			</div>
+		</small>
+	</a>
+</li>
+<!-- IF !@last -->
+<li role="separator" class="dropdown-divider"></li>
+<!-- ENDIF -->
+{{{end}}}
+</ul>
+<!-- IF multiplePages -->
+<div class="text-center mt-2">
+	<a href="{url}">
+		[[search:see-more-results, {matchCount}]]
+	</a>
+</div>
+<!-- ENDIF multiplePages -->
+{{{if !posts.length}}}
+<div class="text-center no-results">[[search:no-matches]]</li>
 {{{end}}}