backport #33108 (fix mobile view)

Author: wxiaoguang

Diff for: templates/base/head_navbar.tmpl

@@ -11,7 +11,7 @@
 		</a>
 
 		<!-- mobile right menu, it must be here because in mobile view, each item is a flex column, the first item is a full row column -->
-		<div class="ui secondary menu item navbar-mobile-right only-mobile">
+		<div class="ui secondary menu navbar-mobile-right only-mobile">
 			{{if and .IsSigned EnableTimetracking .ActiveStopwatch}}
 			<a id="mobile-stopwatch-icon" class="active-stopwatch item tw-mx-0" href="{{.ActiveStopwatch.IssueLink}}" title="{{ctx.Locale.Tr "active_stopwatch"}}" data-seconds="{{.ActiveStopwatch.Seconds}}">
 				<div class="tw-relative">
@@ -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>
 
@@ -128,7 +128,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>
 

Diff for: templates/repo/commit_page.tmpl

@@ -30,7 +30,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 */}}

Diff for: 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">

Diff for: web_src/css/modules/navbar.css

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