nodebb-theme-harmony 1.2.11 → 1.2.13

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

@@ -1,4 +1,4 @@
-<button type="button" class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown">
+<button type="button" class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
     {{{ if selectedTag }}}
     <span class="d-inline-flex align-items-center gap-1">
         <i class="fa fa-fw fa-tags text-primary"></i>
@@ -12,16 +12,16 @@
 <div component="tag/filter/search" class="hidden position-absolute top-0">
     <input type="text" class="form-control form-control-sm" placeholder="[[search:type-to-search]]" autocomplete="off">
 </div>
-<ul component="tag/filter/list" class="dropdown-menu p-1 text-sm overflow-auto" role="menu" style="max-height: 500px;">
+<ul component="tag/filter/list" class="dropdown-menu p-1 text-sm overflow-auto" role="menu" style="max-height: 500px;" role="menu">
     <li role="presentation" data-tag="">
-        <a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menu-item" href="#">
+        <a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem" href="#">
             <span class="flex-grow-1">[[tags:all-tags]]</span>
             <i component="tag/select/icon" class="flex-shrink-0 fa fa-fw fa-check {{{if selectedTag }}}invisible{{{ end }}}"></i>
         </a>
     </li>
     {{{ each tagItems }}}
     <li role="presentation" data-tag="{./valueEscaped}">
-        <a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menu-item" href="#">
+        <a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem" href="#">
             <span component="tag-markup" class="flex-grow-1">
                 <div class="d-inline-flex align-items-center gap-1">
                     {./valueEscaped}

package/templates/partials/tags/watch.tpl

@@ -1,6 +1,6 @@
 {{{ if config.loggedIn }}}
 <div class="btn-group bottom-sheet" component="tag/watch">
-	<button class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" type="button">
+	<button class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" type="button" aria-haspopup="true" aria-expanded="false">
 		<span component="tag/following/menu" class="d-flex gap-2 align-items-center{{{ if !isFollowing }}} hidden{{{ end }}}">
 			<i class="flex-shrink-0 fa fa-fw fa-bell-o text-primary"></i>
 			<span class="d-none d-md-inline fw-semibold">[[tags:watching]]</span>
@@ -11,9 +11,9 @@
 			<span class="d-none d-md-inline fw-semibold">[[tags:not-watching]]</span>
 		</span>
 	</button>
-	<ul class="dropdown-menu p-1 text-sm">
+	<ul class="dropdown-menu p-1 text-sm" role="menu">
 		<li>
-			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="tag/following">
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="tag/following" role="menuitem">
 				<div class="flex-grow-1 d-flex flex-column">
 					<span class="d-flex align-items-center gap-2">
 						<i class="flex-shrink-0 fa fa-fw fa-bell-o"></i>
@@ -26,7 +26,7 @@
 		</li>
 
 		<li>
-			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="tag/not-following">
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="tag/not-following" role="menuitem">
 				<div class="flex-grow-1 d-flex flex-column">
 					<span class="d-flex align-items-center gap-2">
 						<i class="flex-shrink-0 fa fa-fw fa-bell-slash-o"></i>

package/templates/partials/topic/navigator-mobile.tpl

@@ -15,7 +15,7 @@
 				{{{ end }}}
 			</div>
 
-			<a href="#" class="text-reset dropdown-toggle d-inline-block px-3 text-decoration-none" data-bs-toggle="dropdown">
+			<a href="#" class="text-reset dropdown-toggle d-inline-block px-3 text-decoration-none" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 				<span class="d-inline-flex gap-2 align-items-center pagination-text position-relative fw-bold"></span>
 			</a>
 

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

@@ -1,22 +1,22 @@
 {{{ if posts.display_moderator_tools }}}
 <li>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/edit" role="menuitem" tabindex="-1" href="#">
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/edit" role="menuitem" href="#">
 		<span class="menu-icon"><i class="fa fa-fw text-muted fa-pencil"></i></span> [[topic:edit]]
 	</a>
 </li>
 <li {{{ if posts.deleted }}}hidden{{{ end }}}>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/delete" role="menuitem" tabindex="-1" href="#" class="{{{ if posts.deleted }}}hidden{{{ end }}}">
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/delete" role="menuitem" href="#" class="{{{ if posts.deleted }}}hidden{{{ end }}}">
 		<span class="menu-icon"><i class="fa fa-fw text-muted fa-trash-o"></i></span> [[topic:delete]]
 	</a>
 </li>
 <li {{{ if !posts.deleted }}}hidden{{{ end }}}>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/restore" role="menuitem" tabindex="-1" href="#" class="{{{ if !posts.deleted }}}hidden{{{ end }}}">
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/restore" role="menuitem" href="#" class="{{{ if !posts.deleted }}}hidden{{{ end }}}">
 		<span class="menu-icon"><i class="fa fa-fw text-muted fa-history"></i></span> [[topic:restore]]
 	</a>
 </li>
 {{{ if posts.display_purge_tools }}}
 <li {{{ if !posts.deleted }}}hidden{{{ end }}}>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/purge" role="menuitem" tabindex="-1" href="#" class="{{{ if !posts.deleted }}}hidden{{{ end }}}">
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/purge" role="menuitem" href="#" class="{{{ if !posts.deleted }}}hidden{{{ end }}}">
 		<span class="menu-icon"><i class="fa fa-fw text-muted fa-eraser"></i></span> [[topic:purge]]
 	</a>
 </li>
