Fix dropdown menu header and mobile view (#33108)

![image](https://github.com/user-attachments/assets/3f831c8c-ef87-4282-880a-c2738f3e1d17)

----

![image](https://github.com/user-attachments/assets/c4c0519b-cfa6-42b4-bd28-205ee514eb34)

----

![image](https://github.com/user-attachments/assets/8624a605-9f2b-4905-9cbc-0af073972874)

Author: wxiaoguang

templates/base/head_navbar.tmpl

@@ -70,7 +70,7 @@
 					<span class="not-mobile">{{svg "octicon-triangle-down"}}</span>
 				</span>
 				<div class="menu user-menu">
-					<div class="ui header">
+					<div class="header">
 						{{ctx.Locale.Tr "signed_in_as"}} <strong>{{.SignedUser.Name}}</strong>
 					</div>
 
@@ -130,7 +130,7 @@
 				{{/* do not localize it, here it needs the fixed length (width) to make UI comfortable */}}
 				{{if .IsAdmin}}<span class="navbar-profile-admin">admin</span>{{end}}
 				<div class="menu user-menu">
-					<div class="ui header">
+					<div class="header">
 						{{ctx.Locale.Tr "signed_in_as"}} <strong>{{.SignedUser.Name}}</strong>
 					</div>
 

templates/repo/commit_page.tmpl

@@ -16,7 +16,7 @@
 								{{ctx.Locale.Tr "repo.commit.operations"}}
 								{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 								<div class="menu">
-									<div class="ui header">{{ctx.Locale.Tr "repo.commit.operations"}}</div>
+									<div class="header">{{ctx.Locale.Tr "repo.commit.operations"}}</div>
 									<div class="divider"></div>
 									<div class="item show-create-branch-modal"
 										data-content="{{ctx.Locale.Tr "repo.branch.new_branch_from" (.CommitID)}}" {{/* used by the form */}}

templates/user/dashboard/navbar.tmpl

@@ -12,7 +12,7 @@
 					{{svg "octicon-triangle-down" 14 "dropdown icon tw-ml-1"}}
 				</span>
 				<div class="context user overflow menu">
-					<div class="ui header">
+					<div class="header">
 						{{ctx.Locale.Tr "home.switch_dashboard_context"}}
 					</div>
 					<div class="scrolling menu items">
@@ -56,7 +56,7 @@
 					</span>
 					{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 					<div class="context user overflow menu">
-						<div class="ui header">
+						<div class="header">
 							{{ctx.Locale.Tr "home.filter_by_team_repositories"}}
 						</div>
 						<div class="scrolling menu items">

web_src/css/modules/navbar.css

@@ -48,7 +48,8 @@
     align-items: stretch;
   }
   /* hide all items */
-  #navbar .item {
+  #navbar .navbar-left > .item,
+  #navbar .navbar-right > .item {
     display: none;
   }
   #navbar #navbar-logo {