fa2bi continued

7 files changed, 75 insertions, 91 deletions

diff --git a/Zotlabs/Lib/ThreadItem.php b/Zotlabs/Lib/ThreadItem.php
index 6081ca272..bca5aa047 100644
--- a/Zotlabs/Lib/ThreadItem.php
+++ b/Zotlabs/Lib/ThreadItem.php
@@ -93,7 +93,7 @@ class ThreadItem {
 		$buttons = '';
 		$dropping = false;
 		$star = false;
-		$isstarred = "unstarred fa-star-o";
+		$isstarred = "unstarred bi-star";
 		$is_comment = false;
 		$is_item = false;
 		$osparkle = '';
@@ -573,7 +573,7 @@ class ThreadItem {
 			if(($nb_children > $visible_comments) || ($thread_level > 1)) {
 				$result['children'][0]['comment_firstcollapsed'] = true;
 				$result['children'][0]['num_comments'] = $comment_count_txt['label'];
-				$result['children'][0]['hide_text'] = sprintf( t('%s show all'), '<i class="fa fa-chevron-down"></i>');
+				$result['children'][0]['hide_text'] = sprintf( t('%s show all'), '<i class="bi bi-chevron-down"></i>');
 				if($thread_level > 1) {
 					$result['children'][$nb_children - 1]['comment_lastcollapsed'] = true;
 				}
diff --git a/include/js_strings.php b/include/js_strings.php
index 090d28ce3..6226b51c6 100644
--- a/include/js_strings.php
+++ b/include/js_strings.php
@@ -5,10 +5,10 @@ function js_strings() {
 		'$delitem'     => t('Delete this item?'),
 		'$itemdel'     => t('Item deleted'),
 		'$comment'     => t('Comment'),
-		'$showmore'    => sprintf( t('%s show all'), '<i class=\'fa fa-chevron-down\'></i>'),
-		'$showfewer'   => sprintf( t('%s show less'), '<i class=\'fa fa-chevron-up\'></i>'),
-		'$divgrowmore' => sprintf( t('%s expand'), '<i class=\'fa fa-chevron-down\'></i>'),
-		'$divgrowless' => sprintf( t('%s collapse'),'<i class=\'fa fa-chevron-up\'></i>'),
+		'$showmore'    => sprintf( t('%s show all'), '<i class=\'bi bi-chevron-down\'></i>'),
+		'$showfewer'   => sprintf( t('%s show less'), '<i class=\'bi bi-chevron-up\'></i>'),
+		'$divgrowmore' => sprintf( t('%s expand'), '<i class=\'bi bi-chevron-down\'></i>'),
+		'$divgrowless' => sprintf( t('%s collapse'),'<i class=\'bi bi-chevron-up\'></i>'),
 		'$pwshort'     => t("Password too short"),
 		'$pwnomatch'   => t("Passwords do not match"),
 		'$everybody'   => t('everybody'),
diff --git a/view/css/bootstrap-red.css b/view/css/bootstrap-red.css
index 753633ba4..e494dc960 100644
--- a/view/css/bootstrap-red.css
+++ b/view/css/bootstrap-red.css
@@ -37,6 +37,10 @@ nav .dropdown-menu {
 	overflow: auto;
 }
 
+.navbar-expand-lg .navbar-nav .nav-link {
+	padding-right: var(--bs-navbar-nav-link-padding-x);
+	padding-left: var(--bs-navbar-nav-link-padding-x);
+}
 
 /* offcanvas */
 .offcanvas,
diff --git a/view/tpl/conv_item.tpl b/view/tpl/conv_item.tpl
index 58f70c1cf..da3489c37 100644
--- a/view/tpl/conv_item.tpl
+++ b/view/tpl/conv_item.tpl
@@ -197,9 +197,6 @@
 								<i class="bi bi-three-dots-vertical generic-icons"></i>
 							</button>
 							<div class="dropdown-menu dropdown-menu-end" role="menu" aria-labelledby="wall-item-menu-{{$item.id}}">
-								{{if $item.share}}
-								<!--a class="dropdown-item" href="#" onclick="jotShare({{$item.id}},{{$item.item_type}}); return false"><i class="generic-icons-nav fa fa-fw fa-retweet" title="{{$item.share.0}}"></i>{{$item.share.0}}</a-->
-								{{/if}}
 								{{if $item.embed}}
 								<a class="dropdown-item" href="#" onclick="jotEmbed({{$item.id}},{{$item.item_type}}); return false"><i class="generic-icons-nav bi bi-arrow-90deg-right" title="{{$item.embed.0}}"></i>{{$item.embed.0}}</a>
 								{{/if}}
diff --git a/view/tpl/conv_list.tpl b/view/tpl/conv_list.tpl
index 47845c990..09e8bdee0 100644
--- a/view/tpl/conv_list.tpl
+++ b/view/tpl/conv_list.tpl
@@ -30,26 +30,23 @@
 					<div class="text-end float-end">
 						<div class="wall-item-ago opacity-75" id="wall-item-ago-{{$item.id}}">
 							{{if $item.editedtime}}
-							<i class="fa fa-pencil"></i>
+							<i class="bi bi-pencil"></i>
 							{{/if}}
 							{{if $item.delayed}}
-							<i class="fa fa-clock-o"></i>
+							<i class="bi bi-clock"></i>
 							{{/if}}
 							{{if $item.location}}
 							<small class="wall-item-location p-location" id="wall-item-location-{{$item.id}}">{{$item.location}}</small>
 							{{/if}}
 							{{if $item.verified}}
-							<i class="fa fa-check text-success" title="{{$item.verified}}"></i>
+							<i class="bi bi-shield-check" title="{{$item.verified}}"></i>
 							{{elseif $item.forged}}
-							<i class="fa fa-exclamation text-danger" title="{{$item.forged}}"></i>
+							<i class="bi bi-shield-exclamation text-danger" title="{{$item.forged}}"></i>
 							{{/if}}
 							<small class="autotime" title="{{$item.isotime}}"><time class="dt-published" datetime="{{$item.isotime}}">{{$item.localtime}}</time>{{if $item.editedtime}}&nbsp;{{$item.editedtime}}{{/if}}{{if $item.expiretime}}&nbsp;{{$item.expiretime}}{{/if}}</small>
 						</div>
-						{{if $item.thr_parent}}
-						<a href="javascript:doscroll('{{$item.thr_parent}}',{{$item.parent}});" class="ms-3" title="{{$item.top_hint}}"><i class="fa fa-angle-double-up"></i></a>
-						{{/if}}
 						{{if $item.pinned}}
-						<div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="fa fa-thumb-tack"></i></div>
+						<div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="bi bi-pin-fill"></i></div>
 						{{/if}}
 					</div>
 					<div class="float-start wall-item-info pe-2" id="wall-item-info-{{$item.id}}" >
@@ -59,10 +56,10 @@
 							{{/if}}
 							<img src="{{$item.thumb}}" class="fakelink wall-item-photo{{$item.sparkle}} u-photo p-name" id="wall-item-photo-{{$item.id}}" alt="{{$item.name}}" loading="lazy" data-bs-toggle="dropdown" />
 							{{if $item.author_is_group_actor}}
-							<i class="fa fa-comments-o wall-item-photo-group-actor" title="{{$item.author_is_group_actor}}"></i>
+							<i class="bi bi-chat-quote-fill wall-item-photo-group-actor" title="{{$item.author_is_group_actor}}"></i>
 							{{/if}}
 							{{if $item.thread_author_menu}}
-							<i class="fa fa-caret-down wall-item-photo-caret cursor-pointer" data-bs-toggle="dropdown"></i>
+							<i class="bi bi-caret-down-fill wall-item-photo-caret cursor-pointer" data-bs-toggle="dropdown"></i>
 							<div class="dropdown-menu">
 								{{foreach $item.thread_author_menu as $mitem}}
 								<a class="dropdown-item{{if $mitem.class}} {{$mitem.class}}{{/if}}" {{if $mitem.href}}href="{{$mitem.href}}"{{/if}} {{if $mitem.action}}onclick="{{$mitem.action}}"{{/if}} {{if $mitem.title}}title="{{$mitem.title}}"{{/if}}{{if $mitem.data}} {{$mitem.data}}{{/if}}>{{$mitem.title}}</a>
@@ -74,7 +71,7 @@
 					<div class="wall-item-author">
 						{{if $item.lock}}
 						<div class="float-start dropdown wall-item-lock">
-							<i class="fa {{if $item.locktype == 2}}fa-envelope-o{{else if $item.locktype == 1}}fa-lock{{else}}fa-unlock{{/if}} lockview{{if $item.privacy_warning}} text-danger{{/if}}" data-bs-toggle="dropdown" title="{{$item.lock}}" onclick="lockview('item',{{$item.id}});" ></i>&nbsp;
+							<i class="bi {{if $item.locktype == 2}}bi-envelope{{else if $item.locktype == 1}}bi-lock{{else}}bi-unlock{{/if}} lockview{{if $item.privacy_warning}} text-danger{{/if}}" data-bs-toggle="dropdown" title="{{$item.lock}}" onclick="lockview('item',{{$item.id}});" ></i>&nbsp;
 							<div id="panel-{{$item.id}}" class="dropdown-menu"></div>
 						</div>
 						{{/if}}
@@ -96,7 +93,6 @@
 				{{/if}}
 				{{if $item.has_tags}}
 				<div class="p-2 wall-item-tools clearfix">
-
 					<div class="body-tags">
 						<span class="tag">{{$item.mentions}} {{$item.tags}} {{$item.categories}} {{$item.folders}}</span>
 					</div>
@@ -105,22 +101,23 @@
 				<div class="p-2 wall-item-tools d-flex justify-content-between">
 					<div class="wall-item-tools-left hstack gap-1" id="wall-item-tools-left-{{$item.id}}">
 						<div class="wall-item-list-comments btn-group">
-							<a class="btn btn-outline-secondary border-0 wall-item-comments" href="{{$item.viewthread}}" title="{{$item.comment_count_txt.label}}{{if $item.list_unseen_txt}}, {{$item.list_unseen_txt.label}}{{/if}}">
-								<i class="fa fa-comment-o"></i> {{$item.comment_count_txt.count}}{{if $item.unseen_comments}}<span class="unseen-wall-indicator-{{$item.id}}">, <i class="fa fa-eye-slash"></i> {{$item.list_unseen_txt.count}}</span>{{/if}}
+							<a class="btn btn-sm btn-outline-secondary border-0 wall-item-comments" href="{{$item.viewthread}}" title="{{$item.comment_count_txt.label}}{{if $item.list_unseen_txt}}, {{$item.list_unseen_txt.label}}{{/if}}">
+								<i class="bi bi-chat generic-icons"></i>{{if $item.comment_count_txt.count}}<span style="display: inline-block; margin-top: -.25rem;" class="align-top">{{$item.comment_count_txt.count}}</span>{{/if}}{{if $item.unseen_comments}}, <i class="bi bi-eye-slash generic-icons"></i><span class="unseen-wall-indicator-{{$item.id}} align-top" style="display: inline-block; margin-top: -.25rem;">{{$item.list_unseen_txt.count}}</span>{{/if}}
 							</a>
 						</div>
 						{{**if $item.unseen_comments}}
 						<div class="unseen-wall-indicator-{{$item.id}} btn-group">
-							<button class="btn btn-outline-secondary border-0" title="{{$item.markseen}}" onclick="markItemRead({{$item.id}}); return false;">
-								<i class="fa fa-check-square-o"></i>
+							<button class="btn btn-sm btn-outline-secondary border-0" title="{{$item.markseen}}" onclick="markItemRead({{$item.id}}); return false;">
+								<i class="bi bi-check-square generic-icons"></i>
 							</button>
 						</div>
 						{{/if**}}
 						{{foreach $item.responses as $verb=>$response}}
 						{{if $item.reactions_allowed || (!$item.reactions_allowed && $response.count)}}
 						<div class="">
-							<button type="button" title="{{$response.count}} {{$response.button.label}}" class="btn btn-outline-secondary border-0 wall-item-{{$response.button.class}}"{{if $response.modal}} data-bs-toggle="modal" data-bs-target="#{{$verb}}Modal-{{$item.id}}"{{else if $response.count}} data-bs-toggle="dropdown"{{elseif $item.reactions_allowed}} onclick="{{$response.button.onclick}}({{$item.id}},'{{$verb}}'); return false;"{{/if}} id="wall-item-{{$verb}}-{{$item.id}}"><i class="fa fa-{{$response.button.icon}}"></i>{{if $response.count}} <span class="{{if $item.my_responses.$verb}}text-decoration-underline{{/if}}">{{$response.count}}</span>{{/if}}</button>
-							{{if $response.modal}}
+							<button type="button" title="{{$response.count}} {{$response.button.label}}" class="btn btn-sm btn-outline-secondary border-0 wall-item-{{$response.button.class}}"{{if $response.modal}} data-bs-toggle="modal" data-bs-target="#{{$verb}}Modal-{{$item.id}}"{{else if $response.count}} data-bs-toggle="dropdown"{{elseif $item.reactions_allowed}} onclick="{{$response.button.onclick}}({{$item.id}},'{{$verb}}'); return false;"{{/if}} id="wall-item-{{$verb}}-{{$item.id}}">
+								<i class="bi bi-{{$response.button.icon}} generic-icons"></i>{{if $response.count}}<span style="display: inline-block; margin-top: -.25rem;" class="align-top{{if $item.my_responses.$verb}} text-decoration-underline{{/if}}">{{$response.count}}</span>{{/if}}
+							</button>							{{if $response.modal}}
 							<div class="modal" id="{{$verb}}Modal-{{$item.id}}">
 								<div class="modal-dialog">
 									<div class="modal-content">
@@ -162,8 +159,8 @@
 						{{/foreach}}
 						{{if $item.toplevel && $item.emojis && $item.reactions}}
 						<div class="">
-							<button type="button" class="btn btn-outline-secondary border-0" data-bs-toggle="dropdown" id="wall-item-react-{{$item.id}}">
-								<i class="fa fa-smile-o"></i>
+							<button type="button" class="btn btn-sm btn-outline-secondary border-0" data-bs-toggle="dropdown" id="wall-item-react-{{$item.id}}">
+								<i class="bi bi-emoji-smile generic-icons"></i>
 							</button>
 							<div class="dropdown-menu dropdown-menu-start container text-center w-25">
 								<div class="row g-0">
@@ -184,67 +181,59 @@
 					</div>
 					<div class="wall-item-tools-right hstack gap-1" id="wall-item-tools-right-{{$item.id}}">
 						{{if $item.moderate}}
-						<a href="moderate/{{$item.id}}/approve" onclick="moderate_approve({{$item.id}}); return false;" class="btn btn-sm btn-outline-success"><i class="fa fa-check" ></i> {{$item.moderate_approve}}</a>
-						<a href="moderate/{{$item.id}}/drop" onclick="moderate_drop({{$item.id}}); return false;" class="btn btn-sm btn-outline-danger"><i class="fa fa-trash-o" ></i> {{$item.moderate_delete}}</a>
+						<a href="moderate/{{$item.id}}/approve" onclick="moderate_approve({{$item.id}}); return false;" class="btn btn-sm btn-outline-success"><i class="bi bi-check-lg" ></i> {{$item.moderate_approve}}</a>
+						<a href="moderate/{{$item.id}}/drop" onclick="moderate_drop({{$item.id}}); return false;" class="btn btn-sm btn-outline-danger"><i class="bi bi-trash" ></i> {{$item.moderate_delete}}</a>
 						{{else}}
 						{{if $item.star && $item.star.isstarred}}
 						<div class="" id="star-button-{{$item.id}}">
-							<button type="button" class="btn btn-outline-secondary border-0 wall-item-star" onclick="dostar({{$item.id}});"><i class="fa fa-star"></i></button>
+							<button type="button" class="btn btn-sm btn-outline-secondary border-0 wall-item-star" onclick="dostar({{$item.id}});"><i class="bi bi-star generic-icons"></i></button>
 						</div>
 						{{/if}}
 						{{if $item.attachments}}
 						<div class="">
-							<button type="button" class="btn btn-outline-secondary border-0 wall-item-attach" data-bs-toggle="dropdown" id="attachment-menu-{{$item.id}}"><i class="fa fa-paperclip"></i></button>
+							<button type="button" class="btn btn-sm btn-outline-secondary border-0 wall-item-attach" data-bs-toggle="dropdown" id="attachment-menu-{{$item.id}}"><i class="bi bi-paperclip generic-icons"></i></button>
 							<div class="dropdown-menu dropdown-menu-end">{{$item.attachments}}</div>
 						</div>
 						{{/if}}
-						{{if $item.reply_to}}
-						<button type="button" title="{{$item.reply_to.0}}" class="btn btn-outline-secondary border-0" onclick="doreply({{$item.parent}}, {{$item.id}}, '{{$item.author_id}}', '{{$item.reply_to.2}} {{$item.name|escape:javascript}}');">
-							<i class="fa fa-reply" ></i>
-						</button>
-						{{/if}}
 						<div class="">
-							<button type="button" class="btn btn-outline-secondary border-0" data-bs-toggle="dropdown" id="wall-item-menu-{{$item.id}}">
-								<i class="fa fa-ellipsis-v"></i>
+							<button type="button" class="btn btn-sm btn-outline-secondary border-0" data-bs-toggle="dropdown" id="wall-item-menu-{{$item.id}}">
+								<i class="bi bi-three-dots-vertical generic-icons"></i>
 							</button>
 							<div class="dropdown-menu dropdown-menu-end" role="menu" aria-labelledby="wall-item-menu-{{$item.id}}">
-								{{if $item.share}}
-								<!--a class="dropdown-item" href="#" onclick="jotShare({{$item.id}},{{$item.item_type}}); return false"><i class="generic-icons-nav fa fa-fw fa-retweet" title="{{$item.share.0}}"></i>{{$item.share.0}}</a-->
-								{{/if}}
 								{{if $item.embed}}
-								<a class="dropdown-item" href="#" onclick="jotEmbed({{$item.id}},{{$item.item_type}}); return false"><i class="generic-icons-nav fa fa-fw fa-share" title="{{$item.embed.0}}"></i>{{$item.embed.0}}</a>
+								<a class="dropdown-item" href="#" onclick="jotEmbed({{$item.id}},{{$item.item_type}}); return false"><i class="generic-icons-nav bi bi-arrow-90deg-right" title="{{$item.embed.0}}"></i>{{$item.embed.0}}</a>
 								{{/if}}
 								{{if $item.plink}}
-								<a class="dropdown-item" href="{{$item.plink.href}}" title="{{$item.plink.title}}" class="u-url"><i class="generic-icons-nav fa fa-fw fa-external-link"></i>{{$item.plink.title}}</a>
+								<a class="dropdown-item" href="{{$item.plink.href}}" title="{{$item.plink.title}}" class="u-url"><i class="generic-icons-nav bi bi-box-arrow-up-right"></i>{{$item.plink.title}}</a>
 								{{/if}}
 								{{if $item.edpost}}
-								<a class="dropdown-item" href="{{$item.edpost.0}}" title="{{$item.edpost.1}}"><i class="generic-icons-nav fa fa-fw fa-pencil"></i>{{$item.edpost.1}}</a>
+								<a class="dropdown-item" href="{{$item.edpost.0}}" title="{{$item.edpost.1}}"><i class="generic-icons-nav bi bi-pencil"></i>{{$item.edpost.1}}</a>
 								{{/if}}
 								{{if $item.tagger}}
-								<a class="dropdown-item" href="#"  onclick="itemTag({{$item.id}}); return false;"><i id="tagger-{{$item.id}}" class="generic-icons-nav fa fa-fw fa-tag" title="{{$item.tagger.tagit}}"></i>{{$item.tagger.tagit}}</a>
+								<a class="dropdown-item" href="#"  onclick="itemTag({{$item.id}}); return false;"><i id="tagger-{{$item.id}}" class="generic-icons-nav bi bi-tag" title="{{$item.tagger.tagit}}"></i>{{$item.tagger.tagit}}</a>
 								{{/if}}
 								{{if $item.filer}}
-								<a class="dropdown-item" href="#" onclick="itemFiler({{$item.id}}); return false;"><i id="filer-{{$item.id}}" class="generic-icons-nav fa fa-fw fa-folder-open" title="{{$item.filer}}"></i>{{$item.filer}}</a>
+								<a class="dropdown-item" href="#" onclick="itemFiler({{$item.id}}); return false;"><i id="filer-{{$item.id}}" class="generic-icons-nav bi bi-folder-plus" title="{{$item.filer}}"></i>{{$item.filer}}</a>
 								{{/if}}
 								{{if $item.pinnable}}
-								<a class="dropdown-item dropdown-item-pinnable" href="#" onclick="dopin({{$item.id}}); return false;" id="item-pinnable-{{$item.id}}"><i class="generic-icons-nav fa fa-fw fa-thumb-tack"></i>{{$item.pinme}}</a>
+								<a class="dropdown-item dropdown-item-pinnable" href="#" onclick="dopin({{$item.id}}); return false;" id="item-pinnable-{{$item.id}}"><i class="generic-icons-nav bi bi-pin"></i>{{$item.pinme}}</a>
 								{{/if}}
 								{{if $item.bookmark}}
-								<a class="dropdown-item" href="#" onclick="itemBookmark({{$item.id}}); return false;"><i id="bookmarker-{{$item.id}}" class="generic-icons-nav fa fa-fw fa-bookmark" title="{{$item.bookmark}}"></i>{{$item.bookmark}}</a>
+								<a class="dropdown-item" href="#" onclick="itemBookmark({{$item.id}}); return false;"><i id="bookmarker-{{$item.id}}" class="generic-icons-nav bi bi-bookmark" title="{{$item.bookmark}}"></i>{{$item.bookmark}}</a>
 								{{/if}}
 								{{if $item.addtocal}}
-								<a class="dropdown-item" href="#" onclick="itemAddToCal({{$item.id}}); return false;"><i id="addtocal-{{$item.id}}" class="generic-icons-nav fa fa-fw fa-calendar" title="{{$item.addtocal}}"></i>{{$item.addtocal}}</a>
+								<a class="dropdown-item" href="#" onclick="itemAddToCal({{$item.id}}); return false;"><i id="addtocal-{{$item.id}}" class="generic-icons-nav bi bi-calendar-plus" title="{{$item.addtocal}}"></i>{{$item.addtocal}}</a>
 								{{/if}}
 								{{if $item.star}}
-								<a class="dropdown-item" href="#" onclick="dostar({{$item.id}}); return false;"><i id="starred-{{$item.id}}" class="generic-icons-nav fa fa-fw{{if $item.star.isstarred}} starred fa-star{{else}} unstarred fa-star-o{{/if}}" title="{{$item.star.toggle}}"></i>{{$item.star.toggle}}</a>
+								<a class="dropdown-item" href="#" onclick="dostar({{$item.id}}); return false;"><i id="starred-{{$item.id}}" class="generic-icons-nav bi{{if $item.star.isstarred}} starred bi-star-fill{{else}} unstarred bi-star{{/if}}" title="{{$item.star.toggle}}"></i>{{$item.star.toggle}}</a>
 								{{/if}}
 								{{if $item.thread_action_menu}}
 								{{foreach $item.thread_action_menu as $mitem}}
-								<a class="dropdown-item" {{if $mitem.href}}href="{{$mitem.href}}"{{/if}} {{if $mitem.action}}onclick="{{$mitem.action}}"{{/if}} {{if $mitem.title}}title="{{$mitem.title}}"{{/if}} ><i class="generic-icons-nav fa fa-fw fa-{{$mitem.icon}}"></i>{{$mitem.title}}</a>
+								<a class="dropdown-item" {{if $mitem.href}}href="{{$mitem.href}}"{{/if}} {{if $mitem.action}}onclick="{{$mitem.action}}"{{/if}} {{if $mitem.title}}title="{{$mitem.title}}"{{/if}} ><i class="generic-icons-nav bi bi-{{$mitem.icon}}"></i>{{$mitem.title}}</a>
 								{{/foreach}}
 								{{/if}}
 								{{if $item.drop.dropping}}
-								<a class="dropdown-item" href="#" onclick="dropItem('item/drop/{{$item.id}}', '#thread-wrapper-{{$item.id}}', '{{$item.mid}}'); return false;" title="{{$item.drop.delete}}" ><i class="generic-icons-nav fa fa-fw fa-trash-o"></i>{{$item.drop.delete}}</a>
+								<a class="dropdown-item" href="#" onclick="dropItem('item/drop/{{$item.id}}', '#thread-wrapper-{{$item.id}}', '{{$item.mid}}'); return false;" title="{{$item.drop.delete}}" ><i class="generic-icons-nav bi bi-trash"></i>{{$item.drop.delete}}</a>
 								{{/if}}
 								{{if $item.dropdown_extras}}
 								<div class="dropdown-divider"></div>
diff --git a/view/tpl/navbar_default.tpl b/view/tpl/navbar_default.tpl
index 21a865b6e..050301d02 100644
--- a/view/tpl/navbar_default.tpl
+++ b/view/tpl/navbar_default.tpl
@@ -71,11 +71,11 @@
 		<div class="navbar-toggler-right">
 			{{if $nav.help.6}}
 			<button id="context-help-btn" class="navbar-toggler border-0" type="button" onclick="contextualHelp(); return false;">
-				<i class="bi bi-question-circle-fill"></i>
+				<i class="bi bi-question-circle-fill generic-icons"></i>
 			</button>
 			{{/if}}
 			<button id="expand-aside" type="button" class="d-lg-none navbar-toggler border-0">
-				<i class="bi bi-arrow-right-circle" id="expand-aside-icon"></i>
+				<i class="bi bi-arrow-right-circle generic-icons" id="expand-aside-icon"></i>
 			</button>
 			{{if $localuser || $nav.pubs}}
 			<button id="notifications-btn-1" type="button" class="navbar-toggler border-0 notifications-btn">
@@ -83,7 +83,7 @@
 			</button>
 			{{/if}}
 			<button id="menu-btn" class="navbar-toggler border-0" type="button" data-bs-toggle="offcanvas" data-bs-target="#app-bin">
-				<i class="bi bi-three-dots-vertical"></i>
+				<i class="bi bi-three-dots-vertical generic-icons"></i>
 			</button>
 		</div>
 		<div class="collapse navbar-collapse justify-content-between" id="navbar-collapse-1">
diff --git a/view/tpl/search_item.tpl b/view/tpl/search_item.tpl
index a00c0a32e..daffcecf6 100644
--- a/view/tpl/search_item.tpl
+++ b/view/tpl/search_item.tpl
@@ -24,26 +24,23 @@
 				<div class="text-end float-end">
 					<div class="wall-item-ago opacity-75" id="wall-item-ago-{{$item.id}}">
 						{{if $item.editedtime}}
-						<i class="fa fa-pencil"></i>
+						<i class="bi bi-pencil"></i>
 						{{/if}}
 						{{if $item.delayed}}
-						<i class="fa fa-clock-o"></i>
+						<i class="bi bi-clock"></i>
 						{{/if}}
 						{{if $item.location}}
 						<small class="wall-item-location p-location" id="wall-item-location-{{$item.id}}">{{$item.location}}</small>
 						{{/if}}
 						{{if $item.verified}}
-						<i class="fa fa-check text-success" title="{{$item.verified}}"></i>
+						<i class="bi bi-shield-check" title="{{$item.verified}}"></i>
 						{{elseif $item.forged}}
-						<i class="fa fa-exclamation text-danger" title="{{$item.forged}}"></i>
+						<i class="bi bi-shield-exclamation text-danger" title="{{$item.forged}}"></i>
 						{{/if}}
 						<small class="autotime" title="{{$item.isotime}}"><time class="dt-published" datetime="{{$item.isotime}}">{{$item.localtime}}</time>{{if $item.editedtime}}&nbsp;{{$item.editedtime}}{{/if}}{{if $item.expiretime}}&nbsp;{{$item.expiretime}}{{/if}}</small>
 					</div>
-					{{if $item.thr_parent}}
-					<a href="javascript:doscroll('{{$item.thr_parent}}',{{$item.parent}});" class="ms-3" title="{{$item.top_hint}}"><i class="fa fa-angle-double-up"></i></a>
-					{{/if}}
 					{{if $item.pinned}}
-					<div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="fa fa-thumb-tack"></i></div>
+					<div class="wall-item-pinned" title="{{$item.pinned}}" id="wall-item-pinned-{{$item.id}}"><i class="bi bi-pin-fill"></i></div>
 					{{/if}}
 				</div>
 				<div class="float-start wall-item-info pe-2" id="wall-item-info-{{$item.id}}" >
@@ -53,10 +50,10 @@
 						{{/if}}
 						<img src="{{$item.thumb}}" class="fakelink wall-item-photo{{$item.sparkle}} u-photo p-name" id="wall-item-photo-{{$item.id}}" alt="{{$item.name}}" loading="lazy" data-bs-toggle="dropdown" />
 						{{if $item.author_is_group_actor}}
-						<i class="fa fa-comments-o wall-item-photo-group-actor" title="{{$item.author_is_group_actor}}"></i>
+						<i class="bi bi-chat-quote-fill wall-item-photo-group-actor" title="{{$item.author_is_group_actor}}"></i>
 						{{/if}}
 						{{if $item.thread_author_menu}}
-						<i class="fa fa-caret-down wall-item-photo-caret cursor-pointer" data-bs-toggle="dropdown"></i>
+						<i class="bi bi-caret-down-fill wall-item-photo-caret cursor-pointer" data-bs-toggle="dropdown"></i>
 						<div class="dropdown-menu">
 							{{foreach $item.thread_author_menu as $mitem}}
 							<a class="dropdown-item{{if $mitem.class}} {{$mitem.class}}{{/if}}" {{if $mitem.href}}href="{{$mitem.href}}"{{/if}} {{if $mitem.action}}onclick="{{$mitem.action}}"{{/if}} {{if $mitem.title}}title="{{$mitem.title}}"{{/if}}{{if $mitem.data}} {{$mitem.data}}{{/if}}>{{$mitem.title}}</a>
@@ -68,12 +65,12 @@
 				<div class="wall-item-author">
 					{{if $item.previewing}}
 					<div class="float-start me-1 preview-indicator">
-						<i class="fa fa-eye" title="{{$item.preview_lbl}}"></i>
+						<i class="bi bi-eye" title="{{$item.preview_lbl}}"></i>
 					</div>
 					{{/if}}
 					{{if $item.lock}}
 					<div class="float-start dropdown wall-item-lock">
-						<i class="fa {{if $item.locktype == 2}}fa-envelope-o{{else if $item.locktype == 1}}fa-lock{{else}}fa-unlock{{/if}} lockview{{if $item.privacy_warning}} text-danger{{/if}}" data-bs-toggle="dropdown" title="{{$item.lock}}" onclick="lockview('item',{{$item.id}});" ></i>&nbsp;
+						<i class="bi {{if $item.locktype == 2}}bi-envelope{{else if $item.locktype == 1}}bi-lock{{else}}bi-unlock{{/if}} lockview{{if $item.privacy_warning}} text-danger{{/if}}" data-bs-toggle="dropdown" title="{{$item.lock}}" onclick="lockview('item',{{$item.id}});" ></i>&nbsp;
 						<div id="panel-{{$item.id}}" class="dropdown-menu"></div>
 					</div>
 					{{/if}}
@@ -103,67 +100,64 @@
 			<div class="p-2 clearfix wall-item-tools">
 				<div class="float-end wall-item-tools-right hstack gap-1" id="wall-item-tools-right-{{$item.id}}">
 					{{if $item.moderate}}
-					<a href="moderate/{{$item.id}}/approve" onclick="moderate_approve({{$item.id}}); return false;" class="btn btn-sm btn-outline-success"><i class="fa fa-check" ></i> {{$item.moderate_approve}}</a>
-					<a href="moderate/{{$item.id}}/drop" onclick="moderate_drop({{$item.id}}); return false;" class="btn btn-sm btn-outline-danger"><i class="fa fa-trash-o" ></i> {{$item.moderate_delete}}</a>
+					<a href="moderate/{{$item.id}}/approve" onclick="moderate_approve({{$item.id}}); return false;" class="btn btn-sm btn-outline-success"><i class="bi bi-check-lg" ></i> {{$item.moderate_approve}}</a>
+					<a href="moderate/{{$item.id}}/drop" onclick="moderate_drop({{$item.id}}); return false;" class="btn btn-sm btn-outline-danger"><i class="bi bi-trash" ></i> {{$item.moderate_delete}}</a>
 					{{else}}
 					{{if $item.star && $item.star.isstarred}}
 					<div class="" id="star-button-{{$item.id}}">
-						<button type="button" class="btn btn-outline-secondary border-0 wall-item-star" onclick="dostar({{$item.id}});"><i class="fa fa-star"></i></button>
+						<button type="button" class="btn btn-sm btn-outline-secondary border-0 wall-item-star" onclick="dostar({{$item.id}});"><i class="bi bi-star generic-icons"></i></button>
 					</div>
 					{{/if}}
 					{{if $item.attachments}}
 					<div class="">
-						<button type="button" class="btn btn-outline-secondary border-0 wall-item-attach" data-bs-toggle="dropdown" id="attachment-menu-{{$item.id}}"><i class="fa fa-paperclip"></i></button>
+						<button type="button" class="btn btn-sm btn-outline-secondary border-0 wall-item-attach" data-bs-toggle="dropdown" id="attachment-menu-{{$item.id}}"><i class="bi bi-paperclip generic-icons"></i></button>
 						<div class="dropdown-menu dropdown-menu-end">{{$item.attachments}}</div>
 					</div>
 					{{/if}}
 					{{if $item.reply_to}}
-					<button type="button" title="{{$item.reply_to.0}}" class="btn btn-outline-secondary border-0" onclick="doreply({{$item.parent}}, {{$item.id}}, '{{$item.author_id}}', '{{$item.reply_to.2}} {{$item.name|escape:javascript}}');">
-						<i class="fa fa-reply" ></i>
+					<button type="button" title="{{$item.reply_to.0}}" class="btn btn-sm btn-outline-secondary border-0" onclick="doreply({{$item.parent}}, {{$item.id}}, '{{$item.author_id}}', '{{$item.reply_to.2}} {{$item.name|escape:javascript}}');">
+						<i class="bi bi-arrow-90deg-left generic-icons" ></i>
 					</button>
 					{{/if}}
 					<div class="">
-						<button type="button" class="btn btn-outline-secondary border-0" data-bs-toggle="dropdown" id="wall-item-menu-{{$item.id}}">
-							<i class="fa fa-ellipsis-v"></i>
+						<button type="button" class="btn btn-sm btn-outline-secondary border-0" data-bs-toggle="dropdown" id="wall-item-menu-{{$item.id}}">
+							<i class="bi bi-three-dots-vertical generic-icons"></i>
 						</button>
 						<div class="dropdown-menu dropdown-menu-end" role="menu" aria-labelledby="wall-item-menu-{{$item.id}}">
-							{{if $item.share}}
-							<!--a class="dropdown-item" href="#" onclick="jotShare({{$item.id}},{{$item.item_type}}); return false"><i class="generic-icons-nav fa fa-fw fa-retweet" title="{{$item.share.0}}"></i>{{$item.share.0}}</a-->
-							{{/if}}
 							{{if $item.embed}}
-							<a class="dropdown-item" href="#" onclick="jotEmbed({{$item.id}},{{$item.item_type}}); return false"><i class="generic-icons-nav fa fa-fw fa-share" title="{{$item.embed.0}}"></i>{{$item.embed.0}}</a>
+							<a class="dropdown-item" href="#" onclick="jotEmbed({{$item.id}},{{$item.item_type}}); return false"><i class="generic-icons-nav bi bi-arrow-90deg-right" title="{{$item.embed.0}}"></i>{{$item.embed.0}}</a>
 							{{/if}}
 							{{if $item.plink}}
-							<a class="dropdown-item" href="{{$item.plink.href}}" title="{{$item.plink.title}}" class="u-url"><i class="generic-icons-nav fa fa-fw fa-external-link"></i>{{$item.plink.title}}</a>
+							<a class="dropdown-item" href="{{$item.plink.href}}" title="{{$item.plink.title}}" class="u-url"><i class="generic-icons-nav bi bi-box-arrow-up-right"></i>{{$item.plink.title}}</a>
 							{{/if}}
 							{{if $item.edpost}}
-							<a class="dropdown-item" href="{{$item.edpost.0}}" title="{{$item.edpost.1}}"><i class="generic-icons-nav fa fa-fw fa-pencil"></i>{{$item.edpost.1}}</a>
+							<a class="dropdown-item" href="{{$item.edpost.0}}" title="{{$item.edpost.1}}"><i class="generic-icons-nav bi bi-pencil"></i>{{$item.edpost.1}}</a>
 							{{/if}}
 							{{if $item.tagger}}
-							<a class="dropdown-item" href="#"  onclick="itemTag({{$item.id}}); return false;"><i id="tagger-{{$item.id}}" class="generic-icons-nav fa fa-fw fa-tag" title="{{$item.tagger.tagit}}"></i>{{$item.tagger.tagit}}</a>
+							<a class="dropdown-item" href="#"  onclick="itemTag({{$item.id}}); return false;"><i id="tagger-{{$item.id}}" class="generic-icons-nav bi bi-tag" title="{{$item.tagger.tagit}}"></i>{{$item.tagger.tagit}}</a>
 							{{/if}}
 							{{if $item.filer}}
-							<a class="dropdown-item" href="#" onclick="itemFiler({{$item.id}}); return false;"><i id="filer-{{$item.id}}" class="generic-icons-nav fa fa-fw fa-folder-open" title="{{$item.filer}}"></i>{{$item.filer}}</a>
+							<a class="dropdown-item" href="#" onclick="itemFiler({{$item.id}}); return false;"><i id="filer-{{$item.id}}" class="generic-icons-nav bi bi-folder-plus" title="{{$item.filer}}"></i>{{$item.filer}}</a>
 							{{/if}}
 							{{if $item.pinnable}}
-							<a class="dropdown-item dropdown-item-pinnable" href="#" onclick="dopin({{$item.id}}); return false;" id="item-pinnable-{{$item.id}}"><i class="generic-icons-nav fa fa-fw fa-thumb-tack"></i>{{$item.pinme}}</a>
+							<a class="dropdown-item dropdown-item-pinnable" href="#" onclick="dopin({{$item.id}}); return false;" id="item-pinnable-{{$item.id}}"><i class="generic-icons-nav bi bi-pin"></i>{{$item.pinme}}</a>
 							{{/if}}
 							{{if $item.bookmark}}
-							<a class="dropdown-item" href="#" onclick="itemBookmark({{$item.id}}); return false;"><i id="bookmarker-{{$item.id}}" class="generic-icons-nav fa fa-fw fa-bookmark" title="{{$item.bookmark}}"></i>{{$item.bookmark}}</a>
+							<a class="dropdown-item" href="#" onclick="itemBookmark({{$item.id}}); return false;"><i id="bookmarker-{{$item.id}}" class="generic-icons-nav bi bi-bookmark" title="{{$item.bookmark}}"></i>{{$item.bookmark}}</a>
 							{{/if}}
 							{{if $item.addtocal}}
-							<a class="dropdown-item" href="#" onclick="itemAddToCal({{$item.id}}); return false;"><i id="addtocal-{{$item.id}}" class="generic-icons-nav fa fa-fw fa-calendar" title="{{$item.addtocal}}"></i>{{$item.addtocal}}</a>
+							<a class="dropdown-item" href="#" onclick="itemAddToCal({{$item.id}}); return false;"><i id="addtocal-{{$item.id}}" class="generic-icons-nav bi bi-calendar-plus" title="{{$item.addtocal}}"></i>{{$item.addtocal}}</a>
 							{{/if}}
 							{{if $item.star}}
-							<a class="dropdown-item" href="#" onclick="dostar({{$item.id}}); return false;"><i id="starred-{{$item.id}}" class="generic-icons-nav fa fa-fw{{if $item.star.isstarred}} starred fa-star{{else}} unstarred fa-star-o{{/if}}" title="{{$item.star.toggle}}"></i>{{$item.star.toggle}}</a>
+							<a class="dropdown-item" href="#" onclick="dostar({{$item.id}}); return false;"><i id="starred-{{$item.id}}" class="generic-icons-nav bi{{if $item.star.isstarred}} starred bi-star-fill{{else}} unstarred bi-star{{/if}}" title="{{$item.star.toggle}}"></i>{{$item.star.toggle}}</a>
 							{{/if}}
 							{{if $item.thread_action_menu}}
 							{{foreach $item.thread_action_menu as $mitem}}
-							<a class="dropdown-item" {{if $mitem.href}}href="{{$mitem.href}}"{{/if}} {{if $mitem.action}}onclick="{{$mitem.action}}"{{/if}} {{if $mitem.title}}title="{{$mitem.title}}"{{/if}} ><i class="generic-icons-nav fa fa-fw fa-{{$mitem.icon}}"></i>{{$mitem.title}}</a>
+							<a class="dropdown-item" {{if $mitem.href}}href="{{$mitem.href}}"{{/if}} {{if $mitem.action}}onclick="{{$mitem.action}}"{{/if}} {{if $mitem.title}}title="{{$mitem.title}}"{{/if}} ><i class="generic-icons-nav bi bi-{{$mitem.icon}}"></i>{{$mitem.title}}</a>
 							{{/foreach}}
 							{{/if}}
 							{{if $item.drop.dropping}}
-							<a class="dropdown-item" href="#" onclick="dropItem('item/drop/{{$item.id}}', '#thread-wrapper-{{$item.id}}', '{{$item.mid}}'); return false;" title="{{$item.drop.delete}}" ><i class="generic-icons-nav fa fa-fw fa-trash-o"></i>{{$item.drop.delete}}</a>
+							<a class="dropdown-item" href="#" onclick="dropItem('item/drop/{{$item.id}}', '#thread-wrapper-{{$item.id}}', '{{$item.mid}}'); return false;" title="{{$item.drop.delete}}" ><i class="generic-icons-nav bi bi-trash"></i>{{$item.drop.delete}}</a>
 							{{/if}}
 							{{if $item.dropdown_extras}}
 							<div class="dropdown-divider"></div>