@@ -24,7 +24,7 @@
 
 {{{ if posts.display_move_tools }}}
 <li>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/move" role="menuitem" tabindex="-1" href="#">
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/move" role="menuitem" href="#">
 		<span class="menu-icon"><i class="fa fa-fw text-muted fa-arrows"></i></span> [[topic:move]]
 	</a>
 </li>
@@ -32,7 +32,7 @@
 
 {{{ if posts.display_change_owner_tools }}}
 <li>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/change-owner" role="menuitem" tabindex="-1" href="#">
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/change-owner" role="menuitem" href="#">
 		<span class="menu-icon"><i class="fa fa-fw text-muted fa-user"></i></span> [[topic:change-owner]]
 	</a>
 </li>
@@ -40,13 +40,13 @@
 
 {{{ if posts.ip }}}
 <li>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/copy-ip" role="menuitem" tabindex="-1" href="#" data-clipboard-text="{posts.ip}">
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/copy-ip" role="menuitem" href="#" data-clipboard-text="{posts.ip}">
 		<span class="menu-icon" ><i class="fa fa-fw text-muted fa-copy"></i></span> [[topic:copy-ip]] {posts.ip}
 	</a>
 </li>
 {{{ if posts.display_ip_ban }}}
 <li>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/ban-ip" role="menuitem" tabindex="-1" href="#" data-ip="{posts.ip}">
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/ban-ip" role="menuitem" href="#" data-ip="{posts.ip}">
 		<span class="menu-icon"><i class="fa fa-fw text-muted fa-ban"></i></span> [[topic:ban-ip]] {posts.ip}
 	</a>
 </li>
@@ -56,7 +56,7 @@
 
 {{{ each posts.tools }}}
 <li {{{ if ./disabled }}}class="disabled" {{{ end }}}>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" {{{ if ./action}}}component="{./action}"{{{ end }}} role="menuitem" tabindex="-1" href="{{{ if ./href }}}{./href}{{{ else }}}#{{{ end }}}">
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" {{{ if ./action}}}component="{./action}"{{{ end }}} role="menuitem" href="{{{ if ./href }}}{./href}{{{ else }}}#{{{ end }}}">
 		<span class="menu-icon"><i class="fa fa-fw text-muted {./icon}"></i></span> {{./html}}
 	</a>
 </li>
@@ -65,7 +65,7 @@
 {{{ if !posts.deleted }}}
 	{{{ if posts.display_history}}}
 	<li>
-		<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/view-history" role="menuitem" tabindex="-1" href="#">
+		<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/view-history" role="menuitem" href="#">
 			<span class="menu-icon"><i class="fa fa-fw text-muted fa-history"></i></span> [[topic:view-history]]
 		</a>
 	</li>
@@ -73,7 +73,7 @@
 
 	{{{ if config.loggedIn }}}
 	<li>
-		<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/bookmark" role="menuitem" tabindex="-1" href="#" data-bookmarked="{posts.bookmarked}">
+		<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/bookmark" role="menuitem" href="#" data-bookmarked="{posts.bookmarked}">
 			<span class="menu-icon">
 				<i component="post/bookmark/on" class="fa fa-fw text-muted fa-bookmark {{{ if !posts.bookmarked }}}hidden{{{ end }}}"></i>
 				<i component="post/bookmark/off" class="fa fa-fw text-muted fa-bookmark-o {{{ if posts.bookmarked }}}hidden{{{ end }}}"></i>
@@ -85,7 +85,7 @@
 	{{{ end }}}
 
 	<li>
-		<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem" tabindex="-1" href="#" data-clipboard-text="{posts.absolute_url}">
+		<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem" href="#" data-clipboard-text="{posts.absolute_url}">
 			<i class="fa fa-fw text-muted fa-link"></i> [[topic:copy-permalink]]
 		</a>
 	</li>
