Change to vertical navbar layout for secondary navbar for repo/user/admin settings (#24246)

Co-Author: @wxiaoguang 

This is the first step of #24229. And this PR will only includes html
changes, and followed by other PRs that fine tune css and change to
submenus.

After:

Admin Level

<img width="1400" alt="Screen Shot 2023-04-21 at 10 07 16"
src="https://user-images.githubusercontent.com/17645053/233523870-f848b61d-056a-4b41-9760-a9a49fea1fe8.png">

User Level

<img width="1422" alt="Screen Shot 2023-04-21 at 10 07 23"
src="https://user-images.githubusercontent.com/17645053/233523878-979adb20-a657-43d9-99a6-ad414010c0ef.png">

Repo Level

<img width="1404" alt="Screen Shot 2023-04-21 at 10 07 07"
src="https://user-images.githubusercontent.com/17645053/233523863-337440bd-c03a-4dfd-87fa-cef40300bfe0.png">

---------

Co-authored-by: wxiaoguang <[email protected]>

Author: HesterG

templates/admin/applications/list.tmpl

@@ -1,14 +1,8 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin config">
-	{{template "admin/navbar" .}}
-	<div class="ui container">
-		<div class="twelve wide column content">
-			{{template "base/alert" .}}
-			<h4 class="ui top attached header">
-					{{.locale.Tr "settings.applications"}}
-			</h4>
-			{{template "user/settings/applications_oauth2_list" .}}
-		</div>
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin config")}}
+	<div class="admin-setting-content">
+		<h4 class="ui top attached header">
+				{{.locale.Tr "settings.applications"}}
+		</h4>
+		{{template "user/settings/applications_oauth2_list" .}}
 	</div>
-</div>
-{{template "base/footer" .}}
+{{template "admin/layout_footer" .}}

templates/admin/applications/oauth2_edit.tmpl

@@ -1,7 +1,6 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin config">
-	{{template "admin/navbar" .}}
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin config")}}
+	<div class="admin-setting-content">
 
-	{{template "user/settings/applications_oauth2_edit_form" .}}
-</div>
-{{template "base/footer" .}}
+		{{template "user/settings/applications_oauth2_edit_form" .}}
+	</div>
+{{template "admin/layout_footer" .}}

templates/admin/auth/edit.tmpl

@@ -1,8 +1,5 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin edit authentication">
-	{{template "admin/navbar" .}}
-	<div class="ui container">
-		{{template "base/alert" .}}
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin edit authentication")}}
+	<div class="admin-setting-content">
 		<h4 class="ui top attached header">
 			{{.locale.Tr "admin.auths.edit"}}
 		</h4>
@@ -438,7 +435,6 @@
 			</form>
 		</div>
 	</div>
-</div>
 
 <div class="ui gitea-confirm-modal delete modal">
 	<div class="header">
@@ -450,4 +446,5 @@
 	</div>
 	{{template "base/modal_actions_confirm" .}}
 </div>
-{{template "base/footer" .}}
+
+{{template "admin/layout_footer" .}}

templates/admin/auth/list.tmpl

@@ -1,8 +1,5 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin authentication">
-	{{template "admin/navbar" .}}
-	<div class="ui container">
-		{{template "base/alert" .}}
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin authentication")}}
+	<div class="admin-setting-content">
 		<h4 class="ui top attached header">
 			{{.locale.Tr "admin.auths.auth_manage_panel"}} ({{.locale.Tr "admin.total" .Total}})
 			<div class="ui right">
@@ -38,5 +35,4 @@
 			</table>
 		</div>
 	</div>
-</div>
-{{template "base/footer" .}}
+{{template "admin/layout_footer" .}}

templates/admin/auth/new.tmpl

@@ -1,8 +1,5 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin new authentication">
-	{{template "admin/navbar" .}}
-	<div class="ui container">
-		{{template "base/alert" .}}
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin new authentication")}}
+	<div class="admin-setting-content">
 		<h4 class="ui top attached header">
 			{{.locale.Tr "admin.auths.new"}}
 		</h4>
@@ -122,5 +119,4 @@
 			</div>
 		</div>
 	</div>
-</div>
-{{template "base/footer" .}}
+{{template "admin/layout_footer" .}}

templates/admin/config.tmpl

@@ -1,8 +1,5 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin config">
-	{{template "admin/navbar" .}}
-	<div class="ui container">
-		{{template "base/alert" .}}
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin config")}}
+	<div class="admin-setting-content">
 		<h4 class="ui top attached header">
 			{{.locale.Tr "admin.config.server_config"}}
 		</h4>
@@ -426,5 +423,4 @@
 			</dl>
 		</div>
 	</div>
-</div>
-{{template "base/footer" .}}
+{{template "admin/layout_footer" .}}

templates/admin/dashboard.tmpl

@@ -1,8 +1,5 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin dashboard">
-	{{template "admin/navbar" .}}
-	<div class="ui container">
-		{{template "base/alert" .}}
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin dashboard")}}
+	<div class="admin-setting-content">
 		{{if .NeedUpdate}}
 			<div class="ui negative message flash-error">
 				<p>{{(.locale.Tr "admin.dashboard.new_version_hint" .RemoteVersion AppVer) | Str2html}}</p>
@@ -145,5 +142,4 @@
 			</dl>
 		</div>
 	</div>
-</div>
-{{template "base/footer" .}}
+{{template "admin/layout_footer" .}}

templates/admin/emails/list.tmpl

@@ -1,8 +1,5 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin user">
-	{{template "admin/navbar" .}}
-	<div class="ui container">
-		{{template "base/alert" .}}
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin user")}}
+	<div class="admin-setting-content">
 		<h4 class="ui top attached header">
 			{{.locale.Tr "admin.emails.email_manage_panel"}} ({{.locale.Tr "admin.total" .Total}})
 		</h4>
@@ -101,5 +98,4 @@
 		</div>
 
 	</div>
-</div>
-{{template "base/footer" .}}
+{{template "admin/layout_footer" .}}

templates/admin/hook_new.tmpl

@@ -1,8 +1,5 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin settings new webhook">
-	{{template "admin/navbar" .}}
-	<div class="ui container">
-		{{template "base/alert" .}}
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin settings new webhook")}}
+	<div class="admin-setting-content">
 		<h4 class="ui top attached header">
 			{{if .PageIsAdminDefaultHooksNew}}
 				{{.locale.Tr "admin.defaulthooks.add_webhook"}}
@@ -55,5 +52,4 @@
 
 		{{template "repo/settings/webhook/history" .}}
 	</div>
-</div>
-{{template "base/footer" .}}
+{{template "admin/layout_footer" .}}

templates/admin/hooks.tmpl

@@ -1,13 +1,9 @@
-{{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content admin hooks">
-	{{template "admin/navbar" .}}
-	<div class="ui container">
-		{{template "base/alert" .}}
+{{template "admin/layout_head" (dict "ctxData" . "pageClass" "admin hooks")}}
+	<div class="admin-setting-content">
 
 		{{template "repo/settings/webhook/base_list" .SystemWebhooks}}
 		{{template "repo/settings/webhook/base_list" .DefaultWebhooks}}
 
 		{{template "repo/settings/webhook/delete_modal" .}}
 	</div>
-</div>
-{{template "base/footer" .}}
+{{template "admin/layout_footer" .}}