Adjust the layout of the toolbar on the Issues/Projects page (#33667) (#34047)

And fix layout for mobile

Backport #33667 

Fix #33880

---------

Co-authored-by: Kerwin Bryant <kerwin612@qq.com>

templates/projects/view.tmpl

@@ -1,10 +1,10 @@
 {{$canWriteProject := and .CanWriteProjects (or (not .Repository) (not .Repository.IsArchived))}}
 
 <div class="ui container tw-max-w-full">
-	<div class="tw-flex tw-justify-between tw-items-center tw-mb-4 tw-gap-3">
-		<h2 class="tw-mb-0 tw-flex-1 tw-break-anywhere">{{.Project.Title}}</h2>
-			<div class="project-toolbar-right">
-				<div class="ui secondary filter menu labels">
+	<div class="flex-text-block tw-flex-wrap tw-mb-4">
+		<h2 class="tw-mb-0">{{.Project.Title}}</h2>
+		<div class="tw-flex-1"></div>
+				<div class="ui secondary menu tw-m-0">
 					{{$queryLink := QueryBuild "?" "labels" .SelectLabels "assignee" $.AssigneeID "archived_labels" (Iif $.ShowArchivedLabels "true")}}
 
 					{{template "repo/issue/filter_item_label" dict "Labels" .Labels "QueryLink" $queryLink "SupportArchivedLabel" true}}
@@ -19,7 +19,6 @@
 						"TextNegativeOne" (ctx.Locale.Tr "repo.issues.filter_assginee_no_assignee")
 					}}
 				</div>
-			</div>
 		{{if $canWriteProject}}
 			<div class="ui compact mini menu">
 				<a class="item" href="{{.Link}}/edit?redirect=project">