@@ -96,7 +96,7 @@
 	{{{ end }}}
 	<li class="d-flex gap-2 px-3">
 		{{{ each postSharing }}}
-		<a class="dropdown-item rounded-1 d-flex align-items-center px-1 py-2 w-auto" role="menuitem" component="share/{./id}" tabindex="-1" href="#" title="{./name}"><i class="fa-fw text-muted {./class}"></i></a>
+		<a class="dropdown-item rounded-1 d-flex align-items-center px-1 py-2 w-auto" role="menuitem" component="share/{./id}" href="#" title="{./name}"><i class="fa-fw text-muted {./class}"></i></a>
 		{{{ end }}}
 	</li>
 {{{ end }}}
@@ -105,15 +105,15 @@
 <li class="dropdown-divider"></li>
 
 <li {{{ if posts.flags.flagged }}}hidden{{{ end }}}>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/flag" role="menuitem" tabindex="-1" href="#"><i class="fa fa-fw text-muted fa-flag"></i> [[topic:flag-post]]</a>
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/flag" role="menuitem" href="#"><i class="fa fa-fw text-muted fa-flag"></i> [[topic:flag-post]]</a>
 </li>
 <li {{{ if !posts.flags.flagged }}}hidden{{{ end }}} class="disabled text-muted">
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/already-flagged" role="menuitem" tabindex="-1" href="#"><i class="fa fa-fw text-muted fa-flag"></i> [[topic:already-flagged]]</a>
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/already-flagged" role="menuitem" href="#"><i class="fa fa-fw text-muted fa-flag"></i> [[topic:already-flagged]]</a>
 </li>
 
 {{{ if (!posts.selfPost && posts.uid) }}}
 <li>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/flagUser" role="menuitem" tabindex="-1" href="#"><i class="fa fa-fw text-muted fa-flag"></i> [[topic:flag-user]]</a>
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/flagUser" role="menuitem" href="#"><i class="fa fa-fw text-muted fa-flag"></i> [[topic:flag-user]]</a>
 </li>
 {{{ end }}}
 {{{ end }}}
@@ -121,11 +121,11 @@
 {{{ if posts.display_moderator_tools }}}
 {{{ if posts.flags.exists }}}
 <li>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem" tabindex="-1" href="{config.relative_path}/flags/{posts.flags.flagId}"><i class="fa fa-fw text-muted fa-exclamation-circle"></i> [[topic:view-flag-report]]</a>
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem" href="{config.relative_path}/flags/{posts.flags.flagId}"><i class="fa fa-fw text-muted fa-exclamation-circle"></i> [[topic:view-flag-report]]</a>
 </li>
 {{{ if (posts.flags.state == "open") }}}
 <li>
-	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/flagResolve" data-flagId="{posts.flags.flagId}" role="menuitem" tabindex="-1" href="#"><i class="fa fa-fw text-muted fa-check"></i> [[topic:resolve-flag]]</a>
+	<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" component="post/flagResolve" data-flagId="{posts.flags.flagId}" role="menuitem" href="#"><i class="fa fa-fw text-muted fa-check"></i> [[topic:resolve-flag]]</a>
 </li>
 {{{ end }}}
 {{{ end }}}

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

@@ -1,5 +1,5 @@
 <span component="post/tools" class="dropdown moderator-tools bottom-sheet d-inline-block {{{ if !./display_post_menu }}}hidden{{{ end }}}">
-	<a class="btn-ghost-sm ff-secondary dropdown-toggle d-block" href="#" data-bs-toggle="dropdown"><i class="fa fa-fw fa-ellipsis-v text-primary"></i></a>
+	<a class="btn-ghost-sm ff-secondary dropdown-toggle d-block" href="#" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" aria-label="[[topic:post-tools]]"><i class="fa fa-fw fa-ellipsis-v text-primary"></i></a>
 	<ul class="dropdown-menu dropdown-menu-end p-1 text-sm" role="menu">
 		<li class="dropdown-item placeholder-wave">
 			<div class="placeholder" style="width: 20px;"></div>

package/templates/partials/topic/post.tpl

@@ -111,16 +111,16 @@
 
 		{{{ if !reputation:disabled }}}
 		<div class="d-flex votes align-items-center">
-			<a component="post/upvote" href="#" class="btn-ghost-sm {{{ if posts.upvoted }}}upvoted{{{ end }}}">
+			<a component="post/upvote" href="#" class="btn-ghost-sm {{{ if posts.upvoted }}}upvoted{{{ end }}}" title="[[topic:upvote-post]]">
 				<i class="fa fa-fw fa-chevron-up text-primary"></i>
 			</a>
 
 			<meta itemprop="upvoteCount" content="{posts.upvotes}">
 			<meta itemprop="downvoteCount" content="{posts.downvotes}">
-			<div class="d-inline-block px-2 mx-1 btn-ghost-sm ff-secondary" component="post/vote-count" data-votes="{posts.votes}">{posts.votes}</div>
+			<a href="#" class="d-inline-block px-2 mx-1 btn-ghost-sm ff-secondary" component="post/vote-count" data-votes="{posts.votes}" title="[[global:voters]]">{posts.votes}</a>
 
 			{{{ if !downvote:disabled }}}
-			<a component="post/downvote" href="#" class="btn-ghost-sm {{{ if posts.downvoted }}}downvoted{{{ end }}}">
+			<a component="post/downvote" href="#" class="btn-ghost-sm {{{ if posts.downvoted }}}downvoted{{{ end }}}" title="[[topic:downvote-post]]">
 				<i class="fa fa-fw fa-chevron-down text-primary"></i>
 			</a>
 			{{{ end }}}

package/templates/partials/topic/quickreply.tpl

@@ -15,7 +15,7 @@
 		</div>
 		<div>
 			<div class="d-flex justify-content-end gap-2">
-				<button type="submit" component="topic/quickreply/expand" class="btn btn-sm btn-ghost-sm border" formmethod="get"><i class="fa fa-expand"></i></button>
+				<button type="submit" component="topic/quickreply/expand" class="btn-ghost-sm border"><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>
 			</div>
 		</div>

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

@@ -1,10 +1,10 @@
 <div component="topic/reply/container" class="btn-group action-bar {{{ if !privileges.topics:reply }}}hidden{{{ end }}}">
 	<a href="{config.relative_path}/compose?tid={tid}" 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">
+	<button type="button" class="btn btn-sm btn-primary dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 		<span class="caret"></span>
 	</button>
 	<ul class="dropdown-menu dropdown-menu-end p-1 text-sm" role="menu">
-		<li><a class="dropdown-item rounded-1" href="#" component="topic/reply-as-topic">[[topic:reply-as-topic]]</a></li>
+		<li><a class="dropdown-item rounded-1" href="#" component="topic/reply-as-topic" role="menuitem">[[topic:reply-as-topic]]</a></li>
 	</ul>
 </div>
 

package/templates/partials/topic/sort.tpl

@@ -1,25 +1,28 @@
 <div class="btn-group bottom-sheet" component="thread/sort">
-	<button class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" type="button">
+	<button class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 		<span class="d-flex gap-2 align-items-center">
 			<i class="fa fa-fw fa-arrow-down-wide-short text-primary"></i>
 			<span class="d-none d-md-inline fw-semibold">[[topic:sort-by]]</span>
 		</span>
 	</button>
-	<ul class="dropdown-menu p-1 text-sm">
-		<li><a class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#" class="oldest_to_newest" data-sort="oldest_to_newest">
-			<span class="flex-grow-1">[[topic:oldest-to-newest]]</span>
-			<i class="flex-shrink-0 fa fa-fw"></i>
-		</a>
+	<ul class="dropdown-menu p-1 text-sm" role="menu">
+		<li>
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#" class="oldest_to_newest" data-sort="oldest_to_newest" role="menuitem">
+				<span class="flex-grow-1">[[topic:oldest-to-newest]]</span>
+				<i class="flex-shrink-0 fa fa-fw"></i>
+			</a>
 		</li>
-		<li><a class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#" class="newest_to_oldest" data-sort="newest_to_oldest">
-			<span class="flex-grow-1">[[topic:newest-to-oldest]]</span>
-			<i class="flex-shrink-0 fa fa-fw"></i>
-		</a>
+		<li>
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#" class="newest_to_oldest" data-sort="newest_to_oldest" role="menuitem">
+				<span class="flex-grow-1">[[topic:newest-to-oldest]]</span>
+				<i class="flex-shrink-0 fa fa-fw"></i>
+			</a>
 		</li>
-		<li><a class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#" class="most_votes" data-sort="most_votes">
-			<span class="flex-grow-1">[[topic:most-votes]]</span>
-			<i class="flex-shrink-0 fa fa-fw"></i>
-		</a>
+		<li>
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#" class="most_votes" data-sort="most_votes" role="menuitem">
+				<span class="flex-grow-1">[[topic:most-votes]]</span>
+				<i class="flex-shrink-0 fa fa-fw"></i>
+			</a>
 		</li>
 	</ul>
 </div>

package/templates/partials/topic/tools.tpl

@@ -1,10 +1,10 @@
 {{{ if privileges.view_thread_tools }}}
 <div class="btn-group thread-tools bottom-sheet">
-	<button class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" type="button">
+	<button class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" type="button" aria-haspopup="true" aria-expanded="false">
 		<i class="fa fa-fw fa-gear text-primary"></i>
 		<span class="d-none d-md-inline fw-semibold">[[topic:thread-tools.title]]</span>
 	</button>
-	<ul class="dropdown-menu p-1 text-sm">
+	<ul class="dropdown-menu p-1 text-sm" role="menu">
 		<li class="placeholder-wave"><a class="dropdown-item d-flex gap-2" href="#"><div class="placeholder bg-secondary rounded-1" style="width: 1em;"></div><div class="placeholder bg-secondary rounded-1 col-8"></div></a></li>
 		<li class="placeholder-wave"><a class="dropdown-item d-flex gap-2" href="#"><div class="placeholder bg-secondary rounded-1" style="width: 1em;"></div><div class="placeholder bg-secondary rounded-1 col-8"></div></a></li>
 		<li class="placeholder-wave"><a class="dropdown-item d-flex gap-2" href="#"><div class="placeholder bg-secondary rounded-1" style="width: 1em;"></div><div class="placeholder bg-secondary rounded-1 col-8"></div></a></li>

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

@@ -1,33 +1,74 @@
 {{{ if privileges.editable }}}
-<li {{{ if locked }}}hidden{{{ end }}}><a component="topic/lock" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if locked }}}hidden{{{ end }}}"><i class="fa fa-fw text-muted fa-lock"></i> [[topic:thread-tools.lock]]</a></li>
-<li {{{ if !locked }}}hidden{{{ end }}}><a component="topic/unlock" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if !locked }}}hidden{{{ end }}}"><i class="fa fa-fw text-muted fa-unlock"></i> [[topic:thread-tools.unlock]]</a></li>
-<li {{{ if pinned }}}hidden{{{ end }}}><a component="topic/pin" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if pinned }}}hidden{{{ end }}}"><i class="fa fa-fw text-muted fa-thumb-tack"></i> [[topic:thread-tools.pin]]</a></li>
-<li {{{ if !pinned }}}hidden{{{ end }}}><a component="topic/unpin" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if !pinned }}}hidden{{{ end }}}"><i class="fa fa-fw text-muted fa-thumb-tack fa-rotate-90"></i> [[topic:thread-tools.unpin]]</a></li>
-
-<li><a component="topic/move" class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#"><i class="fa fa-fw text-muted fa-arrows"></i> [[topic:thread-tools.move]]</a></li>
-<li><a component="topic/merge" class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#"><i class="fa fa-fw text-muted fa-code-fork"></i> [[topic:thread-tools.merge]]</a></li>
-<li><a component="topic/fork" class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#"><i class="fa fa-fw text-muted fa-code-fork"></i> [[topic:thread-tools.fork]]</a></li>
-<li><a component="topic/tag" class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#"><i class="fa fa-fw text-muted fa-tag"></i> [[topic:thread-tools.tag]]</a></li>
+<li {{{ if locked }}}hidden{{{ end }}}>
+	<a component="topic/lock" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if locked }}}hidden{{{ end }}}" role="menuitem"><i class="fa fa-fw text-muted fa-lock"></i> [[topic:thread-tools.lock]]</a>
+</li>
+
+<li {{{ if !locked }}}hidden{{{ end }}}>
+	<a component="topic/unlock" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if !locked }}}hidden{{{ end }}}" role="menuitem"><i class="fa fa-fw text-muted fa-unlock"></i> [[topic:thread-tools.unlock]]</a>
+</li>
+
+<li {{{ if pinned }}}hidden{{{ end }}}>
+	<a component="topic/pin" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if pinned }}}hidden{{{ end }}}" role="menuitem"><i class="fa fa-fw text-muted fa-thumb-tack"></i> [[topic:thread-tools.pin]]</a>
+</li>
+
+<li {{{ if !pinned }}}hidden{{{ end }}}>
+	<a component="topic/unpin" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if !pinned }}}hidden{{{ end }}}" role="menuitem"><i class="fa fa-fw text-muted fa-thumb-tack fa-rotate-90"></i> [[topic:thread-tools.unpin]]</a>
+</li>
+
+<li>
+	<a component="topic/move" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem"><i class="fa fa-fw text-muted fa-arrows"></i> [[topic:thread-tools.move]]</a>
+</li>
+
+<li>
+	<a component="topic/merge" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem"><i class="fa fa-fw text-muted fa-code-fork"></i> [[topic:thread-tools.merge]]</a>
+</li>
+
+<li>
+	<a component="topic/fork" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem"><i class="fa fa-fw text-muted fa-code-fork"></i> [[topic:thread-tools.fork]]</a>
+</li>
+
+<li>
+	<a component="topic/tag" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem"><i class="fa fa-fw text-muted fa-tag"></i> [[topic:thread-tools.tag]]</a>
+</li>
+
 {{{ if !scheduled }}}
-<li><a component="topic/move-posts" class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#"><i class="fa fa-fw text-muted fa-arrows"></i> [[topic:thread-tools.move-posts]]</a></li>
+<li>
+	<a component="topic/move-posts" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem"><i class="fa fa-fw text-muted fa-arrows"></i> [[topic:thread-tools.move-posts]]</a>
+</li>
 {{{ end }}}
-<li><a component="topic/mark-unread-for-all" class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#"><i class="fa fa-fw text-muted fa-inbox"></i> [[topic:thread-tools.markAsUnreadForAll]]</a></li>
+
+<li>
+	<a component="topic/mark-unread-for-all" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem"><i class="fa fa-fw text-muted fa-inbox"></i> [[topic:thread-tools.markAsUnreadForAll]]</a>
+</li>
+
 <li class="dropdown-divider"></li>
 {{{ end }}}
 
 {{{ if privileges.deletable }}}
-<li {{{ if deleted }}}hidden{{{ end }}}><a component="topic/delete" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if deleted }}}hidden{{{ end }}}"><i class="fa fa-fw text-muted fa-trash-o"></i> [[topic:thread-tools.delete]]</a></li>
+<li {{{ if deleted }}}hidden{{{ end }}}>
+	<a component="topic/delete" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if deleted }}}hidden{{{ end }}}" role="menuitem"><i class="fa fa-fw text-muted fa-trash-o"></i> [[topic:thread-tools.delete]]</a>
+</li>
+
 {{{ if !scheduled }}}
-<li {{{ if !deleted }}}hidden{{{ end }}}><a component="topic/restore" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if !deleted }}}hidden{{{ end }}}"><i class="fa fa-fw text-muted fa-history"></i> [[topic:thread-tools.restore]]</a></li>
+<li {{{ if !deleted }}}hidden{{{ end }}}>
+	<a component="topic/restore" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if !deleted }}}hidden{{{ end }}}" role="menuitem"><i class="fa fa-fw text-muted 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 rounded-1 d-flex align-items-center gap-2 {{{ if !deleted }}}hidden{{{ end }}}"><i class="fa fa-fw text-muted fa-eraser"></i> [[topic:thread-tools.purge]]</a></li>
+<li {{{ if !deleted }}}hidden{{{ end }}}>
+	<a component="topic/purge" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {{{ if !deleted }}}hidden{{{ end }}}" role="menuitem"><i class="fa fa-fw text-muted fa-eraser"></i> [[topic:thread-tools.purge]]</a>
+</li>
 {{{ end }}}
 {{{ if privileges.isAdminOrMod }}}
-<li><a component="topic/delete/posts" class="dropdown-item rounded-1 d-flex align-items-center gap-2" href="#"><i class="fa fa-fw text-muted fa-trash-o"></i> [[topic:thread-tools.delete-posts]]</a></li>
+<li>
+	<a component="topic/delete/posts" href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem"><i class="fa fa-fw text-muted fa-trash-o"></i> [[topic:thread-tools.delete-posts]]</a>
+</li>
 {{{ end }}}
 
 {{{ each thread_tools }}}
-<li><a href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {./class}"><i class="fa fa-fw text-muted {./icon}"></i> {./title}</a></li>
+<li>
+	<a href="#" class="dropdown-item rounded-1 d-flex align-items-center gap-2 {./class}" role="menuitem"><i class="fa fa-fw text-muted {./icon}"></i> {./title}</a>
+</li>
 {{{ end }}}
 {{{ end }}}

package/templates/partials/topic/watch.tpl

@@ -1,6 +1,6 @@
 {{{ if config.loggedIn }}}
 <div class="btn-group bottom-sheet" component="topic/watch">
-	<button class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" type="button">
+	<button class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" type="button" aria-haspopup="true" aria-expanded="false">
 		<span component="topic/following/menu" class="d-flex gap-2 align-items-center{{{ if !isFollowing }}} hidden{{{ end }}}">
 			<i class="flex-shrink-0 fa fa-fw fa-bell-o text-primary"></i>
 			<span class="d-none d-md-inline fw-semibold">[[topic:watching]]</span>
@@ -16,9 +16,9 @@
 			<span class="d-none d-md-inline fw-semibold">[[topic:ignoring]]</span>
 		</span>
 	</button>
-	<ul class="dropdown-menu p-1 text-sm">
+	<ul class="dropdown-menu p-1 text-sm" role="menu">
 		<li>
-			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="topic/following">
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="topic/following" role="menuitem">
 				<div class="flex-grow-1 d-flex flex-column">
 					<span class="d-flex align-items-center gap-2">
 						<i class="flex-shrink-0 fa fa-fw fa-bell-o"></i>
@@ -31,7 +31,7 @@
 		</li>
 
 		<li>
-			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="topic/not-following">
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="topic/not-following" role="menuitem">
 				<div class="flex-grow-1 d-flex flex-column">
 					<span class="d-flex align-items-center gap-2">
 						<i class="flex-shrink-0 fa fa-fw fa-bell-slash-o"></i>
@@ -44,7 +44,7 @@
 		</li>
 
 		<li>
-			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="topic/ignoring">
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2 p-2" href="#" component="topic/ignoring" role="menuitem">
 				<div class="flex-grow-1 d-flex flex-column">
 					<span class="d-flex align-items-center gap-2">
 						<i class="flex-shrink-0 fa fa-fw fa-eye-slash"></i>

package/templates/partials/topic-filters.tpl

@@ -1,12 +1,12 @@
 <div class="btn-group bottom-sheet{{{ if !filters.length }}} hidden{{{ end }}}">
-	<button type="button" class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown">
+	<button type="button" class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 		<i class="fa fa-fw fa-filter text-primary"></i>
 		<span class="visible-md-inline visible-lg-inline fw-semibold">{selectedFilter.name}</span>
 	</button>
 	<ul class="dropdown-menu p-1 text-sm" role="menu">
 		{{{each filters}}}
 		<li role="presentation" class="category {{{if filters.selected}}}selected{{{end}}}">
-			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menu-item" href="{config.relative_path}/{filters.url}">
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem" href="{config.relative_path}/{filters.url}">
 				<div class="flex-grow-1">{filters.name}</div>
 				<i class="flex-shrink-0 fa fa-fw {{{ if filters.selected }}}fa-check{{{ end }}}"></i>
 			</a>

package/templates/partials/topic-terms.tpl

@@ -1,12 +1,12 @@
 <div class="btn-group bottom-sheet {{{ if !terms.length }}}hidden{{{ end }}}">
-	<button type="button" class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown">
+	<button type="button" class="btn-ghost-sm ff-secondary d-flex gap-2 dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 		<i class="fa fa-fw fa-clock text-primary"></i>
 		<span class="visible-md-inline visible-lg-inline fw-semibold">{selectedTerm.name}</span>
 	</button>
 	<ul class="dropdown-menu p-1 text-sm" role="menu">
 		{{{each terms}}}
 		<li role="presentation" class="category">
-			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menu-item" href="{config.relative_path}/{terms.url}">
+			<a class="dropdown-item rounded-1 d-flex align-items-center gap-2" role="menuitem" href="{config.relative_path}/{terms.url}">
 				<div class="flex-grow-1">{terms.name}</div>
 				<i class="flex-shrink-0 fa fa-fw {{{ if terms.selected }}}fa-check{{{ end }}}"></i>
 			</a>

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

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

package/templates/post-queue.tpl

@@ -23,16 +23,16 @@
 			<button type="button" class="btn-ghost-sm ff-secondary dropdown-toggle" data-bs-toggle="dropdown" autocomplete="off" aria-haspopup="true" aria-expanded="false">
 				<i class="fa fa-clone text-primary"></i><span class="fw-semibold"> [[post-queue:bulk-actions]]</span>
 			</button>
-			<ul class="dropdown-menu p-1 text-sm dropdown-menu-end">
+			<ul class="dropdown-menu p-1 text-sm dropdown-menu-end" role="menu">
 				{{{ if canAccept }}}
-				<li><a class="dropdown-item rounded-1" href="#" data-action="accept-all">[[post-queue:accept-all]]</a></li>
-				<li><a class="dropdown-item rounded-1" href="#" data-action="accept-selected">[[post-queue:accept-selected]]</a></li>
+				<li><a class="dropdown-item rounded-1" href="#" data-action="accept-all" role="menuitem">[[post-queue:accept-all]]</a></li>
+				<li><a class="dropdown-item rounded-1" href="#" data-action="accept-selected" role="menuitem">[[post-queue:accept-selected]]</a></li>
 				<li class="dropdown-divider"></li>
-				<li><a class="dropdown-item rounded-1" href="#" data-action="reject-all">[[post-queue:reject-all]]</a></li>
-				<li><a class="dropdown-item rounded-1" href="#" data-action="reject-selected">[[post-queue:reject-selected]]</a></li>
+				<li><a class="dropdown-item rounded-1" href="#" data-action="reject-all" role="menuitem">[[post-queue:reject-all]]</a></li>
+				<li><a class="dropdown-item rounded-1" href="#" data-action="reject-selected" role="menuitem">[[post-queue:reject-selected]]</a></li>
 				{{{ else }}}
-				<li><a class="dropdown-item rounded-1" href="#" data-action="reject-all">[[post-queue:remove-all]]</a></li>
-				<li><a class="dropdown-item rounded-1" href="#" data-action="reject-selected">[[post-queue:remove-selected]]</a></li>
+				<li><a class="dropdown-item rounded-1" href="#" data-action="reject-all" role="menuitem">[[post-queue:remove-all]]</a></li>
+				<li><a class="dropdown-item rounded-1" href="#" data-action="reject-selected" role="menuitem">[[post-queue:remove-selected]]</a></li>
 				{{{ end }}}
 			</ul>
 		</div>
@@ -79,22 +79,22 @@
 								{{{ if ((privileges.ban || privileges.mute) || privileges.admin:users) }}}
 								<div class="ms-auto btn-group bottom-sheet">
 									<button href="#" class="btn btn-ghost-sm ff-secondary border text-xs dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">[[global:actions]]</button>
-									<ul class="dropdown-menu p-1 text-sm">
+									<ul class="dropdown-menu p-1 text-sm" role="menu">
 										{{{ if privileges.view:users:info }}}
-										<li><a class="dropdown-item rounded-1" href="{config.relative_path}/user/{./user.userslug}/info">[[user:account-info]]</a></li>
+										<li><a class="dropdown-item rounded-1" href="{config.relative_path}/user/{./user.userslug}/info" role="menuitem">[[user:account-info]]</a></li>
 										{{{ end }}}
 										{{{ if privileges.ban }}}
-										<li class="{{{ if target.user.banned }}}hidden{{{ end }}}"><a class="dropdown-item rounded-1" href="#" data-action="ban">[[user:ban-account]]</a></li>
-										<li class="{{{ if !target.user.banned }}}hidden{{{ end }}}"><a class="dropdown-item rounded-1" href="#" data-action="unban">[[user:unban-account]]</a></li>
+										<li class="{{{ if target.user.banned }}}hidden{{{ end }}}"><a class="dropdown-item rounded-1" href="#" data-action="ban" role="menuitem">[[user:ban-account]]</a></li>
+										<li class="{{{ if !target.user.banned }}}hidden{{{ end }}}"><a class="dropdown-item rounded-1" href="#" data-action="unban" role="menuitem">[[user:unban-account]]</a></li>
 										{{{ end }}}
 										{{{ if privileges.mute}}}
-										<li class="{{{ if target.user.muted }}}hidden{{{ end }}}"><a class="dropdown-item rounded-1" href="#" data-action="mute">[[user:mute-account]]</a></li>
-										<li class="{{{ if !target.user.muted }}}hidden{{{ end }}}"><a class="dropdown-item rounded-1" href="#" data-action="unmute">[[user:unmute-account]]</a></li>
+										<li class="{{{ if target.user.muted }}}hidden{{{ end }}}"><a class="dropdown-item rounded-1" href="#" data-action="mute" role="menuitem">[[user:mute-account]]</a></li>
+										<li class="{{{ if !target.user.muted }}}hidden{{{ end }}}"><a class="dropdown-item rounded-1" href="#" data-action="unmute" role="menuitem">[[user:unmute-account]]</a></li>
 										{{{ end }}}
 										{{{ if privileges.admin:users }}}
-										<li><a class="dropdown-item rounded-1" href="#" data-action="delete-account">[[user:delete-account-as-admin]]</a></li>
-										<li><a class="dropdown-item rounded-1" href="#" data-action="delete-content">[[user:delete-content]]</a></li>
-										<li><a class="dropdown-item rounded-1" href="#" data-action="delete-all">[[user:delete-all]]</a></li>
+										<li><a class="dropdown-item rounded-1" href="#" data-action="delete-account" role="menuitem">[[user:delete-account-as-admin]]</a></li>
+										<li><a class="dropdown-item rounded-1" href="#" data-action="delete-content" role="menuitem">[[user:delete-content]]</a></li>
+										<li><a class="dropdown-item rounded-1" href="#" data-action="delete-all" role="menuitem">[[user:delete-all]]</a></li>
 										{{{ end }}}
 									</ul>
 								</div>