Merge remote-tracking branch 'origin/main' into forgejo-federation

194 files changed, 1298 insertions, 1162 deletions

diff --git a/templates/admin/auth/edit.tmpl b/templates/admin/auth/edit.tmpl
index a3c94a6cc..36d335f32 100644
--- a/templates/admin/auth/edit.tmpl
+++ b/templates/admin/auth/edit.tmpl
@@ -45,7 +45,7 @@
 						<label for="port">{{.locale.Tr "admin.auths.port"}}</label>
 						<input id="port" name="port" value="{{$cfg.Port}}"  placeholder="e.g. 636" required>
 					</div>
-					<div class="has-tls inline field {{if not .HasTLS}}hide{{end}}">
+					<div class="has-tls inline field {{if not .HasTLS}}gt-hidden{{end}}">
 						<div class="ui checkbox">
 							<label><strong>{{.locale.Tr "admin.auths.skip_tls_verify"}}</strong></label>
 							<input name="skip_verify" type="checkbox" {{if .Source.SkipVerify}}checked{{end}}>
@@ -152,7 +152,7 @@
 								<input id="use_paged_search" name="use_paged_search" type="checkbox" {{if $cfg.UsePagedSearch}}checked{{end}}>
 							</div>
 						</div>
-						<div class="field required search-page-size{{if not $cfg.UsePagedSearch}} hide{{end}}">
+						<div class="field required search-page-size{{if not $cfg.UsePagedSearch}} gt-hidden{{end}}">
 							<label for="search_page_size">{{.locale.Tr "admin.auths.search_page_size"}}</label>
 							<input id="search_page_size" name="search_page_size" value="{{if $cfg.UsePagedSearch}}{{$cfg.SearchPageSize}}{{end}}">
 						</div>
@@ -209,7 +209,7 @@
 						</div>
 						<p class="help">{{.locale.Tr "admin.auths.force_smtps_helper"}}</p>
 					</div>
-					<div class="has-tls inline field {{if not .HasTLS}}hide{{end}}">
+					<div class="has-tls inline field {{if not .HasTLS}}gt-hidden{{end}}">
 						<div class="ui checkbox">
 							<label><strong>{{.locale.Tr "admin.auths.skip_tls_verify"}}</strong></label>
 							<input name="skip_verify" type="checkbox" {{if .Source.SkipVerify}}checked{{end}}>
diff --git a/templates/admin/auth/new.tmpl b/templates/admin/auth/new.tmpl
index ab84dfcca..9078fda46 100644
--- a/templates/admin/auth/new.tmpl
+++ b/templates/admin/auth/new.tmpl
@@ -36,13 +36,13 @@
 				{{template "admin/auth/source/smtp" .}}
 
 				<!-- PAM -->
-				<div class="pam required field {{if not (eq .type 4)}}hide{{end}}">
+				<div class="pam required field {{if not (eq .type 4)}}gt-hidden{{end}}">
 					<label for="pam_service_name">{{.locale.Tr "admin.auths.pam_service_name"}}</label>
 					<input id="pam_service_name" name="pam_service_name" value="{{.pam_service_name}}" />
 					<label for="pam_email_domain">{{.locale.Tr "admin.auths.pam_email_domain"}}</label>
 					<input id="pam_email_domain" name="pam_email_domain" value="{{.pam_email_domain}}">
 				</div>
-				<div class="pam optional field {{if not (eq .type 4)}}hide{{end}}">
+				<div class="pam optional field {{if not (eq .type 4)}}gt-hidden{{end}}">
 					<div class="ui checkbox">
 						<label for="skip_local_two_fa"><strong>{{.locale.Tr "admin.auths.skip_local_two_fa"}}</strong></label>
 						<input id="skip_local_two_fa" name="skip_local_two_fa" type="checkbox" {{if .skip_local_two_fa}}checked{{end}}>
@@ -62,7 +62,7 @@
 						<input name="attributes_in_bind" type="checkbox" {{if .attributes_in_bind}}checked{{end}}>
 					</div>
 				</div>
-				<div class="ldap inline field {{if not (eq .type 2)}}hide{{end}}">
+				<div class="ldap inline field {{if not (eq .type 2)}}gt-hidden{{end}}">
 					<div class="ui checkbox">
 						<label><strong>{{.locale.Tr "admin.auths.syncenabled"}}</strong></label>
 						<input name="is_sync_enabled" type="checkbox" {{if .is_sync_enabled}}checked{{end}}>
diff --git a/templates/admin/auth/source/ldap.tmpl b/templates/admin/auth/source/ldap.tmpl
index 8d199854a..902cfcbcc 100644
--- a/templates/admin/auth/source/ldap.tmpl
+++ b/templates/admin/auth/source/ldap.tmpl
@@ -1,4 +1,4 @@
-<div class="ldap dldap field {{if not (or (eq .type 2) (eq .type 5))}}hide{{end}}">
+<div class="ldap dldap field {{if not (or (eq .type 2) (eq .type 5))}}gt-hidden{{end}}">
 	<div class="inline required field {{if .Err_SecurityProtocol}}error{{end}}">
 		<label>{{.locale.Tr "admin.auths.security_protocol"}}</label>
 		<div class="ui selection security-protocol dropdown">
@@ -20,17 +20,17 @@
 		<label for="port">{{.locale.Tr "admin.auths.port"}}</label>
 		<input id="port" name="port" value="{{.port}}"  placeholder="e.g. 636">
 	</div>
-	<div class="has-tls inline field {{if not .HasTLS}}hide{{end}}">
+	<div class="has-tls inline field {{if not .HasTLS}}gt-hidden{{end}}">
 		<div class="ui checkbox">
 			<label><strong>{{.locale.Tr "admin.auths.skip_tls_verify"}}</strong></label>
 			<input name="skip_verify" type="checkbox" {{if .skip_verify}}checked{{end}}>
 		</div>
 	</div>
-	<div class="ldap field {{if not (eq .type 2)}}hide{{end}}">
+	<div class="ldap field {{if not (eq .type 2)}}gt-hidden{{end}}">
 		<label for="bind_dn">{{.locale.Tr "admin.auths.bind_dn"}}</label>
 		<input id="bind_dn" name="bind_dn" value="{{.bind_dn}}" placeholder="e.g. cn=Search,dc=mydomain,dc=com">
 	</div>
-	<div class="ldap field {{if not (eq .type 2)}}hide{{end}}">
+	<div class="ldap field {{if not (eq .type 2)}}gt-hidden{{end}}">
 		<label for="bind_password">{{.locale.Tr "admin.auths.bind_password"}}</label>
 		<input id="bind_password" name="bind_password" type="password" autocomplete="off" value="{{.bind_password}}">
 	</div>
@@ -38,7 +38,7 @@
 		<label for="user_base">{{.locale.Tr "admin.auths.user_base"}}</label>
 		<input id="user_base" name="user_base" value="{{.user_base}}" placeholder="e.g. ou=Users,dc=mydomain,dc=com">
 	</div>
-	<div class="dldap required field {{if not (eq .type 5)}}hide{{end}}">
+	<div class="dldap required field {{if not (eq .type 5)}}gt-hidden{{end}}">
 		<label for="user_dn">{{.locale.Tr "admin.auths.user_dn"}}</label>
 		<input id="user_dn" name="user_dn" value="{{.user_dn}}" placeholder="e.g. uid=%s,ou=Users,dc=mydomain,dc=com">
 	</div>
@@ -115,13 +115,13 @@
 	</div>
 	<!-- ldap group end -->
 
-	<div class="ldap inline field {{if not (eq .type 2)}}hide{{end}}">
+	<div class="ldap inline field {{if not (eq .type 2)}}gt-hidden{{end}}">
 		<div class="ui checkbox">
 			<label for="use_paged_search"><strong>{{.locale.Tr "admin.auths.use_paged_search"}}</strong></label>
 			<input id="use_paged_search" name="use_paged_search" class="use-paged-search" type="checkbox" {{if .use_paged_search}}checked{{end}}>
 		</div>
 	</div>
-	<div class="ldap field search-page-size required {{if or (not (eq .type 2)) (not .use_paged_search)}}hide{{end}}">
+	<div class="ldap field search-page-size required {{if or (not (eq .type 2)) (not .use_paged_search)}}gt-hidden{{end}}">
 		<label for="search_page_size">{{.locale.Tr "admin.auths.search_page_size"}}</label>
 		<input id="search_page_size" name="search_page_size" value="{{.search_page_size}}">
 	</div>
diff --git a/templates/admin/auth/source/oauth.tmpl b/templates/admin/auth/source/oauth.tmpl
index 85c77343a..b7ee00822 100644
--- a/templates/admin/auth/source/oauth.tmpl
+++ b/templates/admin/auth/source/oauth.tmpl
@@ -1,4 +1,4 @@
-<div class="oauth2 field {{if not (eq .type 6)}}hide{{end}}">
+<div class="oauth2 field {{if not (eq .type 6)}}gt-hidden{{end}}">
 	<div class="inline required field">
 		<label>{{.locale.Tr "admin.auths.oauth2_provider"}}</label>
 		<div class="ui selection type dropdown">
diff --git a/templates/admin/auth/source/smtp.tmpl b/templates/admin/auth/source/smtp.tmpl
index 2d577412c..e83f7afb6 100644
--- a/templates/admin/auth/source/smtp.tmpl
+++ b/templates/admin/auth/source/smtp.tmpl
@@ -1,4 +1,4 @@
-<div class="smtp field {{if not (eq .type 3)}}hide{{end}}">
+<div class="smtp field {{if not (eq .type 3)}}gt-hidden{{end}}">
 	<div class="inline required field">
 		<label>{{.locale.Tr "admin.auths.smtp_auth"}}</label>
 		<div class="ui selection type dropdown">
diff --git a/templates/admin/auth/source/sspi.tmpl b/templates/admin/auth/source/sspi.tmpl
index dee40d9fd..9608616e1 100644
--- a/templates/admin/auth/source/sspi.tmpl
+++ b/templates/admin/auth/source/sspi.tmpl
@@ -1,4 +1,4 @@
-<div class="sspi field {{if not (eq .type 7)}}hide{{end}}">
+<div class="sspi field {{if not (eq .type 7)}}gt-hidden{{end}}">
 	<div class="field">
 		<div class="ui checkbox">
 			<label for="sspi_auto_create_users"><strong>{{.locale.Tr "admin.auths.sspi_auto_create_users"}}</strong></label>
diff --git a/templates/admin/process-row.tmpl b/templates/admin/process-row.tmpl
index 4ab190af4..477bf5a41 100644
--- a/templates/admin/process-row.tmpl
+++ b/templates/admin/process-row.tmpl
@@ -1,7 +1,7 @@
 <div class="item">
-	<div class="df ac">
-		<div class="icon ml-3 mr-3">{{if eq .Process.Type "request"}}{{svg "octicon-globe" 16}}{{else if eq .Process.Type "system"}}{{svg "octicon-cpu" 16}}{{else}}{{svg "octicon-terminal" 16}}{{end}}</div>
-		<div class="content f1">
+	<div class="gt-df gt-ac">
+		<div class="icon gt-ml-3 gt-mr-3">{{if eq .Process.Type "request"}}{{svg "octicon-globe" 16}}{{else if eq .Process.Type "system"}}{{svg "octicon-cpu" 16}}{{else}}{{svg "octicon-terminal" 16}}{{end}}</div>
+		<div class="content gt-f1">
 			<div class="header">{{.Process.Description}}</div>
 			<div class="description"><span title="{{DateFmtLong .Process.Start}}">{{TimeSince .Process.Start .root.locale}}</span></div>
 		</div>
diff --git a/templates/admin/repo/unadopted.tmpl b/templates/admin/repo/unadopted.tmpl
index ca0b4c3bb..2629056d1 100644
--- a/templates/admin/repo/unadopted.tmpl
+++ b/templates/admin/repo/unadopted.tmpl
@@ -45,11 +45,11 @@
 												<input type="hidden" name="page" value="{{$.CurrentPage}}">
 												<div class="actions">
 													<div class="ui red basic inverted cancel button">
-														{{svg "octicon-trash" 16 "mr-2"}}
+														{{svg "octicon-trash" 16 "gt-mr-2"}}
 														{{$.locale.Tr "modal.no"}}
 													</div>
 													<button class="ui green basic inverted ok button">
-														{{svg "octicon-check" 16 "mr-2"}}
+														{{svg "octicon-check" 16 "gt-mr-2"}}
 														{{$.locale.Tr "modal.yes"}}
 													</button>
 												</div>
@@ -72,11 +72,11 @@
 												<input type="hidden" name="page" value="{{$.CurrentPage}}">
 												<div class="actions">
 													<div class="ui red basic inverted cancel button">
-														{{svg "octicon-trash" 16 "mr-2"}}
+														{{svg "octicon-trash" 16 "gt-mr-2"}}
 														{{$.locale.Tr "modal.no"}}
 													</div>
 													<button class="ui green basic inverted ok button">
-														{{svg "octicon-check" 16 "mr-2"}}
+														{{svg "octicon-check" 16 "gt-mr-2"}}
 														{{$.locale.Tr "modal.yes"}}
 													</button>
 												</div>
diff --git a/templates/admin/stacktrace-row.tmpl b/templates/admin/stacktrace-row.tmpl
index a8ae486bc..e6d2e68cb 100644
--- a/templates/admin/stacktrace-row.tmpl
+++ b/templates/admin/stacktrace-row.tmpl
@@ -1,6 +1,6 @@
 <div class="item">
-	<div class="df ac">
-		<div class="icon ml-3 mr-3">
+	<div class="gt-df gt-ac">
+		<div class="icon gt-ml-3 gt-mr-3">
 			{{if eq .Process.Type "request"}}
 				{{svg "octicon-globe" 16}}
 			{{else if eq .Process.Type "system"}}
@@ -11,7 +11,7 @@
 				{{svg "octicon-code" 16}}
 			{{end}}
 		</div>
-		<div class="content f1">
+		<div class="content gt-f1">
 			<div class="header">{{.Process.Description}}</div>
 			<div class="description">{{if ne .Process.Type "none"}}<span title="{{DateFmtLong .Process.Start}}">{{TimeSince .Process.Start .root.locale}}</span>{{end}}</div>
 		</div>
@@ -22,14 +22,14 @@
 		</div>
 	</div>
 	{{if .Process.Stacks}}
-		<div class="divided list ml-3">
+		<div class="divided list gt-ml-3">
 			{{range .Process.Stacks}}
 				<div class="item">
 					<details>
 						<summary>
-							<div class="dif content">
-								<div class="header ml-3">
-									<span class="icon mr-3">{{svg "octicon-code" 16}}</span>{{.Description}}{{if gt .Count 1}} * {{.Count}}{{end}}
+							<div class="gt-dif content">
+								<div class="header gt-ml-3">
+									<span class="icon gt-mr-3">{{svg "octicon-code" 16}}</span>{{.Description}}{{if gt .Count 1}} * {{.Count}}{{end}}
 								</div>
 								<div class="description">
 									{{range .Labels}}
@@ -40,9 +40,9 @@
 						</summary>
 						<div class="list">
 							{{range .Entry}}
-								<div class="item df ac">
-									<span class="icon mr-4">{{svg "octicon-dot-fill" 16}}</span>
-									<div class="content f1">
+								<div class="item gt-df gt-ac">
+									<span class="icon gt-mr-4">{{svg "octicon-dot-fill" 16}}</span>
+									<div class="content gt-f1">
 										<div class="header"><code>{{.Function}}</code></div>
 										<div class="description"><code>{{.File}}:{{.Line}}</code></div>
 									</div>
diff --git a/templates/admin/user/edit.tmpl b/templates/admin/user/edit.tmpl
index ef436c718..7d31eb4d2 100644
--- a/templates/admin/user/edit.tmpl
+++ b/templates/admin/user/edit.tmpl
@@ -56,7 +56,7 @@
 					</div>
 				</div>
 
-				<div class="required non-local field {{if .Err_LoginName}}error{{end}} {{if eq .User.LoginSource 0}}hide{{end}}">
+				<div class="required non-local field {{if .Err_LoginName}}error{{end}} {{if eq .User.LoginSource 0}}gt-hidden{{end}}">
 					<label for="login_name">{{.locale.Tr "admin.users.auth_login_name"}}</label>
 					<input id="login_name" name="login_name" value="{{.User.LoginName}}" autofocus>
 				</div>
@@ -68,7 +68,7 @@
 					<label for="email">{{.locale.Tr "email"}}</label>
 					<input id="email" name="email" type="email" value="{{.User.Email}}" autofocus required>
 				</div>
-				<div class="local field {{if .Err_Password}}error{{end}} {{if not (or (.User.IsLocal) (.User.IsOAuth2))}}hide{{end}}">
+				<div class="local field {{if .Err_Password}}error{{end}} {{if not (or (.User.IsLocal) (.User.IsOAuth2))}}gt-hidden{{end}}">
 					<label for="password">{{.locale.Tr "password"}}</label>
 					<input id="password" name="password" type="password" autocomplete="new-password">
 					<p class="help">{{.locale.Tr "admin.users.password_helper"}}</p>
@@ -116,7 +116,7 @@
 						<input name="restricted" type="checkbox" {{if .User.IsRestricted}}checked{{end}}>
 					</div>
 				</div>
-				<div class="inline field"{{if DisableGitHooks}} hidden{{end}}>
+				<div class="inline field {{if DisableGitHooks}}gt-hidden{{end}}">
 					<div class="ui checkbox tooltip" data-content="{{.locale.Tr "admin.users.allow_git_hook_tooltip"}}">
 						<label><strong>{{.locale.Tr "admin.users.allow_git_hook"}}</strong></label>
 						<input name="allow_git_hook" type="checkbox" {{if .User.CanEditGitHook}}checked{{end}} {{if DisableGitHooks}}disabled{{end}}>
@@ -162,7 +162,7 @@
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}/avatar" method="post" enctype="multipart/form-data">
 				{{.CsrfTokenHtml}}
-				{{if not DisableGravatar}}
+				{{if not (DisableGravatar $.Context)}}
 				<div class="inline field">
 					<div class="ui radio checkbox">
 						<input name="source" value="lookup" type="radio" {{if not .User.UseCustomAvatar}}checked{{end}}>
diff --git a/templates/base/head.tmpl b/templates/base/head.tmpl
index 36c4fafd2..c552dcfd2 100644
--- a/templates/base/head.tmpl
+++ b/templates/base/head.tmpl
@@ -32,7 +32,7 @@
 {{if .PageIsUserProfile}}
 	<meta property="og:title" content="{{.Owner.DisplayName}}">
 	<meta property="og:type" content="profile">
-	<meta property="og:image" content="{{.Owner.AvatarLink}}">
+	<meta property="og:image" content="{{.Owner.AvatarLink $.Context}}">
 	<meta property="og:url" content="{{.Owner.HTMLURL}}">
 	{{if .Owner.Description}}
 		<meta property="og:description" content="{{.Owner.Description}}">
@@ -52,10 +52,10 @@
 		{{end}}
 	{{end}}
 	<meta property="og:type" content="object">
-	{{if .Repository.AvatarLink}}
-		<meta property="og:image" content="{{.Repository.AvatarLink}}">
+	{{if (.Repository.AvatarLink $.Context)}}
+		<meta property="og:image" content="{{.Repository.AvatarLink $.Context}}">
 	{{else}}
-		<meta property="og:image" content="{{.Repository.Owner.AvatarLink}}">
+		<meta property="og:image" content="{{.Repository.Owner.AvatarLink $.Context}}">
 	{{end}}
 {{else}}
 	<meta property="og:title" content="{{AppName}}">
diff --git a/templates/base/head_navbar.tmpl b/templates/base/head_navbar.tmpl
index 1c995e73e..059363b72 100644
--- a/templates/base/head_navbar.tmpl
+++ b/templates/base/head_navbar.tmpl
@@ -3,16 +3,16 @@
 	{{if .IsSigned}}
 		{{if .NotificationUnreadCount}}{{$notificationUnreadCount = call .NotificationUnreadCount}}{{end}}
 	{{end}}
-	<div class="item brand sb">
+	<div class="item brand gt-sb">
 		<a href="{{AppSubUrl}}/" aria-label="{{if .IsSigned}}{{.locale.Tr "dashboard"}}{{else}}{{.locale.Tr "home"}}{{end}}">
 			<img width="30" height="30" src="{{AssetUrlPrefix}}/img/logo.svg" alt="{{.locale.Tr "logo"}}" aria-hidden="true">
 		</a>
-		<div class="df ac">
+		<div class="gt-df gt-ac">
 			{{if .IsSigned}}
-			<a href="{{AppSubUrl}}/notifications" class="tooltip mobile-only mr-4 mt-3" data-content="{{.locale.Tr "notifications"}}" aria-label="{{.locale.Tr "notifications"}}">
+			<a href="{{AppSubUrl}}/notifications" class="tooltip mobile-only gt-mr-4 gt-mt-3" data-content="{{.locale.Tr "notifications"}}" aria-label="{{.locale.Tr "notifications"}}">
 				<span class="fitted item">
 					{{svg "octicon-bell"}}
-					<span class="notification_count{{if not $notificationUnreadCount}} hidden{{end}}">
+					<span class="notification_count{{if not $notificationUnreadCount}} gt-hidden{{end}}">
 						{{$notificationUnreadCount}}
 					</span>
 				</span>
@@ -49,7 +49,7 @@
 		<div class="item">
 		<div class="ui icon input">
 		<input class="searchbox" type="text" placeholder="{{.locale.Tr "search_project"}}">
-		<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+		<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 		</div>
 		</div>
 	*/}}
@@ -59,7 +59,7 @@
 		<div class="right stackable menu">
 			<div class="ui dropdown jump item tooltip" tabindex="-1" data-content="{{.locale.Tr "user_profile_and_more"}}">
 				<span class="text">
-					{{avatar .SignedUser 24 "tiny"}}
+					{{avatar $.Context .SignedUser 24 "tiny"}}
 					<span class="sr-only">{{.locale.Tr "user_profile_and_more"}}</span>
 					<span class="mobile-only">{{.SignedUser.Name}}</span>
 					<span class="fitted not-mobile" tabindex="-1">{{svg "octicon-triangle-down"}}</span>
@@ -80,19 +80,19 @@
 	{{else if .IsSigned}}
 		<div class="right stackable menu">
 			{{if EnableTimetracking}}
-			<a class="active-stopwatch-trigger item ui mx-0{{if not .ActiveStopwatch}} hidden{{end}}" href="{{.ActiveStopwatch.IssueLink}}">
-				<span class="fitted relative">
+			<a class="active-stopwatch-trigger item ui gt-mx-0{{if not .ActiveStopwatch}} gt-hidden{{end}}" href="{{.ActiveStopwatch.IssueLink}}">
+				<span class="fitted gt-relative">
 					{{svg "octicon-stopwatch"}}
 					<span class="header-stopwatch-dot"></span>
 					<span class="sr-mobile-only">{{.locale.Tr "active_stopwatch"}}</span>
 				</span>
 			</a>
 			<div class="active-stopwatch-popup tippy-target">
-				<div class="df ac">
-					<a class="stopwatch-link df ac" href="{{.ActiveStopwatch.IssueLink}}">
-						{{svg "octicon-issue-opened" 16 "mr-3"}}
+				<div class="gt-df gt-ac">
+					<a class="stopwatch-link gt-df gt-ac" href="{{.ActiveStopwatch.IssueLink}}">
+						{{svg "octicon-issue-opened" 16 "gt-mr-3"}}
 						<span class="stopwatch-issue">{{.ActiveStopwatch.RepoSlug}}#{{.ActiveStopwatch.IssueIndex}}</span>
-						<span class="ui primary label stopwatch-time my-0 mx-4" data-seconds="{{.ActiveStopwatch.Seconds}}">
+						<span class="ui primary label stopwatch-time gt-my-0 gt-mx-4" data-seconds="{{.ActiveStopwatch.Seconds}}">
 							{{if .ActiveStopwatch}}{{Sec2Time .ActiveStopwatch.Seconds}}{{end}}
 						</span>
 					</a>
@@ -118,16 +118,16 @@
 			</div>
 			{{end}}
 
-			<a href="{{AppSubUrl}}/notifications" class="item tooltip not-mobile mx-0" data-content="{{.locale.Tr "notifications"}}" aria-label="{{.locale.Tr "notifications"}}">
+			<a href="{{AppSubUrl}}/notifications" class="item tooltip not-mobile gt-mx-0" data-content="{{.locale.Tr "notifications"}}" aria-label="{{.locale.Tr "notifications"}}">
 				<span class="fitted item">
 					{{svg "octicon-bell"}}
-					<span class="notification_count{{if not $notificationUnreadCount}} hidden{{end}}">
+					<span class="notification_count{{if not $notificationUnreadCount}} gt-hidden{{end}}">
 						{{$notificationUnreadCount}}
 					</span>
 				</span>
 			</a>
 
-			<div class="ui dropdown jump item tooltip mx-0" data-content="{{.locale.Tr "create_new"}}">
+			<div class="ui dropdown jump item tooltip gt-mx-0" data-content="{{.locale.Tr "create_new"}}">
 				<span class="text">
 					<span class="fitted">{{svg "octicon-plus"}}</span>
 					<span class="sr-mobile-only">{{.locale.Tr "create_new"}}</span>
@@ -150,9 +150,9 @@
 				</div><!-- end content create new menu -->
 			</div><!-- end dropdown menu create new -->
 
-			<div class="ui dropdown jump item tooltip mx-0" tabindex="-1" data-content="{{.locale.Tr "user_profile_and_more"}}">
+			<div class="ui dropdown jump item tooltip gt-mx-0" tabindex="-1" data-content="{{.locale.Tr "user_profile_and_more"}}">
 				<span class="text">
-					{{avatar .SignedUser 24 "tiny"}}
+					{{avatar $.Context .SignedUser 24 "tiny"}}
 					<span class="sr-only">{{.locale.Tr "user_profile_and_more"}}</span>
 					<span class="mobile-only">{{.SignedUser.Name}}</span>
 					<span class="fitted not-mobile" tabindex="-1">{{svg "octicon-triangle-down"}}</span>
diff --git a/templates/base/head_script.tmpl b/templates/base/head_script.tmpl
index c4ac18a86..ca8c7e6a7 100644
--- a/templates/base/head_script.tmpl
+++ b/templates/base/head_script.tmpl
@@ -22,11 +22,11 @@ If you introduce mistakes in it, Gitea JavaScript code wouldn't run correctly.
 		tributeValues: Array.from(new Map([
 			{{range .Participants}}
 			['{{.Name}}', {key: '{{.Name}} {{.FullName}}', value: '{{.Name}}',
-			name: '{{.Name}}', fullname: '{{.FullName}}', avatar: '{{.AvatarLink}}'}],
+			name: '{{.Name}}', fullname: '{{.FullName}}', avatar: '{{.AvatarLink $.Context}}'}],
 			{{end}}
 			{{range .Assignees}}
 			['{{.Name}}', {key: '{{.Name}} {{.FullName}}', value: '{{.Name}}',
-			name: '{{.Name}}', fullname: '{{.FullName}}', avatar: '{{.AvatarLink}}'}],
+			name: '{{.Name}}', fullname: '{{.FullName}}', avatar: '{{.AvatarLink $.Context}}'}],
 			{{end}}
 			{{range .MentionableTeams}}
 				['{{$.MentionableTeamsOrg}}/{{.Name}}', {key: '{{$.MentionableTeamsOrg}}/{{.Name}}', value: '{{$.MentionableTeamsOrg}}/{{.Name}}',
@@ -46,3 +46,4 @@ If you introduce mistakes in it, Gitea JavaScript code wouldn't run correctly.
 	{{/* in case some pages don't render the pageData, we make sure it is an object to prevent null access */}}
 	window.config.pageData = window.config.pageData || {};
 </script>
+<script src="{{AssetUrlPrefix}}/js/webcomponents.js?v={{AssetVersion}}"></script>
diff --git a/templates/base/paginate.tmpl b/templates/base/paginate.tmpl
index 421e96a00..9dd1549ea 100644
--- a/templates/base/paginate.tmpl
+++ b/templates/base/paginate.tmpl
@@ -4,27 +4,27 @@
 		<div class="center page buttons">
 			<div class="ui borderless pagination menu">
 				<a class="{{if .IsFirst}}disabled{{end}} item navigation" {{if not .IsFirst}}href="{{$.Link}}{{if $paginationLink}}?{{$paginationLink}}{{end}}"{{end}}>
-					{{svg "gitea-double-chevron-left" 16 "mr-2"}}
+					{{svg "gitea-double-chevron-left" 16 "gt-mr-2"}}
 					<span class="navigation_label">{{$.locale.Tr "admin.first_page"}}</span>
 				</a>
 				<a class="{{if not .HasPrevious}}disabled{{end}} item navigation" {{if .HasPrevious}}href="{{$.Link}}?page={{.Previous}}{{if $paginationLink}}&{{$paginationLink}}{{end}}"{{end}}>
-					{{svg "octicon-chevron-left" 16 "mr-2"}}
+					{{svg "octicon-chevron-left" 16 "gt-mr-2"}}
 					<span class="navigation_label">{{$.locale.Tr "repo.issues.previous"}}</span>
 				</a>
 				{{range .Pages}}
 					{{if eq .Num -1}}
 						<a class="disabled item">...</a>
 					{{else}}
-						<a class="{{if .IsCurrent}}active {{end}}item content-center" {{if not .IsCurrent}}href="{{$.Link}}?page={{.Num}}{{if $paginationLink}}&{{$paginationLink}}{{end}}"{{end}}>{{.Num}}</a>
+						<a class="{{if .IsCurrent}}active {{end}}item gt-content-center" {{if not .IsCurrent}}href="{{$.Link}}?page={{.Num}}{{if $paginationLink}}&{{$paginationLink}}{{end}}"{{end}}>{{.Num}}</a>
 					{{end}}
 				{{end}}
 				<a class="{{if not .HasNext}}disabled{{end}} item navigation" {{if .HasNext}}href="{{$.Link}}?page={{.Next}}{{if $paginationLink}}&{{$paginationLink}}{{end}}"{{end}}>
 					<span class="navigation_label">{{$.locale.Tr "repo.issues.next"}}</span>
-					{{svg "octicon-chevron-right" 16 "ml-2"}}
+					{{svg "octicon-chevron-right" 16 "gt-ml-2"}}
 				</a>
 				<a class="{{if .IsLast}}disabled{{end}} item navigation" {{if not .IsLast}}href="{{$.Link}}?page={{.TotalPages}}{{if $paginationLink}}&{{$paginationLink}}{{end}}"{{end}}>
 					<span class="navigation_label">{{$.locale.Tr "admin.last_page"}}</span>
-					{{svg "gitea-double-chevron-right" 16 "ml-2"}}
+					{{svg "gitea-double-chevron-right" 16 "gt-ml-2"}}
 				</a>
 			</div>
 		</div>
diff --git a/templates/code/searchform.tmpl b/templates/code/searchform.tmpl
index 17d1944e1..c4d05cd59 100644
--- a/templates/code/searchform.tmpl
+++ b/templates/code/searchform.tmpl
@@ -4,7 +4,7 @@
 		<div class="ui dropdown selection tooltip{{if .CodeIndexerUnavailable}} disabled{{end}}" data-content="{{.locale.Tr "explore.search.type.tooltip"}}">
 			<input name="t" type="hidden" value="{{.queryType}}"{{if .CodeIndexerUnavailable}} disabled{{end}}>{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 			<div class="text">{{.locale.Tr (printf "explore.search.%s" (or .queryType "fuzzy"))}}</div>
-			<div class="menu transition hidden" tabindex="-1" style="display: block !important;">
+			<div class="menu">
 				<div class="item tooltip" data-value="" data-content="{{.locale.Tr "explore.search.fuzzy.tooltip"}}">{{.locale.Tr "explore.search.fuzzy"}}</div>
 				<div class="item tooltip" data-value="match" data-content="{{.locale.Tr "explore.search.match.tooltip"}}">{{.locale.Tr "explore.search.match"}}</div>
 			</div>
diff --git a/templates/code/searchresults.tmpl b/templates/code/searchresults.tmpl
index f9b17aee4..74721a5a6 100644
--- a/templates/code/searchresults.tmpl
+++ b/templates/code/searchresults.tmpl
@@ -1,7 +1,7 @@
-<div class="df ac fw">
+<div class="gt-df gt-ac gt-fw">
 	{{range $term := .SearchResultLanguages}}
-	<a class="ui text-label df ac mr-1 my-1 {{if eq $.Language $term.Language}}primary {{end}}basic label" href="{{AppSubUrl}}{{if $.ContextUser}}/{{$.ContextUser.Name}}/-/code{{else}}/explore/code{{end}}?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}{{if ne $.queryType ""}}&t={{$.queryType}}{{end}}">
-		<i class="color-icon mr-3" style="background-color: {{$term.Color}}"></i>
+	<a class="ui text-label gt-df gt-ac gt-mr-1 gt-my-1 {{if eq $.Language $term.Language}}primary {{end}}basic label" href="{{AppSubUrl}}{{if $.ContextUser}}/{{$.ContextUser.Name}}/-/code{{else}}/explore/code{{end}}?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}{{if ne $.queryType ""}}&t={{$.queryType}}{{end}}">
+		<i class="color-icon gt-mr-3" style="background-color: {{$term.Color}}"></i>
 		{{$term.Language}}
 		<div class="detail">{{$term.Count}}</div>
 	</a>
diff --git a/templates/explore/organizations.tmpl b/templates/explore/organizations.tmpl
index 56c6ee56a..c763fcffc 100644
--- a/templates/explore/organizations.tmpl
+++ b/templates/explore/organizations.tmpl
@@ -7,7 +7,7 @@
 		<div class="ui user list">
 			{{range .Users}}
 				<div class="item">
-					{{avatar .}}
+					{{avatar $.Context .}}
 					<div class="content">
 						<span class="header">
 							<a href="{{.HomeLink}}">{{.Name}}</a> {{.FullName}}
diff --git a/templates/explore/repo_list.tmpl b/templates/explore/repo_list.tmpl
index ad03ff800..6650e6073 100644
--- a/templates/explore/repo_list.tmpl
+++ b/templates/explore/repo_list.tmpl
@@ -1,16 +1,16 @@
 <div class="ui repository list">
 	{{range .Repos}}
 		<div class="item">
-			<div class="ui header df ac">
+			<div class="ui header gt-df gt-ac">
 				<div class="repo-title">
-					{{$avatar := (repoAvatar . 32 "mr-3")}}
+					{{$avatar := (repoAvatar . 32 "gt-mr-3")}}
 					{{if $avatar}}
 						{{$avatar}}
 					{{end}}
 					<a class="name" href="{{.Link}}">
 						{{if or $.PageIsExplore $.PageIsProfileStarList}}{{if .Owner}}{{.Owner.Name}} / {{end}}{{end}}{{.Name}}
 					</a>
-					<div class="labels df ac fw">
+					<div class="labels gt-df gt-ac gt-fw">
 						{{if .IsArchived}}
 							<span class="ui basic label">{{$.locale.Tr "repo.desc.archived"}}</span>
 						{{end}}
@@ -32,22 +32,22 @@
 							{{end}}
 						{{end}}
 						{{if .IsFork}}
-							<span class="tooltip df" data-content="{{$.locale.Tr "repo.fork"}}" data-position="bottom center">{{svg "octicon-repo-forked"}}</span>
+							<span class="tooltip gt-df" data-content="{{$.locale.Tr "repo.fork"}}" data-position="bottom center">{{svg "octicon-repo-forked"}}</span>
 						{{else if .IsMirror}}
-							<span class="tooltip df" data-content="{{$.locale.Tr "mirror"}}" data-position="bottom center">{{svg "octicon-mirror"}}</span>
+							<span class="tooltip gt-df" data-content="{{$.locale.Tr "mirror"}}" data-position="bottom center">{{svg "octicon-mirror"}}</span>
 						{{end}}
 					</div>
 				</div>
-				<div class="metas df ac text grey">
+				<div class="metas gt-df gt-ac text grey">
 					{{if .PrimaryLanguage}}
 						<a class="muted" href="{{$.Link}}?q={{$.Keyword}}&sort={{$.SortType}}&language={{.PrimaryLanguage.Language}}">
-							<span class="df ac mr-3"><i class="color-icon mr-3" style="background-color: {{.PrimaryLanguage.Color}}"></i>{{.PrimaryLanguage.Language}}</span>
+							<span class="gt-df gt-ac gt-mr-3"><i class="color-icon gt-mr-3" style="background-color: {{.PrimaryLanguage.Color}}"></i>{{.PrimaryLanguage.Language}}</span>
 						</a>
 					{{end}}
 					{{if not $.DisableStars}}
-						<span class="text grey df ac mr-3">{{svg "octicon-star" 16 "mr-3"}}{{.NumStars}}</span>
+						<span class="text grey gt-df gt-ac gt-mr-3">{{svg "octicon-star" 16 "gt-mr-3"}}{{.NumStars}}</span>
 					{{end}}
-					<span class="text grey df ac mr-3">{{svg "octicon-git-branch" 16 "mr-3"}}{{.NumForks}}</span>
+					<span class="text grey gt-df gt-ac gt-mr-3">{{svg "octicon-git-branch" 16 "gt-mr-3"}}{{.NumForks}}</span>
 				</div>
 			</div>
 			<div class="description">
diff --git a/templates/explore/users.tmpl b/templates/explore/users.tmpl
index 336daea7c..aa397e65b 100644
--- a/templates/explore/users.tmpl
+++ b/templates/explore/users.tmpl
@@ -7,7 +7,7 @@
 		<div class="ui user list">
 			{{range .Users}}
 				<div class="item">
-					{{avatar .}}
+					{{avatar $.Context .}}
 					<div class="content">
 						<span class="header"><a href="{{.HomeLink}}">{{.Name}}</a> {{.FullName}}</span>
 						<div class="description">
diff --git a/templates/install.tmpl b/templates/install.tmpl
index 3d33dcbcb..2e10b006b 100644
--- a/templates/install.tmpl
+++ b/templates/install.tmpl
@@ -28,7 +28,7 @@
 						</div>
 					</div>
 
-					<div class="hide" data-db-setting-for="common-host">
+					<div class="gt-hidden" data-db-setting-for="common-host">
 						<div class="inline required field {{if .Err_DbSetting}}error{{end}}">
 							<label for="db_host">{{.locale.Tr "install.host"}}</label>
 							<input id="db_host" name="db_host" value="{{.db_host}}">
@@ -48,7 +48,7 @@
 						</div>
 					</div>
 
-					<div class="hide" data-db-setting-for="postgres">
+					<div class="gt-hidden" data-db-setting-for="postgres">
 						<div class="inline required field">
 							<label>{{.locale.Tr "install.ssl_mode"}}</label>
 							<div class="ui selection database type dropdown">
@@ -69,7 +69,7 @@
 						</div>
 					</div>
 
-					<div class="hide" data-db-setting-for="mysql">
+					<div class="gt-hidden" data-db-setting-for="mysql">
 						<div class="inline required field">
 							<label>{{.locale.Tr "install.charset"}}</label>
 							<div class="ui selection database type dropdown">
@@ -83,7 +83,7 @@
 						</div>
 					</div>
 
-					<div class="hide" data-db-setting-for="sqlite3">
+					<div class="gt-hidden" data-db-setting-for="sqlite3">
 						<div class="inline required field {{if or .Err_DbPath .Err_DbSetting}}error{{end}}">
 							<label for="db_path">{{.locale.Tr "install.path"}}</label>
 							<input id="db_path" name="db_path" value="{{.db_path}}">
@@ -176,7 +176,7 @@
 
 					<!-- Email -->
 					<details class="optional field">
-						<summary class="title py-3{{if .Err_SMTP}} text red{{end}}">
+						<summary class="title gt-py-3{{if .Err_SMTP}} text red{{end}}">
 							{{.locale.Tr "install.email_title"}}
 						</summary>
 						<div class="inline field">
@@ -216,7 +216,7 @@
 
 					<!-- Server and other services -->
 					<details class="optional field">
-						<summary class="title py-3{{if .Err_Services}} text red{{end}}">
+						<summary class="title gt-py-3{{if .Err_Services}} text red{{end}}">
 							{{.locale.Tr "install.server_service_title"}}
 						</summary>
 						<div class="inline field">
@@ -314,7 +314,7 @@
 
 					<!-- Admin -->
 					<details class="optional field">
-						<summary class="title py-3{{if .Err_Admin}} text red{{end}}">
+						<summary class="title gt-py-3{{if .Err_Admin}} text red{{end}}">
 							{{.locale.Tr "install.admin_title"}}
 						</summary>
 						<p class="center">{{.locale.Tr "install.admin_setting_desc"}}</p>
@@ -346,5 +346,5 @@
 		</div>
 	</div>
 </div>
-<img style="display: none" src="{{AssetUrlPrefix}}/img/loading.png"/>
+<img class="gt-hidden" src="{{AssetUrlPrefix}}/img/loading.png"/>
 {{template "base/footer" .}}
diff --git a/templates/org/create.tmpl b/templates/org/create.tmpl
index 8da46fb32..26321f620 100644
--- a/templates/org/create.tmpl
+++ b/templates/org/create.tmpl
@@ -19,15 +19,15 @@
 						<span class="inline required field"><label for="visibility">{{.locale.Tr "org.settings.visibility"}}</label></span>
 						<div class="inline-grouped-list">
 							<div class="ui radio checkbox">
-								<input class="hidden enable-system-radio" tabindex="0" name="visibility" type="radio" value="0" {{if .DefaultOrgVisibilityMode.IsPublic}}checked{{end}}/>
+								<input class="enable-system-radio" tabindex="0" name="visibility" type="radio" value="0" {{if .DefaultOrgVisibilityMode.IsPublic}}checked{{end}}/>
 								<label>{{.locale.Tr "org.settings.visibility.public"}}</label>
 							</div>
 							<div class="ui radio checkbox">
-								<input class="hidden enable-system-radio" tabindex="0" name="visibility" type="radio" value="1" {{if .DefaultOrgVisibilityMode.IsLimited}}checked{{end}}/>
+								<input class="enable-system-radio" tabindex="0" name="visibility" type="radio" value="1" {{if .DefaultOrgVisibilityMode.IsLimited}}checked{{end}}/>
 								<label>{{.locale.Tr "org.settings.visibility.limited"}}</label>
 							</div>
 							<div class="ui radio checkbox">
-								<input class="hidden enable-system-radio" tabindex="0" name="visibility" type="radio" value="2" {{if .DefaultOrgVisibilityMode.IsPrivate}}checked{{end}}/>
+								<input class="enable-system-radio" tabindex="0" name="visibility" type="radio" value="2" {{if .DefaultOrgVisibilityMode.IsPrivate}}checked{{end}}/>
 								<label>{{.locale.Tr "org.settings.visibility.private"}}</label>
 							</div>
 						</div>
@@ -37,7 +37,7 @@
 						<label>{{.locale.Tr "org.settings.permission"}}</label>
 						<div class="inline-grouped-list">
 							<div class="ui checkbox">
-								<input class="hidden" type="checkbox" name="repo_admin_change_team_access" checked/>
+								<input type="checkbox" name="repo_admin_change_team_access" checked/>
 								<label>{{.locale.Tr "org.settings.repoadminchangeteam"}}</label>
 							</div>
 						</div>
diff --git a/templates/org/header.tmpl b/templates/org/header.tmpl
index 1102610e9..6106fe5d2 100644
--- a/templates/org/header.tmpl
+++ b/templates/org/header.tmpl
@@ -3,7 +3,7 @@
 		<div class="ui vertically grid head">
 			<div class="column">
 				<div class="ui header">
-					{{avatar . 100}}
+					{{avatar $.Context . 100}}
 					<span class="text thin grey"><a href="{{.HomeLink}}">{{.DisplayName}}</a></span>
 					<span class="org-visibility">
 						{{if .Visibility.IsLimited}}<div class="ui medium basic horizontal label">{{$.locale.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}}
diff --git a/templates/org/home.tmpl b/templates/org/home.tmpl
index b3724e7a6..e1adaf1c1 100644
--- a/templates/org/home.tmpl
+++ b/templates/org/home.tmpl
@@ -1,12 +1,12 @@
 {{template "base/head" .}}
 <div role="main" aria-label="{{.Title}}" class="page-content organization profile">
-	<div class="ui container df">
-		{{avatar .Org 140 "org-avatar"}}
+	<div class="ui container gt-df">
+		{{avatar $.Context .Org 140 "org-avatar"}}
 		<div id="org-info">
 			<div class="ui header">
 				{{.Org.DisplayName}}
 				{{if .EnableFeed}}
-					<a href="{{.Org.HomeLink}}.rss"><i class="ui grey icon tooltip ml-3" data-content="{{.locale.Tr "rss_feed"}}" data-position="top center">{{svg "octicon-rss" 36}}</i></a>
+					<a href="{{.Org.HomeLink}}.rss"><i class="ui grey icon tooltip gt-ml-3" data-content="{{.locale.Tr "rss_feed"}}" data-position="top center">{{svg "octicon-rss" 36}}</i></a>
 				{{end}}
 				<span class="org-visibility">
 					{{if .Org.Visibility.IsLimited}}<div class="ui large basic horizontal label">{{.locale.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}}
@@ -41,10 +41,10 @@
 					</div>
 					<div class="ui divider"></div>
 				{{end}}
-				<h4 class="ui top attached header df">
-					<strong class="f1">{{.locale.Tr "org.people"}}</strong>
+				<h4 class="ui top attached header gt-df">
+					<strong class="gt-f1">{{.locale.Tr "org.members"}}</strong>
 					<div class="ui">
-						<a class="text grey dif ac" href="{{.OrgLink}}/members"><span>{{.MembersTotal}}</span> {{svg "octicon-chevron-right"}}</a>
+						<a class="text grey gt-dif gt-ac" href="{{.OrgLink}}/members"><span>{{.MembersTotal}}</span> {{svg "octicon-chevron-right"}}</a>
 					</div>
 				</h4>
 				<div class="ui attached segment members">
@@ -52,17 +52,17 @@
 					{{range .Members}}
 						{{if or $isMember (call $.IsPublicMember .ID)}}
 							<a href="{{.HomeLink}}" title="{{.Name}}{{if .FullName}} ({{.FullName}}){{end}}">
-								{{avatar .}}
+								{{avatar $.Context .}}
 							</a>
 						{{end}}
 					{{end}}
 				</div>
 
 				{{if .IsOrganizationMember}}
-					<div class="ui top attached header df">
-						<strong class="f1">{{.locale.Tr "org.teams"}}</strong>
+					<div class="ui top attached header gt-df">
+						<strong class="gt-f1">{{.locale.Tr "org.teams"}}</strong>
 						<div class="ui">
-							<a class="text grey dif ac" href="{{.OrgLink}}/teams"><span>{{.Org.NumTeams}}</span> {{svg "octicon-chevron-right"}}</a>
+							<a class="text grey gt-dif gt-ac" href="{{.OrgLink}}/teams"><span>{{.Org.NumTeams}}</span> {{svg "octicon-chevron-right"}}</a>
 						</div>
 					</div>
 					<div class="ui attached table segment teams">
diff --git a/templates/org/member/members.tmpl b/templates/org/member/members.tmpl
index b4f788e52..b76cb9778 100644
--- a/templates/org/member/members.tmpl
+++ b/templates/org/member/members.tmpl
@@ -8,7 +8,7 @@
 			{{range .Members}}
 				<div class="item ui grid">
 					<div class="ui four wide column" style="display: flex;">
-						{{avatar . 48}}
+						{{avatar $.Context . 48}}
 						<div>
 							<div class="meta"><a href="{{.HomeLink}}">{{.Name}}</a></div>
 							<div class="meta">{{.FullName}}</div>
diff --git a/templates/org/menu.tmpl b/templates/org/menu.tmpl
index 5f543424f..7ca47cd32 100644
--- a/templates/org/menu.tmpl
+++ b/templates/org/menu.tmpl
@@ -18,7 +18,7 @@
 		{{end}}
 		{{if .IsOrganizationMember}}
 			<a class="{{if $.PageIsOrgMembers}}active {{end}}item" href="{{$.OrgLink}}/members">
-				{{svg "octicon-organization"}}&nbsp;{{$.locale.Tr "org.people"}}
+				{{svg "octicon-person"}}&nbsp;{{$.locale.Tr "org.members"}}
 				{{if .NumMembers}}
 					<div class="ui primary label">{{.NumMembers}}</div>
 				{{end}}
diff --git a/templates/org/settings/options.tmpl b/templates/org/settings/options.tmpl
index b52639fb1..c1623db4d 100644
--- a/templates/org/settings/options.tmpl
+++ b/templates/org/settings/options.tmpl
@@ -14,8 +14,8 @@
 						{{.CsrfTokenHtml}}
 						<div class="required field {{if .Err_Name}}error{{end}}">
 							<label for="org_name">{{.locale.Tr "org.org_name_holder"}}
-								<span class="text red hide" id="org-name-change-prompt"> {{.locale.Tr "org.settings.change_orgname_prompt"}}</span>
-								<span class="text red hide" id="org-name-change-redirect-prompt"> {{.locale.Tr "org.settings.change_orgname_redirect_prompt"}}</span>
+								<span class="text red gt-hidden" id="org-name-change-prompt"> {{.locale.Tr "org.settings.change_orgname_prompt"}}</span>
+								<span class="text red gt-hidden" id="org-name-change-redirect-prompt"> {{.locale.Tr "org.settings.change_orgname_redirect_prompt"}}</span>
 							</label>
 							<input id="org_name" name="name" value="{{.Org.Name}}" data-org-name="{{.Org.Name}}" autofocus required>
 						</div>
@@ -41,19 +41,19 @@
 							<label for="visibility">{{.locale.Tr "org.settings.visibility"}}</label>
 							<div class="field">
 								<div class="ui radio checkbox">
-									<input class="hidden enable-system-radio" tabindex="0" name="visibility" type="radio" value="0" {{if eq .CurrentVisibility 0}}checked{{end}}/>
+									<input class="enable-system-radio" tabindex="0" name="visibility" type="radio" value="0" {{if eq .CurrentVisibility 0}}checked{{end}}/>
 									<label>{{.locale.Tr "org.settings.visibility.public"}}</label>
 								</div>
 							</div>
 							<div class="field">
 								<div class="ui radio checkbox">
-									<input class="hidden enable-system-radio" tabindex="0" name="visibility" type="radio" value="1" {{if eq .CurrentVisibility 1}}checked{{end}}/>
+									<input class="enable-system-radio" tabindex="0" name="visibility" type="radio" value="1" {{if eq .CurrentVisibility 1}}checked{{end}}/>
 									<label>{{.locale.Tr "org.settings.visibility.limited"}}</label>
 								</div>
 							</div>
 							<div class="field">
 								<div class="ui radio checkbox">
-									<input class="hidden enable-system-radio" tabindex="0" name="visibility" type="radio" value="2" {{if eq .CurrentVisibility 2}}checked{{end}}/>
+									<input class="enable-system-radio" tabindex="0" name="visibility" type="radio" value="2" {{if eq .CurrentVisibility 2}}checked{{end}}/>
 									<label>{{.locale.Tr "org.settings.visibility.private"}}</label>
 								</div>
 							</div>
@@ -63,7 +63,7 @@
 							<label>{{.locale.Tr "org.settings.permission"}}</label>
 							<div class="field">
 								<div class="ui checkbox">
-									<input class="hidden" type="checkbox" name="repo_admin_change_team_access" {{if .RepoAdminChangeTeamAccess}}checked{{end}}/>
+									<input type="checkbox" name="repo_admin_change_team_access" {{if .RepoAdminChangeTeamAccess}}checked{{end}}/>
 									<label>{{.locale.Tr "org.settings.repoadminchangeteam"}}</label>
 								</div>
 							</div>
diff --git a/templates/org/team/invite.tmpl b/templates/org/team/invite.tmpl
index ef365dee3..55ecd049b 100644
--- a/templates/org/team/invite.tmpl
+++ b/templates/org/team/invite.tmpl
@@ -4,7 +4,7 @@
 		{{template "base/alert" .}}
 		<div class="ui centered card">
 			<div class="image">
-				{{avatar .Organization 140}}
+				{{avatar $.Context .Organization 140}}
 			</div>
 			<div class="content">
 				<div class="header">{{.locale.Tr "org.teams.invite.title" .Team.Name .Organization.Name | Str2html}}</div>
diff --git a/templates/org/team/members.tmpl b/templates/org/team/members.tmpl
index 13bd6c5b5..6ea161475 100644
--- a/templates/org/team/members.tmpl
+++ b/templates/org/team/members.tmpl
@@ -35,7 +35,7 @@
 								</form>
 							{{end}}
 							<a href="{{.HomeLink}}">
-								{{avatar .}}
+								{{avatar $.Context .}}
 								{{.DisplayName}}
 							</a>
 						</div>
diff --git a/templates/org/team/new.tmpl b/templates/org/team/new.tmpl
index d9d3902fe..a9fed40c5 100644
--- a/templates/org/team/new.tmpl
+++ b/templates/org/team/new.tmpl
@@ -71,18 +71,18 @@
 							</div>
 							<div class="ui divider"></div>
 
-							<div class="team-units required grouped field"{{if eq .Team.AccessMode 3}} style="display: none"{{end}}>
+							<div class="team-units required grouped field {{if eq .Team.AccessMode 3}}gt-hidden{{end}}">
 								<label>{{.locale.Tr "org.team_unit_desc"}}</label>
 								<table class="ui celled table">
 									<thead>
 										<tr>
 											<th>{{.locale.Tr "units.unit"}}</th>
 											<th class="center aligned">{{.locale.Tr "org.teams.none_access"}}
-											<span class="tooltip vm" data-content="{{.locale.Tr "org.teams.none_access_helper"}}">{{svg "octicon-question" 16 "ml-2"}}</span></th>
+											<span class="tooltip gt-vm" data-content="{{.locale.Tr "org.teams.none_access_helper"}}">{{svg "octicon-question" 16 "gt-ml-2"}}</span></th>
 											<th class="center aligned">{{.locale.Tr "org.teams.read_access"}}
-											<span class="tooltip vm" data-content="{{.locale.Tr "org.teams.read_access_helper"}}">{{svg "octicon-question" 16 "ml-2"}}</span></th>
+											<span class="tooltip gt-vm" data-content="{{.locale.Tr "org.teams.read_access_helper"}}">{{svg "octicon-question" 16 "gt-ml-2"}}</span></th>
 											<th class="center aligned">{{.locale.Tr "org.teams.write_access"}}
-											<span class="tooltip vm" data-content="{{.locale.Tr "org.teams.write_access_helper"}}">{{svg "octicon-question" 16 "ml-2"}}</span></th>
+											<span class="tooltip gt-vm" data-content="{{.locale.Tr "org.teams.write_access_helper"}}">{{svg "octicon-question" 16 "gt-ml-2"}}</span></th>
 										</tr>
 									</thead>
 									<tbody>
@@ -99,17 +99,17 @@
 													</td>
 													<td class="center aligned">
 														<div class="ui radio checkbox">
-															<input type="radio" class="hidden" name="unit_{{$unit.Type.Value}}" value="0"{{if or ($unit.Type.UnitGlobalDisabled) (eq ($.Team.UnitAccessMode $.Context $unit.Type) 0)}} checked{{end}} title="{{$.locale.Tr "org.teams.none_access"}}">
+															<input type="radio" name="unit_{{$unit.Type.Value}}" value="0"{{if or ($unit.Type.UnitGlobalDisabled) (eq ($.Team.UnitAccessMode $.Context $unit.Type) 0)}} checked{{end}} title="{{$.locale.Tr "org.teams.none_access"}}">
 														</div>
 													</td>
 													<td class="center aligned">
 														<div class="ui radio checkbox">
-															<input type="radio" class="hidden" name="unit_{{$unit.Type.Value}}" value="1"{{if or (eq $.Team.ID 0) (eq ($.Team.UnitAccessMode $.Context $unit.Type) 1)}} checked{{end}} {{if $unit.Type.UnitGlobalDisabled}}disabled{{end}} title="{{$.locale.Tr "org.teams.read_access"}}">
+															<input type="radio" name="unit_{{$unit.Type.Value}}" value="1"{{if or (eq $.Team.ID 0) (eq ($.Team.UnitAccessMode $.Context $unit.Type) 1)}} checked{{end}} {{if $unit.Type.UnitGlobalDisabled}}disabled{{end}} title="{{$.locale.Tr "org.teams.read_access"}}">
 														</div>
 													</td>
 													<td class="center aligned">
 														<div class="ui radio checkbox">
-															<input type="radio" class="hidden" name="unit_{{$unit.Type.Value}}" value="2"{{if (eq ($.Team.UnitAccessMode $.Context $unit.Type) 2)}} checked{{end}} {{if $unit.Type.UnitGlobalDisabled}}disabled{{end}} title="{{$.locale.Tr "org.teams.write_access"}}">
+															<input type="radio" name="unit_{{$unit.Type.Value}}" value="2"{{if (eq ($.Team.UnitAccessMode $.Context $unit.Type) 2)}} checked{{end}} {{if $unit.Type.UnitGlobalDisabled}}disabled{{end}} title="{{$.locale.Tr "org.teams.write_access"}}">
 														</div>
 													</td>
 												</tr>
@@ -121,7 +121,7 @@
 									{{if lt $unit.MaxPerm 2}}
 										<div {{if $unit.Type.UnitGlobalDisabled}}class="field tooltip" data-content="{{$.locale.Tr "repo.unit_disabled"}}"{{else}}class="field"{{end}}>
 											<div class="ui checkbox">
-												<input type="checkbox" class="hidden" name="unit_{{$unit.Type.Value}}" value="1"{{if or (eq $.Team.ID 0) (eq ($.Team.UnitAccessMode $.Context $unit.Type) 1)}} checked{{end}} {{if $unit.Type.UnitGlobalDisabled}}disabled{{end}}>
+												<input type="checkbox" name="unit_{{$unit.Type.Value}}" value="1"{{if or (eq $.Team.ID 0) (eq ($.Team.UnitAccessMode $.Context $unit.Type) 1)}} checked{{end}} {{if $unit.Type.UnitGlobalDisabled}}disabled{{end}}>
 												<label>{{$.locale.Tr $unit.NameKey}}{{if $unit.Type.UnitGlobalDisabled}} {{$.locale.Tr "org.team_unit_disabled"}}{{end}}</label>
 												<span class="help">{{$.locale.Tr $unit.DescKey}}</span>
 											</div>
diff --git a/templates/org/team/teams.tmpl b/templates/org/team/teams.tmpl
index 66ac4a421..df0620af4 100644
--- a/templates/org/team/teams.tmpl
+++ b/templates/org/team/teams.tmpl
@@ -32,7 +32,7 @@
 					</div>
 					<div class="ui attached segment members">
 						{{range .Members}}
-							{{template "shared/user/avatarlink" .}}
+							{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .}}
 						{{end}}
 					</div>
 					<div class="ui bottom attached header">
diff --git a/templates/package/content/cargo.tmpl b/templates/package/content/cargo.tmpl
index 54c40a5b0..f78647ca6 100644
--- a/templates/package/content/cargo.tmpl
+++ b/templates/package/content/cargo.tmpl
@@ -8,7 +8,7 @@
 default = "gitea"
 
 [registries.gitea]
-index = "{{AppUrl}}{{.PackageDescriptor.Owner.Name}}/_cargo-index.git"
+index = "<gitea-origin-url data-url="{{AppSubUrl}}/{{.PackageDescriptor.Owner.Name}}/_cargo-index.git"></gitea-origin-url>"
 
 [net]
 git-fetch-with-cli = true</code></pre></div>
diff --git a/templates/package/content/chef.tmpl b/templates/package/content/chef.tmpl
index f0f8de7bd..edc175f9b 100644
--- a/templates/package/content/chef.tmpl
+++ b/templates/package/content/chef.tmpl
@@ -4,7 +4,7 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-code"}} {{.locale.Tr "packages.chef.registry" | Safe}}</label>
-				<div class="markup"><pre class="code-block"><code>knife[:supermarket_site] = '{{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/chef'</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>knife[:supermarket_site] = '<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/chef"></gitea-origin-url>'</code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.chef.install"}}</label>
diff --git a/templates/package/content/composer.tmpl b/templates/package/content/composer.tmpl
index 8cc18f8ba..9acf20955 100644
--- a/templates/package/content/composer.tmpl
+++ b/templates/package/content/composer.tmpl
@@ -7,7 +7,7 @@
 				<div class="markup"><pre class="code-block"><code>{
 	"repositories": [{
 			"type": "composer",
-			"url": "{{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/composer"
+			"url": "<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/composer"></gitea-origin-url>"
 		}
 	]
 }</code></pre></div>
diff --git a/templates/package/content/conan.tmpl b/templates/package/content/conan.tmpl
index c496cee55..138890f33 100644
--- a/templates/package/content/conan.tmpl
+++ b/templates/package/content/conan.tmpl
@@ -4,7 +4,7 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.conan.registry"}}</label>
-				<div class="markup"><pre class="code-block"><code>conan remote add gitea {{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/conan</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>conan remote add gitea <gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/conan"></gitea-origin-url></code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.conan.install"}}</label>
diff --git a/templates/package/content/conda.tmpl b/templates/package/content/conda.tmpl
index ecc26bce9..3c79d3902 100644
--- a/templates/package/content/conda.tmpl
+++ b/templates/package/content/conda.tmpl
@@ -4,11 +4,11 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-code"}} {{.locale.Tr "packages.conda.registry" | Safe}}</label>
-				<div class="markup"><pre class="code-block"><code>channel_alias: {{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/conda
+				<div class="markup"><pre class="code-block"><code>channel_alias: <gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/conda"></gitea-origin-url>
 channels:
-&#32;&#32;- {{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/conda
+&#32;&#32;- <gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/conda"></gitea-origin-url>
 default_channels:
-&#32;&#32;- {{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/conda</code></pre></div>
+&#32;&#32;- <gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/conda"></gitea-origin-url></code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.conda.install"}}</label>
diff --git a/templates/package/content/container.tmpl b/templates/package/content/container.tmpl
index 34d495f35..0bf749cd7 100644
--- a/templates/package/content/container.tmpl
+++ b/templates/package/content/container.tmpl
@@ -46,7 +46,7 @@
 	{{end}}
 	{{if .PackageDescriptor.Metadata.ImageLayers}}
 		<h4 class="ui top attached header">{{.locale.Tr "packages.container.layers"}}</h4>
-		<div class="ui attached segment word-break">
+		<div class="ui attached segment gt-word-break">
 			<table class="ui very basic compact table">
 				<tbody>
 					{{range .PackageDescriptor.Metadata.ImageLayers}}
diff --git a/templates/package/content/generic.tmpl b/templates/package/content/generic.tmpl
index 2948d9eb0..eae4d670f 100644
--- a/templates/package/content/generic.tmpl
+++ b/templates/package/content/generic.tmpl
@@ -4,8 +4,11 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.generic.download"}}</label>
-				<div class="markup"><pre class="code-block"><code>{{range .PackageDescriptor.Files}}curl {{AppUrl}}api/packages/{{$.PackageDescriptor.Owner.Name}}/generic/{{$.PackageDescriptor.Package.Name}}/{{$.PackageDescriptor.Version.Version}}/{{.File.Name}}
-{{end}}</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>
+					{{- range .PackageDescriptor.Files -}}
+curl <gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{$.PackageDescriptor.Owner.Name}}/generic/{{$.PackageDescriptor.Package.Name}}/{{$.PackageDescriptor.Version.Version}}/{{.File.Name}}"></gitea-origin-url><br>
+					{{- end -}}
+				</code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{.locale.Tr "packages.generic.documentation" | Safe}}</label>
diff --git a/templates/package/content/helm.tmpl b/templates/package/content/helm.tmpl
index 59cdc157b..fc190e0e4 100644
--- a/templates/package/content/helm.tmpl
+++ b/templates/package/content/helm.tmpl
@@ -4,7 +4,7 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.helm.registry"}}</label>
-				<div class="markup"><pre class="code-block"><code>helm repo add gitea {{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/helm
+				<div class="markup"><pre class="code-block"><code>helm repo add gitea <gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/helm"></gitea-origin-url>
 helm repo update</code></pre></div>
 			</div>
 			<div class="field">
diff --git a/templates/package/content/maven.tmpl b/templates/package/content/maven.tmpl
index 0b5612151..ff89145fd 100644
--- a/templates/package/content/maven.tmpl
+++ b/templates/package/content/maven.tmpl
@@ -7,19 +7,19 @@
 				<div class="markup"><pre class="code-block"><code>&lt;repositories&gt;
 	&lt;repository&gt;
 		&lt;id&gt;gitea&lt;/id&gt;
-		&lt;url&gt;{{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/maven&lt;/url&gt;
+			&lt;url&gt;<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/maven"></gitea-origin-url>&lt;/url&gt;
 	&lt;/repository&gt;
 &lt;/repositories&gt;
 
 &lt;distributionManagement&gt;
 	&lt;repository&gt;
 		&lt;id&gt;gitea&lt;/id&gt;
-		&lt;url&gt;{{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/maven&lt;/url&gt;
+		&lt;url&gt;<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/maven"></gitea-origin-url>&lt;/url&gt;
 	&lt;/repository&gt;
 
 	&lt;snapshotRepository&gt;
 		&lt;id&gt;gitea&lt;/id&gt;
-		&lt;url&gt;{{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/maven&lt;/url&gt;
+		&lt;url&gt;<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/maven"></gitea-origin-url>&lt;/url&gt;
 	&lt;/snapshotRepository&gt;
 &lt;/distributionManagement&gt;</code></pre></div>
 			</div>
@@ -37,7 +37,7 @@
 			</div>
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.maven.download"}}</label>
-				<div class="markup"><pre class="code-block"><code>mvn dependency:get -DremoteRepositories={{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/maven -Dartifact={{.PackageDescriptor.Metadata.GroupID}}:{{.PackageDescriptor.Metadata.ArtifactID}}:{{.PackageDescriptor.Version.Version}}</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>mvn dependency:get -DremoteRepositories=<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/maven"></gitea-origin-url> -Dartifact={{.PackageDescriptor.Metadata.GroupID}}:{{.PackageDescriptor.Metadata.ArtifactID}}:{{.PackageDescriptor.Version.Version}}</code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{.locale.Tr "packages.maven.documentation" | Safe}}</label>
diff --git a/templates/package/content/npm.tmpl b/templates/package/content/npm.tmpl
index 33d51d4df..ea514c526 100644
--- a/templates/package/content/npm.tmpl
+++ b/templates/package/content/npm.tmpl
@@ -4,7 +4,7 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-code"}} {{.locale.Tr "packages.npm.registry" | Safe}}</label>
-				<div class="markup"><pre class="code-block"><code>{{if .PackageDescriptor.Metadata.Scope}}{{.PackageDescriptor.Metadata.Scope}}:{{end}}registry={{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/npm/</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>{{if .PackageDescriptor.Metadata.Scope}}{{.PackageDescriptor.Metadata.Scope}}:{{end}}registry=<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/npm/"></gitea-origin-url></code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.npm.install"}}</label>
diff --git a/templates/package/content/nuget.tmpl b/templates/package/content/nuget.tmpl
index 4ea41fa82..8ed2f04e4 100644
--- a/templates/package/content/nuget.tmpl
+++ b/templates/package/content/nuget.tmpl
@@ -4,7 +4,7 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.nuget.registry"}}</label>
-				<div class="markup"><pre class="code-block"><code>dotnet nuget add source --name Gitea --username your_username --password your_token {{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/nuget/index.json</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>dotnet nuget add source --name Gitea --username your_username --password your_token <gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/nuget/index.json"></gitea-origin-url></code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.nuget.install"}}</label>
diff --git a/templates/package/content/pub.tmpl b/templates/package/content/pub.tmpl
index 999e48ce8..e81439d4d 100644
--- a/templates/package/content/pub.tmpl
+++ b/templates/package/content/pub.tmpl
@@ -4,7 +4,7 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.pub.install"}}</label>
-				<div class="markup"><pre class="code-block"><code>dart pub add {{.PackageDescriptor.Package.Name}}:{{.PackageDescriptor.Version.Version}} --hosted-url={{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/pub/</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>dart pub add {{.PackageDescriptor.Package.Name}}:{{.PackageDescriptor.Version.Version}} --hosted-url=<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/pub/"></gitea-origin-url></code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{.locale.Tr "packages.pub.documentation" | Safe}}</label>
diff --git a/templates/package/content/pypi.tmpl b/templates/package/content/pypi.tmpl
index 1ae243813..830ba9bd6 100644
--- a/templates/package/content/pypi.tmpl
+++ b/templates/package/content/pypi.tmpl
@@ -4,7 +4,7 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.pypi.install"}}</label>
-				<div class="markup"><pre class="code-block"><code>pip install --index-url {{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/pypi/simple {{.PackageDescriptor.Package.Name}}</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>pip install --index-url <gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/pypi/simple {{.PackageDescriptor.Package.Name}}"></gitea-origin-url></code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{.locale.Tr "packages.pypi.documentation" | Safe}}</label>
diff --git a/templates/package/content/rubygems.tmpl b/templates/package/content/rubygems.tmpl
index 0cb7b670b..d8190ba4f 100644
--- a/templates/package/content/rubygems.tmpl
+++ b/templates/package/content/rubygems.tmpl
@@ -4,11 +4,11 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.rubygems.install" | Safe}}:</label>
-				<div class="markup"><pre class="code-block"><code>gem install {{.PackageDescriptor.Package.Name}} --version &quot;{{.PackageDescriptor.Version.Version}}&quot; --source &quot;{{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/rubygems&quot;</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>gem install {{.PackageDescriptor.Package.Name}} --version &quot;{{.PackageDescriptor.Version.Version}}&quot; --source &quot;<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/rubygems"></gitea-origin-url>&quot;</code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{svg "octicon-code"}} {{.locale.Tr "packages.rubygems.install2"}}:</label>
-				<div class="markup"><pre class="code-block"><code>source "{{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/rubygems" do
+				<div class="markup"><pre class="code-block"><code>source "<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/rubygems"></gitea-origin-url>" do
 	gem "{{.PackageDescriptor.Package.Name}}", "{{.PackageDescriptor.Version.Version}}"
 end</code></pre></div>
 			</div>
diff --git a/templates/package/content/vagrant.tmpl b/templates/package/content/vagrant.tmpl
index 7bd686e6a..a6a92f5ec 100644
--- a/templates/package/content/vagrant.tmpl
+++ b/templates/package/content/vagrant.tmpl
@@ -4,7 +4,7 @@
 		<div class="ui form">
 			<div class="field">
 				<label>{{svg "octicon-terminal"}} {{.locale.Tr "packages.vagrant.install"}}</label>
-				<div class="markup"><pre class="code-block"><code>vagrant box add --box-version {{.PackageDescriptor.Version.Version}} "{{AppUrl}}api/packages/{{.PackageDescriptor.Owner.Name}}/vagrant/{{.PackageDescriptor.Package.Name}}"</code></pre></div>
+				<div class="markup"><pre class="code-block"><code>vagrant box add --box-version {{.PackageDescriptor.Version.Version}} "<gitea-origin-url data-url="{{AppSubUrl}}/api/packages/{{.PackageDescriptor.Owner.Name}}/vagrant/{{.PackageDescriptor.Package.Name}}"></gitea-origin-url>"</code></pre></div>
 			</div>
 			<div class="field">
 				<label>{{.locale.Tr "packages.vagrant.documentation" | Safe}}</label>
diff --git a/templates/package/metadata/cargo.tmpl b/templates/package/metadata/cargo.tmpl
index 68232d483..79078b400 100644
--- a/templates/package/metadata/cargo.tmpl
+++ b/templates/package/metadata/cargo.tmpl
@@ -1,7 +1,7 @@
 {{if eq .PackageDescriptor.Package.Type "cargo"}}
-	{{range .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.cargo.details.repository_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.DocumentationURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.DocumentationURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.cargo.details.documentation_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
+	{{range .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.cargo.details.repository_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.DocumentationURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.DocumentationURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.cargo.details.documentation_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/chef.tmpl b/templates/package/metadata/chef.tmpl
index 00fc0e6c3..b414535f9 100644
--- a/templates/package/metadata/chef.tmpl
+++ b/templates/package/metadata/chef.tmpl
@@ -1,5 +1,5 @@
 {{if eq .PackageDescriptor.Package.Type "chef"}}
-	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.repository_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.repository_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/composer.tmpl b/templates/package/metadata/composer.tmpl
index 2e76a10da..e6f67a1dd 100644
--- a/templates/package/metadata/composer.tmpl
+++ b/templates/package/metadata/composer.tmpl
@@ -1,5 +1,5 @@
 {{if eq .PackageDescriptor.Package.Type "composer"}}
-	{{range .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.Name}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.Homepage}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.Homepage}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{range .PackageDescriptor.Metadata.License}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "mr-3"}} {{.}}</div>{{end}}
+	{{range .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.Name}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.Homepage}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.Homepage}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{range .PackageDescriptor.Metadata.License}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "gt-mr-3"}} {{.}}</div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/conan.tmpl b/templates/package/metadata/conan.tmpl
index 41cb42b69..0060f91d7 100644
--- a/templates/package/metadata/conan.tmpl
+++ b/templates/package/metadata/conan.tmpl
@@ -1,6 +1,6 @@
 {{if eq .PackageDescriptor.Package.Type "conan"}}
-	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.conan.details.repository"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.conan.details.repository"}}</a></div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/conda.tmpl b/templates/package/metadata/conda.tmpl
index 2201c8035..4021e6b91 100644
--- a/templates/package/metadata/conda.tmpl
+++ b/templates/package/metadata/conda.tmpl
@@ -1,6 +1,6 @@
 {{if eq .PackageDescriptor.Package.Type "conda"}}
-	{{if .PackageDescriptor.Metadata.License}}<div class="item">{{svg "octicon-law" 16 "mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.conda.details.repository_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.DocumentationURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.DocumentationURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.conda.details.documentation_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.License}}<div class="item">{{svg "octicon-law" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.conda.details.repository_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.DocumentationURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.DocumentationURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.conda.details.documentation_site"}}</a></div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/container.tmpl b/templates/package/metadata/container.tmpl
index 71df960f7..7ff137080 100644
--- a/templates/package/metadata/container.tmpl
+++ b/templates/package/metadata/container.tmpl
@@ -1,9 +1,9 @@
 {{if eq .PackageDescriptor.Package.Type "container"}}
-	<div class="item" title="{{.locale.Tr "packages.container.details.type"}}">{{svg "octicon-package" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Type.Name}}</div>
-	{{if .PackageDescriptor.Metadata.Platform}}<div class="item" title="{{$.locale.Tr "packages.container.details.platform"}}">{{svg "octicon-cpu" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Platform}}</div>{{end}}
-	{{range .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.Licenses}}<div class="item">{{svg "octicon-law" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Licenses}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.repository_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.DocumentationURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.DocumentationURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.documentation_site"}}</a></div>{{end}}
+	<div class="item" title="{{.locale.Tr "packages.container.details.type"}}">{{svg "octicon-package" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Type.Name}}</div>
+	{{if .PackageDescriptor.Metadata.Platform}}<div class="item" title="{{$.locale.Tr "packages.container.details.platform"}}">{{svg "octicon-cpu" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Platform}}</div>{{end}}
+	{{range .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.Licenses}}<div class="item">{{svg "octicon-law" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Licenses}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.repository_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.DocumentationURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.DocumentationURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.documentation_site"}}</a></div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/helm.tmpl b/templates/package/metadata/helm.tmpl
index 9f7f5d6ec..33e603bb3 100644
--- a/templates/package/metadata/helm.tmpl
+++ b/templates/package/metadata/helm.tmpl
@@ -1,4 +1,4 @@
 {{if eq .PackageDescriptor.Package.Type "helm"}}
-	{{range .PackageDescriptor.Metadata.Maintainers}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.Name}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.Home}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.Home}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{range .PackageDescriptor.Metadata.Maintainers}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.Name}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.Home}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.Home}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/maven.tmpl b/templates/package/metadata/maven.tmpl
index f6fcdf6da..78c0d3226 100644
--- a/templates/package/metadata/maven.tmpl
+++ b/templates/package/metadata/maven.tmpl
@@ -1,5 +1,5 @@
 {{if eq .PackageDescriptor.Package.Type "maven"}}
-	{{if .PackageDescriptor.Metadata.Name}}<div class="item">{{svg "octicon-note" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Name}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{range .PackageDescriptor.Metadata.Licenses}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "mr-3"}} {{.}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.Name}}<div class="item">{{svg "octicon-note" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Name}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{range .PackageDescriptor.Metadata.Licenses}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "gt-mr-3"}} {{.}}</div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/npm.tmpl b/templates/package/metadata/npm.tmpl
index d33a4c8bc..cbebf996f 100644
--- a/templates/package/metadata/npm.tmpl
+++ b/templates/package/metadata/npm.tmpl
@@ -1,8 +1,8 @@
 {{if eq .PackageDescriptor.Package.Type "npm"}}
-	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
 	{{range .PackageDescriptor.VersionProperties}}
-		{{if eq .Name "npm.tag"}}<div class="item" title="{{$.locale.Tr "packages.npm.details.tag"}}">{{svg "octicon-versions" 16 "mr-3"}} {{.Value}}</div>{{end}}
+		{{if eq .Name "npm.tag"}}<div class="item" title="{{$.locale.Tr "packages.npm.details.tag"}}">{{svg "octicon-versions" 16 "gt-mr-3"}} {{.Value}}</div>{{end}}
 	{{end}}
 {{end}}
diff --git a/templates/package/metadata/nuget.tmpl b/templates/package/metadata/nuget.tmpl
index b4e62b5a0..3b5610220 100644
--- a/templates/package/metadata/nuget.tmpl
+++ b/templates/package/metadata/nuget.tmpl
@@ -1,4 +1,4 @@
 {{if eq .PackageDescriptor.Package.Type "nuget"}}
-	{{if .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Authors}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Authors}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/pub.tmpl b/templates/package/metadata/pub.tmpl
index 632a50655..8147ba85c 100644
--- a/templates/package/metadata/pub.tmpl
+++ b/templates/package/metadata/pub.tmpl
@@ -1,5 +1,5 @@
 {{if eq .PackageDescriptor.Package.Type "pub"}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.repository_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.DocumentationURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.DocumentationURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.documentation_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.repository_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.DocumentationURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.DocumentationURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.documentation_site"}}</a></div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/pypi.tmpl b/templates/package/metadata/pypi.tmpl
index 13b53d359..205487d3c 100644
--- a/templates/package/metadata/pypi.tmpl
+++ b/templates/package/metadata/pypi.tmpl
@@ -1,5 +1,5 @@
 {{if eq .PackageDescriptor.Package.Type "pypi"}}
-	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.License}}<div class="item" title="{{.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.License}}</div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/rubygems.tmpl b/templates/package/metadata/rubygems.tmpl
index bddb7b542..7e9af01eb 100644
--- a/templates/package/metadata/rubygems.tmpl
+++ b/templates/package/metadata/rubygems.tmpl
@@ -1,5 +1,5 @@
 {{if eq .PackageDescriptor.Package.Type "rubygems"}}
-	{{range .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>	{{end}}
-	{{range .PackageDescriptor.Metadata.Licenses}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "mr-3"}} {{.}}</div>{{end}}
+	{{range .PackageDescriptor.Metadata.Authors}}<div class="item" title="{{$.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>	{{end}}
+	{{range .PackageDescriptor.Metadata.Licenses}}<div class="item" title="{{$.locale.Tr "packages.details.license"}}">{{svg "octicon-law" 16 "gt-mr-3"}} {{.}}</div>{{end}}
 {{end}}
diff --git a/templates/package/metadata/vagrant.tmpl b/templates/package/metadata/vagrant.tmpl
index 344e417b7..030da9c15 100644
--- a/templates/package/metadata/vagrant.tmpl
+++ b/templates/package/metadata/vagrant.tmpl
@@ -1,5 +1,5 @@
 {{if eq .PackageDescriptor.Package.Type "vagrant"}}
-	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
-	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
-	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.conan.details.repository"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.Author}}<div class="item" title="{{.locale.Tr "packages.details.author"}}">{{svg "octicon-person" 16 "gt-mr-3"}} {{.PackageDescriptor.Metadata.Author}}</div>{{end}}
+	{{if .PackageDescriptor.Metadata.ProjectURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.ProjectURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.details.project_site"}}</a></div>{{end}}
+	{{if .PackageDescriptor.Metadata.RepositoryURL}}<div class="item">{{svg "octicon-link-external" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Metadata.RepositoryURL}}" target="_blank" rel="noopener noreferrer me">{{.locale.Tr "packages.conan.details.repository"}}</a></div>{{end}}
 {{end}}
diff --git a/templates/package/settings.tmpl b/templates/package/settings.tmpl
index a2c4bd4c2..dc12fb820 100644
--- a/templates/package/settings.tmpl
+++ b/templates/package/settings.tmpl
@@ -51,7 +51,7 @@
 						{{.locale.Tr "packages.settings.delete"}}
 					</div>
 					<div class="content">
-						<div class="ui warning message text left word-break">
+						<div class="ui warning message text left gt-word-break">
 							{{.locale.Tr "packages.settings.delete.notice" .PackageDescriptor.Package.Name .PackageDescriptor.Version.Version}}
 						</div>
 						<form class="ui form" action="{{.Link}}" method="post">
diff --git a/templates/package/shared/list.tmpl b/templates/package/shared/list.tmpl
index 01e0cb49a..2b6398fcd 100644
--- a/templates/package/shared/list.tmpl
+++ b/templates/package/shared/list.tmpl
@@ -15,13 +15,13 @@
 	</form>
 	<div class="ui {{if .PackageDescriptors}}issue list{{end}}">
 		{{range .PackageDescriptors}}
-			<li class="item df py-3">
-				<div class="issue-item-main f1 fc df">
+			<li class="item gt-df gt-py-3">
+				<div class="issue-item-main gt-f1 gt-fc gt-df">
 					<div class="issue-item-top-row">
 						<a class="title" href="{{.FullWebLink}}">{{.Package.Name}}</a>
 						<span class="ui label">{{svg .Package.Type.SVGName 16}} {{.Package.Type.Name}}</span>
 					</div>
-					<div class="desc issue-item-bottom-row df ac fw my-1">
+					<div class="desc issue-item-bottom-row gt-df gt-ac gt-fw gt-my-1">
 						{{$timeStr := TimeSinceUnix .Version.CreatedUnix $.locale}}
 						{{$hasRepositoryAccess := false}}
 						{{if .Repository}}
diff --git a/templates/package/shared/versionlist.tmpl b/templates/package/shared/versionlist.tmpl
index 952634cfb..ba488586a 100644
--- a/templates/package/shared/versionlist.tmpl
+++ b/templates/package/shared/versionlist.tmpl
@@ -21,12 +21,12 @@
 	</form>
 	<div class="ui {{if .PackageDescriptors}}issue list{{end}}">
 		{{range .PackageDescriptors}}
-			<li class="item df py-3">
-				<div class="issue-item-main f1 fc df">
+			<li class="item gt-df gt-py-3">
+				<div class="issue-item-main gt-f1 gt-fc gt-df">
 					<div class="issue-item-top-row">
 						<a class="title" href="{{.FullWebLink}}">{{.Version.LowerVersion}}</a>
 					</div>
-					<div class="desc issue-item-bottom-row df ac fw my-1">
+					<div class="desc issue-item-bottom-row gt-df gt-ac gt-fw gt-my-1">
 						{{$.locale.Tr "packages.published_by" (TimeSinceUnix .Version.CreatedUnix $.locale) .Creator.HomeLink (.Creator.GetDisplayName | Escape) | Safe}}
 					</div>
 				</div>
diff --git a/templates/package/view.tmpl b/templates/package/view.tmpl
index 2b3213968..839d9cf21 100644
--- a/templates/package/view.tmpl
+++ b/templates/package/view.tmpl
@@ -39,12 +39,12 @@
 					<div class="ui segment metas">
 						<strong>{{.locale.Tr "packages.details"}}</strong>
 						<div class="ui relaxed list">
-							<div class="item">{{svg .PackageDescriptor.Package.Type.SVGName 16 "mr-3"}} {{.PackageDescriptor.Package.Type.Name}}</div>
+							<div class="item">{{svg .PackageDescriptor.Package.Type.SVGName 16 "gt-mr-3"}} {{.PackageDescriptor.Package.Type.Name}}</div>
 							{{if .HasRepositoryAccess}}
-							<div class="item">{{svg "octicon-repo" 16 "mr-3"}} <a href="{{.PackageDescriptor.Repository.Link}}">{{.PackageDescriptor.Repository.FullName}}</a></div>
+							<div class="item">{{svg "octicon-repo" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Repository.Link}}">{{.PackageDescriptor.Repository.FullName}}</a></div>
 							{{end}}
-							<div class="item">{{svg "octicon-calendar" 16 "mr-3"}} {{TimeSinceUnix .PackageDescriptor.Version.CreatedUnix $.locale}}</div>
-							<div class="item">{{svg "octicon-download" 16 "mr-3"}} {{.PackageDescriptor.Version.DownloadCount}}</div>
+							<div class="item">{{svg "octicon-calendar" 16 "gt-mr-3"}} {{TimeSinceUnix .PackageDescriptor.Version.CreatedUnix $.locale}}</div>
+							<div class="item">{{svg "octicon-download" 16 "gt-mr-3"}} {{.PackageDescriptor.Version.DownloadCount}}</div>
 							{{template "package/metadata/cargo" .}}
 							{{template "package/metadata/chef" .}}
 							{{template "package/metadata/composer" .}}
@@ -60,7 +60,7 @@
 							{{template "package/metadata/pypi" .}}
 							{{template "package/metadata/rubygems" .}}
 							{{template "package/metadata/vagrant" .}}
-							<div class="item">{{svg "octicon-database" 16 "mr-3"}} {{FileSize .PackageDescriptor.CalculateBlobSize}}</div>
+							<div class="item">{{svg "octicon-database" 16 "gt-mr-3"}} {{FileSize .PackageDescriptor.CalculateBlobSize}}</div>
 						</div>
 						{{if not (eq .PackageDescriptor.Package.Type "container")}}
 							<div class="ui divider"></div>
@@ -91,10 +91,10 @@
 							<div class="ui divider"></div>
 							<div class="ui relaxed list">
 								{{if .HasRepositoryAccess}}
-								<div class="item">{{svg "octicon-issue-opened" 16 "mr-3"}} <a href="{{.PackageDescriptor.Repository.Link}}/issues">{{.locale.Tr "repo.issues"}}</a></div>
+								<div class="item">{{svg "octicon-issue-opened" 16 "gt-mr-3"}} <a href="{{.PackageDescriptor.Repository.Link}}/issues">{{.locale.Tr "repo.issues"}}</a></div>
 								{{end}}
 								{{if .CanWritePackages}}
-								<div class="item">{{svg "octicon-tools" 16 "mr-3"}} <a href="{{.Link}}/settings">{{.locale.Tr "repo.settings"}}</a></div>
+								<div class="item">{{svg "octicon-tools" 16 "gt-mr-3"}} <a href="{{.Link}}/settings">{{.locale.Tr "repo.settings"}}</a></div>
 								{{end}}
 							</div>
 						{{end}}
diff --git a/templates/post-install.tmpl b/templates/post-install.tmpl
index e098f43fd..0d6cd3082 100644
--- a/templates/post-install.tmpl
+++ b/templates/post-install.tmpl
@@ -13,7 +13,7 @@
 					</div>
 					<div class="ui stackable middle very relaxed page grid">
 						<div class="sixteen wide center aligned centered column">
-							<p><a href="{{AppUrl}}user/login">{{AppUrl}}user/login</a></p>
+							<p><a href="{{AppSubUrl}}/user/login">{{AppSubUrl}}/user/login</a></p>
 						</div>
 					</div>
 				</div>
diff --git a/templates/projects/list.tmpl b/templates/projects/list.tmpl
index 21a3350a7..8d9594e2b 100644
--- a/templates/projects/list.tmpl
+++ b/templates/projects/list.tmpl
@@ -12,11 +12,11 @@
 		{{template "base/alert" .}}
 		<div class="ui compact tiny menu">
 			<a class="item{{if not .IsShowClosed}} active{{end}}" href="{{$.Link}}?state=open">
-				{{svg "octicon-project" 16 "mr-3"}}
+				{{svg "octicon-project" 16 "gt-mr-3"}}
 				{{JsPrettyNumber .OpenCount}}&nbsp;{{.locale.Tr "repo.issues.open_title"}}
 			</a>
 			<a class="item{{if .IsShowClosed}} active{{end}}" href="{{$.Link}}?state=closed">
-				{{svg "octicon-check" 16 "mr-3"}}
+				{{svg "octicon-check" 16 "gt-mr-3"}}
 				{{JsPrettyNumber .ClosedCount}}&nbsp;{{.locale.Tr "repo.issues.closed_title"}}
 			</a>
 		</div>
@@ -45,9 +45,9 @@
 							{{svg "octicon-clock"}} {{$.locale.Tr "repo.milestones.closed" $closedDate|Str2html}}
 						{{end}}
 						<span class="issue-stats">
-							{{svg "octicon-issue-opened" 16 "mr-3"}}
+							{{svg "octicon-issue-opened" 16 "gt-mr-3"}}
 							{{JsPrettyNumber .NumOpenIssues}}&nbsp;{{$.locale.Tr "repo.issues.open_title"}}
-							{{svg "octicon-check" 16 "mr-3"}}
+							{{svg "octicon-check" 16 "gt-mr-3"}}
 							{{JsPrettyNumber .NumClosedIssues}}&nbsp;{{$.locale.Tr "repo.issues.closed_title"}}
 						</span>
 					</div>
diff --git a/templates/projects/new.tmpl b/templates/projects/new.tmpl
index 04192c64c..19bf50369 100644
--- a/templates/projects/new.tmpl
+++ b/templates/projects/new.tmpl
@@ -36,7 +36,7 @@
 						<input type="hidden" name="board_type" value="{{.type}}">
 						<div class="default text">{{.locale.Tr "repo.projects.template.desc_helper"}}</div>
 						<div class="menu">
-							{{range $element := .ProjectTypes}}
+							{{range $element := .BoardTypes}}
 								<div class="item" data-id="{{$element.BoardType}}" data-value="{{$element.BoardType}}">{{$.locale.Tr $element.Translation}}</div>
 							{{end}}
 						</div>
diff --git a/templates/projects/view.tmpl b/templates/projects/view.tmpl
index 72131e30b..b25cf2526 100644
--- a/templates/projects/view.tmpl
+++ b/templates/projects/view.tmpl
@@ -48,22 +48,22 @@
 					<div class="ui compact right small menu">
 						<a class="item" href="{{$.Link}}/edit" data-id={{$.Project.ID}} data-title={{$.Project.Title}}>
 							{{svg "octicon-pencil"}}
-							<span class="mx-3">{{$.locale.Tr "repo.issues.label_edit"}}</span>
+							<span class="gt-mx-3">{{$.locale.Tr "repo.issues.label_edit"}}</span>
 						</a>
 						{{if .Project.IsClosed}}
 							<a class="item link-action" href data-url="{{$.Link}}/open">
 								{{svg "octicon-check"}}
-								<span class="mx-3">{{$.locale.Tr "repo.projects.open"}}</span>
+								<span class="gt-mx-3">{{$.locale.Tr "repo.projects.open"}}</span>
 							</a>
 						{{else}}
 							<a class="item link-action" href data-url="{{$.Link}}/close">
 								{{svg "octicon-skip"}}
-								<span class="mx-3">{{$.locale.Tr "repo.projects.close"}}</span>
+								<span class="gt-mx-3">{{$.locale.Tr "repo.projects.close"}}</span>
 							</a>
 						{{end}}
 						<a class="item delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.Project.ID}}">
 							{{svg "octicon-trash"}}
-							<span class="mx-3">{{$.locale.Tr "repo.issues.label_delete"}}</span>
+							<span class="gt-mx-3">{{$.locale.Tr "repo.issues.label_delete"}}</span>
 						</a>
 					</div>
 				</div>
@@ -77,8 +77,8 @@
 			{{range $board := .Boards}}
 
 			<div class="ui segment board-column" style="background: {{.Color}} !important;" data-id="{{.ID}}" data-sorting="{{.Sorting}}" data-url="{{$.Link}}/{{.ID}}">
-				<div class="board-column-header df ac sb">
-					<div class="ui large label board-label py-2">
+				<div class="board-column-header gt-df gt-ac gt-sb">
+					<div class="ui large label board-label gt-py-2">
 						<div class="ui small circular grey label board-card-cnt">
 							{{.NumIssues}}
 						</div>
@@ -86,7 +86,7 @@
 					</div>
 					{{if and $.CanWriteProjects (ne .ID 0)}}
 						<div class="ui dropdown jump item tooltip">
-							<div class="not-mobile px-3" tabindex="-1">
+							<div class="not-mobile gt-px-3" tabindex="-1">
 								{{svg "octicon-kebab-horizontal"}}
 							</div>
 							<div class="menu user-menu" tabindex="-1">
@@ -175,9 +175,9 @@
 
 					<!-- start issue card -->
 					<div class="card board-card" data-issue="{{.ID}}">
-						<div class="content p-0">
+						<div class="content gt-p-0">
 							<div class="header">
-								<span class="dif ac vm {{if .IsClosed}}red{{else}}green{{end}}">
+								<span class="gt-dif gt-ac gt-vm {{if .IsClosed}}red{{else}}green{{end}}">
 									{{if .IsPull}}
 										{{if .PullRequest.HasMerged}}
 											{{svg "octicon-git-merge" 16 "text purple"}}
@@ -196,11 +196,11 @@
 										{{end}}
 									{{end}}
 								</span>
-								<a class="project-board-title vm" href="{{.Link}}">
+								<a class="project-board-title gt-vm" href="{{.Link}}">
 									{{.Title}}
 								</a>
 							</div>
-							<div class="meta my-2">
+							<div class="meta gt-my-2">
 								<span class="text light grey">
 									{{.Repo.FullName}}#{{.Index}}
 									{{$timeStr := TimeSinceUnix .GetLastEventTimestamp $.locale}}
@@ -214,31 +214,31 @@
 								</span>
 							</div>
 							{{- if .MilestoneID}}
-							<div class="meta my-2">
+							<div class="meta gt-my-2">
 								<a class="milestone" href="{{$.RepoLink}}/milestone/{{.MilestoneID}}">
-									{{svg "octicon-milestone" 16 "mr-2 vm"}}
-									<span class="vm">{{.Milestone.Name}}</span>
+									{{svg "octicon-milestone" 16 "gt-mr-2 gt-vm"}}
+									<span class="gt-vm">{{.Milestone.Name}}</span>
 								</a>
 							</div>
 							{{- end}}
 							{{- range index $.LinkedPRs .ID}}
-							<div class="meta my-2">
+							<div class="meta gt-my-2">
 								<a href="{{$.RepoLink}}/pulls/{{.Index}}">
-									<span class="m-0 {{if .PullRequest.HasMerged}}purple{{else if .IsClosed}}red{{else}}green{{end}}">{{svg "octicon-git-merge" 16 "mr-2 vm"}}</span>
-									<span class="vm">{{.Title}} <span class="text light grey">#{{.Index}}</span></span>
+									<span class="gt-m-0 {{if .PullRequest.HasMerged}}purple{{else if .IsClosed}}red{{else}}green{{end}}">{{svg "octicon-git-merge" 16 "gt-mr-2 gt-vm"}}</span>
+									<span class="gt-vm">{{.Title}} <span class="text light grey">#{{.Index}}</span></span>
 								</a>
 							</div>
 							{{- end}}
 						</div>
 
 						{{if or .Labels .Assignees}}
-						<div class="extra content labels-list p-0 pt-2">
+						<div class="extra content labels-list gt-p-0 gt-pt-2">
 							{{range .Labels}}
-								<a class="ui label" target="_blank" href="{{$.RepoLink}}/issues?labels={{.ID}}" style="color: {{.ForegroundColor}}; background-color: {{.Color}};" title="{{.Description | RenderEmojiPlain}}">{{.Name | RenderEmoji}}</a>
+								<a target="_blank" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{RenderLabel .}}</a>
 							{{end}}
 							<div class="right floated">
 								{{range .Assignees}}
-									<a class="tooltip" target="_blank" href="{{.HomeLink}}" data-content="{{$.locale.Tr "repo.projects.board.assigned_to"}} {{.Name}}">{{avatar . 28 "mini mr-3"}}</a>
+									<a class="tooltip" target="_blank" href="{{.HomeLink}}" data-content="{{$.locale.Tr "repo.projects.board.assigned_to"}} {{.Name}}">{{avatar . 28 "mini gt-mr-3"}}</a>
 								{{end}}
 							</div>
 						</div>
diff --git a/templates/repo/actions/openclose.tmpl b/templates/repo/actions/openclose.tmpl
index 4190ddf75..804ef104e 100644
--- a/templates/repo/actions/openclose.tmpl
+++ b/templates/repo/actions/openclose.tmpl
@@ -1,10 +1,10 @@
 <div class="ui compact tiny menu">
 	<a class="{{if not .IsShowClosed}}active {{end}}item" href="{{$.Link}}?workflow={{.CurWorkflow}}&state=open">
-		{{svg "octicon-issue-opened" 16 "mr-3"}}
+		{{svg "octicon-issue-opened" 16 "gt-mr-3"}}
 		{{.locale.Tr "actions.runs.open_tab" $.NumOpenActionRuns}}
 	</a>
 	<a class="{{if .IsShowClosed}}active {{end}}item" href="{{$.Link}}?workflow={{.CurWorkflow}}&state=closed">
-		{{svg "octicon-issue-closed" 16 "mr-3"}}
+		{{svg "octicon-issue-closed" 16 "gt-mr-3"}}
 		{{.locale.Tr "actions.runs.closed_tab" $.NumClosedActionRuns}}
 	</a>
 </div>
diff --git a/templates/repo/actions/runs_list.tmpl b/templates/repo/actions/runs_list.tmpl
index 2a8522294..a01d21657 100644
--- a/templates/repo/actions/runs_list.tmpl
+++ b/templates/repo/actions/runs_list.tmpl
@@ -1,12 +1,12 @@
 <div class="issue list">
 	{{range .Runs}}
-		<li class="item df py-3">
-			<div class="issue-item-left df">
+		<li class="item gt-df gt-py-3">
+			<div class="issue-item-left gt-df">
 				{{template "repo/actions/status" .Status}}
 			</div>
-			<div class="issue-item-main f1 fc df">
+			<div class="issue-item-main gt-f1 gt-fc gt-df">
 				<div class="issue-item-top-row">
-					<a class="index ml-0 mr-2" href="{{if .Link}}{{.Link}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
+					<a class="index gt-ml-0 gt-mr-2" href="{{if .Link}}{{.Link}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
 						{{.Title}}
 					</a>
 					<span class="ui label">
@@ -17,7 +17,7 @@
 						{{end}}
 					</span>
 				</div>
-				<div class="desc issue-item-bottom-row df ac fw my-1">
+				<div class="desc issue-item-bottom-row gt-df gt-ac gt-fw gt-my-1">
 					<b>{{if not $.CurWorkflow}}{{.WorkflowID}} {{end}}#{{.Index}}</b>: {{$.locale.Tr "actions.runs.commit"}}
 					<a href="{{$.RepoLink}}/commit/{{.CommitSHA}}">{{ShortSha .CommitSHA}}</a>&nbsp; {{$.locale.Tr "actions.runs.pushed_by"}} {{.TriggerUser.GetDisplayName | Escape}}
 				</div>
diff --git a/templates/repo/blame.tmpl b/templates/repo/blame.tmpl
index e4a10ee57..70f47aeb9 100644
--- a/templates/repo/blame.tmpl
+++ b/templates/repo/blame.tmpl
@@ -1,9 +1,9 @@
 <div class="{{TabSizeClass .Editorconfig .FileName}} non-diff-file-content">
-	<h4 class="file-header ui top attached header df ac sb fw">
-		<div class="file-header-left df ac py-3 pr-4">
+	<h4 class="file-header ui top attached header gt-df gt-ac gt-sb gt-fw">
+		<div class="file-header-left gt-df gt-ac gt-py-3 gt-pr-4">
 			{{template "repo/file_info" .}}
 		</div>
-		<div class="file-header-right file-actions df ac fw">
+		<div class="file-header-right file-actions gt-df gt-ac gt-fw">
 			<div class="ui buttons">
 				<a class="ui tiny button" href="{{$.RawFileLink}}">{{.locale.Tr "repo.file_raw"}}</a>
 				{{if not .IsViewCommit}}
@@ -12,7 +12,7 @@
 				<a class="ui tiny button" href="{{.RepoLink}}/src/{{.BranchNameSubURL}}/{{.TreePath | PathEscapeSegments}}">{{.locale.Tr "repo.normal_view"}}</a>
 				<a class="ui tiny button" href="{{.RepoLink}}/commits/{{.BranchNameSubURL}}/{{.TreePath | PathEscapeSegments}}">{{.locale.Tr "repo.file_history"}}</a>
 				<a class="ui tiny button unescape-button">{{.locale.Tr "repo.unescape_control_characters"}}</a>
-				<a class="ui tiny button escape-button" style="display: none;">{{.locale.Tr "repo.escape_control_characters"}}</a>
+				<a class="ui tiny button escape-button gt-hidden">{{.locale.Tr "repo.escape_control_characters"}}</a>
 			</div>
 		</div>
 	</h4>
@@ -57,7 +57,7 @@
 								</td>
 							{{end}}
 							<td rel="L{{$row.RowNumber}}" rel="L{{$row.RowNumber}}" class="lines-code blame-code chroma">
-								<code class="code-inner pl-3">{{$row.Code}}</code>
+								<code class="code-inner gt-pl-3">{{$row.Code}}</code>
 							</td>
 						</tr>
 					{{end}}
diff --git a/templates/repo/branch/list.tmpl b/templates/repo/branch/list.tmpl
index 1a68c90e5..cfa81a0f5 100644
--- a/templates/repo/branch/list.tmpl
+++ b/templates/repo/branch/list.tmpl
@@ -18,7 +18,7 @@
 									{{svg "octicon-shield-lock"}}
 								{{end}}
 								<a href="{{.RepoLink}}/src/branch/{{PathEscapeSegments .DefaultBranch}}">{{.DefaultBranch}}</a>
-								<p class="info df ac my-2">{{svg "octicon-git-commit" 16 "mr-2"}}<a href="{{.RepoLink}}/commit/{{PathEscape .DefaultBranchBranch.Commit.ID.String}}">{{ShortSha .DefaultBranchBranch.Commit.ID.String}}</a> · <span class="commit-message">{{RenderCommitMessage $.Context .DefaultBranchBranch.Commit.CommitMessage .RepoLink .Repository.ComposeMetas}}</span> · {{.locale.Tr "org.repo_updated"}} {{TimeSince .DefaultBranchBranch.Commit.Committer.When .locale}}</p>
+								<p class="info gt-df gt-ac gt-my-2">{{svg "octicon-git-commit" 16 "gt-mr-2"}}<a href="{{.RepoLink}}/commit/{{PathEscape .DefaultBranchBranch.Commit.ID.String}}">{{ShortSha .DefaultBranchBranch.Commit.ID.String}}</a> · <span class="commit-message">{{RenderCommitMessage $.Context .DefaultBranchBranch.Commit.CommitMessage .RepoLink .Repository.ComposeMetas}}</span> · {{.locale.Tr "org.repo_updated"}} {{TimeSince .DefaultBranchBranch.Commit.Committer.When .locale}}</p>
 							</td>
 							<td class="right aligned overflow-visible">
 								{{if and $.IsWriter (not $.Repository.IsArchived) (not .IsDeleted)}}
@@ -61,7 +61,7 @@
 											{{svg "octicon-shield-lock"}}
 										{{end}}
 										<a href="{{$.RepoLink}}/src/branch/{{PathEscapeSegments .Name}}">{{.Name}}</a>
-										<p class="info df ac my-2">{{svg "octicon-git-commit" 16 "mr-2"}}<a href="{{$.RepoLink}}/commit/{{PathEscape .Commit.ID.String}}">{{ShortSha .Commit.ID.String}}</a> · <span class="commit-message">{{RenderCommitMessage $.Context .Commit.CommitMessage $.RepoLink $.Repository.ComposeMetas}}</span> · {{$.locale.Tr "org.repo_updated"}} {{TimeSince .Commit.Committer.When $.locale}}</p>
+										<p class="info gt-df gt-ac gt-my-2">{{svg "octicon-git-commit" 16 "gt-mr-2"}}<a href="{{$.RepoLink}}/commit/{{PathEscape .Commit.ID.String}}">{{ShortSha .Commit.ID.String}}</a> · <span class="commit-message">{{RenderCommitMessage $.Context .Commit.CommitMessage $.RepoLink $.Repository.ComposeMetas}}</span> · {{$.locale.Tr "org.repo_updated"}} {{TimeSince .Commit.Committer.When $.locale}}</p>
 									{{end}}
 									</td>
 									<td class="three wide ui">
@@ -86,23 +86,23 @@
 												</a>
 											{{else if and (not .IsDeleted) $.AllowsPulls (gt .CommitsAhead 0)}}
 											<a href="{{$.RepoLink}}/compare/{{PathEscapeSegments $.DefaultBranch}}...{{if ne $.Repository.Owner.Name $.Owner.Name}}{{PathEscape $.Owner.Name}}:{{end}}{{PathEscapeSegments .Name}}">
-												<button id="new-pull-request" class="ui compact basic button mr-0">{{if $.CanPull}}{{$.locale.Tr "repo.pulls.compare_changes"}}{{else}}{{$.locale.Tr "action.compare_branch"}}{{end}}</button>
+												<button id="new-pull-request" class="ui compact basic button gt-mr-0">{{if $.CanPull}}{{$.locale.Tr "repo.pulls.compare_changes"}}{{else}}{{$.locale.Tr "action.compare_branch"}}{{end}}</button>
 											</a>
 											{{end}}
 										{{else if and .LatestPullRequest.HasMerged .MergeMovedOn}}
 											{{if and (not .IsDeleted) $.AllowsPulls (gt .CommitsAhead 0)}}
 											<a href="{{$.RepoLink}}/compare/{{PathEscapeSegments $.DefaultBranch}}...{{if ne $.Repository.Owner.Name $.Owner.Name}}{{$.Owner.Name}}:{{end}}{{.Name | PathEscapeSegments}}">
-												<button id="new-pull-request" class="ui compact basic button mr-0">{{if $.CanPull}}{{$.locale.Tr "repo.pulls.compare_changes"}}{{else}}{{$.locale.Tr "action.compare_branch"}}{{end}}</button>
+												<button id="new-pull-request" class="ui compact basic button gt-mr-0">{{if $.CanPull}}{{$.locale.Tr "repo.pulls.compare_changes"}}{{else}}{{$.locale.Tr "action.compare_branch"}}{{end}}</button>
 											</a>
 											{{end}}
 										{{else}}
-											<a href="{{.LatestPullRequest.Issue.Link}}" class="vm ref-issue">{{if not .LatestPullRequest.IsSameRepo}}{{.LatestPullRequest.BaseRepo.FullName}}{{end}}#{{.LatestPullRequest.Issue.Index}}</a>
+											<a href="{{.LatestPullRequest.Issue.Link}}" class="gt-vm ref-issue">{{if not .LatestPullRequest.IsSameRepo}}{{.LatestPullRequest.BaseRepo.FullName}}{{end}}#{{.LatestPullRequest.Issue.Index}}</a>
 											{{if .LatestPullRequest.HasMerged}}
-												<a href="{{.LatestPullRequest.Issue.Link}}" class="ui text-label purple large label vm">{{svg "octicon-git-merge" 16 "mr-2"}}{{$.locale.Tr "repo.pulls.merged"}}</a>
+												<a href="{{.LatestPullRequest.Issue.Link}}" class="ui text-label purple large label gt-vm">{{svg "octicon-git-merge" 16 "gt-mr-2"}}{{$.locale.Tr "repo.pulls.merged"}}</a>
 											{{else if .LatestPullRequest.Issue.IsClosed}}
-												<a href="{{.LatestPullRequest.Issue.Link}}" class="ui text-label red large label vm">{{svg "octicon-git-pull-request" 16 "mr-2"}}{{$.locale.Tr "repo.issues.closed_title"}}</a>
+												<a href="{{.LatestPullRequest.Issue.Link}}" class="ui text-label red large label gt-vm">{{svg "octicon-git-pull-request" 16 "gt-mr-2"}}{{$.locale.Tr "repo.issues.closed_title"}}</a>
 											{{else}}
-												<a href="{{.LatestPullRequest.Issue.Link}}" class="ui text-label green large label vm">{{svg "octicon-git-pull-request" 16 "mr-2"}}{{$.locale.Tr "repo.issues.open_title"}}</a>
+												<a href="{{.LatestPullRequest.Issue.Link}}" class="ui text-label green large label gt-vm">{{svg "octicon-git-pull-request" 16 "gt-mr-2"}}{{$.locale.Tr "repo.issues.open_title"}}</a>
 											{{end}}
 										{{end}}
 									</td>
diff --git a/templates/repo/branch_dropdown.tmpl b/templates/repo/branch_dropdown.tmpl
index edb077a01..89d65146a 100644
--- a/templates/repo/branch_dropdown.tmpl
+++ b/templates/repo/branch_dropdown.tmpl
@@ -14,20 +14,20 @@
 		data-branch-url-suffix="{{if .branchURLSuffix}}{{.branchURLSuffix}}{{else}}{{if $.root.TreePath}}/{{PathEscapeSegments $.root.TreePath}}{{end}}{{end}}"
 		data-tag-url-prefix="{{if .tagURLPrefix}}{{.tagURLPrefix}}{{else if $release}}{{$.root.RepoLink}}/compare/{{else}}{{$.root.RepoLink}}/{{if $.root.PageIsCommits}}commits{{else}}src{{end}}/tag/{{end}}"
 		data-tag-url-suffix="{{if .tagURLSuffix}}{{.tagURLSuffix}}{{else if $release}}...{{if $release.IsDraft}}{{PathEscapeSegments $release.Target}}{{else}}{{if $release.TagName}}{{PathEscapeSegments $release.TagName}}{{else}}{{PathEscapeSegments $release.Sha1}}{{end}}{{end}}{{else}}{{if $.root.TreePath}}/{{PathEscapeSegments $.root.TreePath}}{{end}}{{end}}">
-		<button class="branch-dropdown-button ellipsis ui basic small compact button df" @click="menuVisible = !menuVisible" @keyup.enter="menuVisible = !menuVisible">
-			<span class="text df ac mr-2">
+		<button class="branch-dropdown-button gt-ellipsis ui basic small compact button gt-df" @click="menuVisible = !menuVisible" @keyup.enter="menuVisible = !menuVisible">
+			<span class="text gt-df gt-ac gt-mr-2">
 				{{if $release}}
 					{{.root.locale.Tr "repo.release.compare"}}
 				{{else}}
 					<span :class="{visible: isViewTag}" v-if="isViewTag" {{if not (eq $type "tag")}}v-cloak{{end}}>{{svg "octicon-tag"}}</span>
 					<span :class="{visible: isViewBranch}" v-if="isViewBranch" {{if not (eq $type "branch")}}v-cloak{{end}}>{{svg "octicon-git-branch"}}</span>
 					<span :class="{visible: isViewTree}" v-if="isViewTree" {{if not (eq $type "tree")}}v-cloak{{end}}>{{svg "octicon-git-branch"}}</span>
-					<strong ref="dropdownRefName" class="ml-3">{{if and .root.IsViewTag (not .noTag)}}{{.root.TagName}}{{else if .root.IsViewBranch}}{{.root.BranchName}}{{else}}{{ShortSha .root.CommitID}}{{end}}</strong>
+					<strong ref="dropdownRefName" class="gt-ml-3">{{if and .root.IsViewTag (not .noTag)}}{{.root.TagName}}{{else if .root.IsViewBranch}}{{.root.BranchName}}{{else}}{{ShortSha .root.CommitID}}{{end}}</strong>
 				{{end}}
 			</span>
 			{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 		</button>
-		<div class="data" style="display: none" data-mode="{{if or .root.IsViewTag .isTag}}tags{{else}}branches{{end}}">
+		<div class="data gt-hidden" data-mode="{{if or .root.IsViewTag .isTag}}tags{{else}}branches{{end}}">
 			{{if $showBranchesInDropdown}}
 				{{range .root.Branches}}
 					<div class="item branch {{if eq $defaultBranch .}}selected{{end}}" data-url="{{PathEscapeSegments .}}">{{.}}</div>
@@ -45,7 +45,7 @@
 		</div>
 		<div class="menu transition" :class="{visible: menuVisible}" v-if="menuVisible" v-cloak>
 			<div class="ui icon search input">
-				<i class="icon df ac jc m-0">{{svg "octicon-filter" 16}}</i>
+				<i class="icon gt-df gt-ac gt-jc gt-m-0">{{svg "octicon-filter" 16}}</i>
 				<input name="search" ref="searchField" autocomplete="off" v-model="searchTerm" @keydown="keydown($event)" placeholder="{{if $.noTag}}{{.root.locale.Tr "repo.pulls.filter_branch"}}{{else if $showBranchesInDropdown}}{{.root.locale.Tr "repo.filter_branch_and_tag"}}{{else}}{{.root.locale.Tr "repo.find_tag"}}{{end}}...">
 			</div>
 			{{if $showBranchesInDropdown}}
@@ -54,13 +54,13 @@
 						<div class="two column row">
 							<a class="reference column" href="#" @click="createTag = false; mode = 'branches'; focusSearchField()">
 								<span class="text" :class="{black: mode == 'branches'}">
-									{{svg "octicon-git-branch" 16 "mr-2"}}{{.root.locale.Tr "repo.branches"}}
+									{{svg "octicon-git-branch" 16 "gt-mr-2"}}{{.root.locale.Tr "repo.branches"}}
 								</span>
 							</a>
 							{{if not .noTag}}
 								<a class="reference column" href="#" @click="createTag = true; mode = 'tags'; focusSearchField()">
 									<span class="text" :class="{black: mode == 'tags'}">
-										{{svg "octicon-tag" 16 "mr-2"}}{{.root.locale.Tr "repo.tags"}}
+										{{svg "octicon-tag" 16 "gt-mr-2"}}{{.root.locale.Tr "repo.tags"}}
 									</span>
 								</a>
 							{{end}}
diff --git a/templates/repo/clone_buttons.tmpl b/templates/repo/clone_buttons.tmpl
index 7fb435e3c..a10f18b9d 100644
--- a/templates/repo/clone_buttons.tmpl
+++ b/templates/repo/clone_buttons.tmpl
@@ -1,15 +1,15 @@
 <!-- there is always at least one button (by context/repo.go) -->
 {{if $.CloneButtonShowHTTPS}}
-	<button class="ui basic small compact clone button no-transition" id="repo-clone-https" data-link="{{$.CloneButtonOriginLink.HTTPS}}">
+	<button class="ui basic small compact clone button gt-no-transition" id="repo-clone-https" data-link="{{$.CloneButtonOriginLink.HTTPS}}">
 		{{if UseHTTPS}}HTTPS{{else}}HTTP{{end}}
 	</button>
 {{end}}
 {{if $.CloneButtonShowSSH}}
-	<button class="ui basic small compact clone button no-transition" id="repo-clone-ssh" data-link="{{$.CloneButtonOriginLink.SSH}}">
+	<button class="ui basic small compact clone button gt-no-transition" id="repo-clone-ssh" data-link="{{$.CloneButtonOriginLink.SSH}}">
 		SSH
 	</button>
 {{end}}
-<input id="repo-clone-url" size="20" class="js-clone-url br-0" value="{{$.CloneButtonOriginLink.HTTPS}}" readonly>
+<input id="repo-clone-url" size="20" class="js-clone-url gt-br-0" value="{{$.CloneButtonOriginLink.HTTPS}}" readonly>
 <button class="ui basic small compact icon button tooltip" id="clipboard-btn" data-content="{{.locale.Tr "copy_url"}}" data-clipboard-target="#repo-clone-url" aria-label="{{.locale.Tr "copy_url"}}">
 	{{svg "octicon-copy" 14}}
 </button>
diff --git a/templates/repo/commit_page.tmpl b/templates/repo/commit_page.tmpl
index b847a282b..0ecbf2916 100644
--- a/templates/repo/commit_page.tmpl
+++ b/templates/repo/commit_page.tmpl
@@ -1,7 +1,7 @@
 {{template "base/head" .}}
 <div role="main" aria-label="{{.Title}}" class="page-content repository diff">
 	{{template "repo/header" .}}
-	<div class="ui container {{if .IsSplitStyle}}fluid padded{{end}}">
+	<div class="ui container fluid padded">
 		{{$class := ""}}
 		{{if .Commit.Signature}}
 			{{$class = (printf "%s%s" $class " isSigned")}}
@@ -17,9 +17,9 @@
 				{{$class = (printf "%s%s" $class " isWarning")}}
 			{{end}}
 		{{end}}
-		<div class="ui top attached header clearing segment pr commit-header {{$class}}">
-			<div class="df mb-4 fw">
-				<h3 class="mb-0 f1"><span class="commit-summary" title="{{.Commit.Summary}}">{{RenderCommitMessage $.Context .Commit.Message $.RepoLink $.Repository.ComposeMetas}}</span>{{template "repo/commit_statuses" dict "Status" .CommitStatus "Statuses" .CommitStatuses  "root" $}}</h3>
+		<div class="ui top attached header clearing segment gt-pr commit-header {{$class}}">
+			<div class="gt-df gt-mb-4 gt-fw">
+				<h3 class="gt-mb-0 gt-f1"><span class="commit-summary" title="{{.Commit.Summary}}">{{RenderCommitMessage $.Context .Commit.Message $.RepoLink $.Repository.ComposeMetas}}</span>{{template "repo/commit_statuses" dict "Status" .CommitStatus "Statuses" .CommitStatuses  "root" $}}</h3>
 				{{if not $.PageIsWiki}}
 					<div class="ui">
 						<a class="ui primary tiny button" href="{{.SourcePath}}">
@@ -134,41 +134,41 @@
 				{{end}}
 			</div>
 			{{if IsMultilineCommitMessage .Commit.Message}}
-				<pre class="commit-body mt-0">{{RenderCommitBody $.Context .Commit.Message $.RepoLink $.Repository.ComposeMetas}}</pre>
+				<pre class="commit-body gt-mt-0">{{RenderCommitBody $.Context .Commit.Message $.RepoLink $.Repository.ComposeMetas}}</pre>
 			{{end}}
 			{{if .BranchName}}
-				<span class="text grey mr-3">{{svg "octicon-git-branch" 16 "mr-2"}}{{.BranchName}}</span>
+				<span class="text grey gt-mr-3">{{svg "octicon-git-branch" 16 "gt-mr-2"}}{{.BranchName}}</span>
 			{{end}}
 			{{if .TagName}}
-				<span class="text grey mr-3">{{svg "octicon-tag" 16 "mr-2"}}{{.TagName}}</span>
+				<span class="text grey gt-mr-3">{{svg "octicon-tag" 16 "gt-mr-2"}}{{.TagName}}</span>
 			{{end}}
 		</div>
-		<div class="ui attached segment df ac sb py-2 commit-header-row fw {{$class}}">
-				<div class="df ac author">
+		<div class="ui attached segment gt-df gt-ac gt-sb gt-py-2 commit-header-row gt-fw {{$class}}">
+				<div class="gt-df gt-ac author">
 					{{if .Author}}
-						{{avatar .Author 28 "mr-3"}}
+						{{avatar $.Context .Author 28 "gt-mr-3"}}
 						{{if .Author.FullName}}
 							<a href="{{.Author.HomeLink}}"><strong>{{.Author.FullName}}</strong></a>
 						{{else}}
 							<a href="{{.Author.HomeLink}}"><strong>{{.Commit.Author.Name}}</strong></a>
 						{{end}}
 					{{else}}
-						{{avatarByEmail .Commit.Author.Email .Commit.Author.Email 28 "mr-3"}}
+						{{avatarByEmail $.Context .Commit.Author.Email .Commit.Author.Email 28 "gt-mr-3"}}
 						<strong>{{.Commit.Author.Name}}</strong>
 					{{end}}
-					<span class="text grey ml-3" id="authored-time">{{TimeSince .Commit.Author.When $.locale}}</span>
+					<span class="text grey gt-ml-3" id="authored-time">{{TimeSince .Commit.Author.When $.locale}}</span>
 					{{if or (ne .Commit.Committer.Name .Commit.Author.Name) (ne .Commit.Committer.Email .Commit.Author.Email)}}
-						<span class="text grey mx-3">{{.locale.Tr "repo.diff.committed_by"}}</span>
+						<span class="text grey gt-mx-3">{{.locale.Tr "repo.diff.committed_by"}}</span>
 						{{if ne .Verification.CommittingUser.ID 0}}
-							{{avatar .Verification.CommittingUser 28 "mx-3"}}
+							{{avatar $.Context .Verification.CommittingUser 28 "gt-mx-3"}}
 							<a href="{{.Verification.CommittingUser.HomeLink}}"><strong>{{.Commit.Committer.Name}}</strong></a>
 						{{else}}
-							{{avatarByEmail .Commit.Committer.Email .Commit.Committer.Name 28 "mr-3"}}
+							{{avatarByEmail $.Context .Commit.Committer.Email .Commit.Committer.Name 28 "gt-mr-3"}}
 							<strong>{{.Commit.Committer.Name}}</strong>
 						{{end}}
 					{{end}}
 				</div>
-				<div class="ui horizontal list df ac">
+				<div class="ui horizontal list gt-df gt-ac">
 					{{if .Parents}}
 						<div class="item">
 							<span>{{.locale.Tr "repo.diff.parent"}}</span>
@@ -188,73 +188,73 @@
 				</div>
 		</div>
 		{{if .Commit.Signature}}
-			<div class="ui bottom attached message tl df ac sb commit-header-row fw {{$class}}">
-				<div class="df ac">
+			<div class="ui bottom attached message gt-tl gt-df gt-ac gt-sb commit-header-row gt-fw {{$class}}">
+				<div class="gt-df gt-ac">
 					{{if .Verification.Verified}}
 						{{if ne .Verification.SigningUser.ID 0}}
-							{{svg "gitea-lock" 16 "mr-3"}}
+							{{svg "gitea-lock" 16 "gt-mr-3"}}
 							{{if eq .Verification.TrustStatus "trusted"}}
-								<span class="ui text mr-3">{{.locale.Tr "repo.commits.signed_by"}}:</span>
+								<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.signed_by"}}:</span>
 							{{else if eq .Verification.TrustStatus "untrusted"}}
-								<span class="ui text mr-3">{{.locale.Tr "repo.commits.signed_by_untrusted_user"}}:</span>
+								<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.signed_by_untrusted_user"}}:</span>
 							{{else}}
-								<span class="ui text mr-3">{{.locale.Tr "repo.commits.signed_by_untrusted_user_unmatched"}}:</span>
+								<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.signed_by_untrusted_user_unmatched"}}:</span>
 							{{end}}
-							{{avatar .Verification.SigningUser 28 "mr-3"}}
+							{{avatar $.Context .Verification.SigningUser 28 "gt-mr-3"}}
 							<a href="{{.Verification.SigningUser.HomeLink}}"><strong>{{.Verification.SigningUser.GetDisplayName}}</strong></a>
 						{{else}}
-							<span title="{{.locale.Tr "gpg.default_key"}}">{{svg "gitea-lock-cog" 16 "mr-3"}}</span>
-							<span class="ui text mr-3">{{.locale.Tr "repo.commits.signed_by"}}:</span>
-							{{avatarByEmail .Verification.SigningEmail "" 28}}
+							<span title="{{.locale.Tr "gpg.default_key"}}">{{svg "gitea-lock-cog" 16 "gt-mr-3"}}</span>
+							<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.signed_by"}}:</span>
+							{{avatarByEmail $.Context .Verification.SigningEmail "" 28}}
 							<strong>{{.Verification.SigningUser.GetDisplayName}}</strong>
 						{{end}}
 					{{else}}
-						{{svg "gitea-unlock" 16 "mr-3"}}
+						{{svg "gitea-unlock" 16 "gt-mr-3"}}
 						<span class="ui text">{{.locale.Tr .Verification.Reason}}</span>
 					{{end}}
 				</div>
-				<div class="df ac">
+				<div class="gt-df gt-ac">
 					{{if .Verification.Verified}}
 						{{if ne .Verification.SigningUser.ID 0}}
-							{{svg "octicon-shield-check" 16 "mr-3"}}
+							{{svg "octicon-shield-check" 16 "gt-mr-3"}}
 							{{if .Verification.SigningSSHKey}}
-								<span class="ui text mr-3">{{.locale.Tr "repo.commits.ssh_key_fingerprint"}}:</span>
+								<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.ssh_key_fingerprint"}}:</span>
 								{{.Verification.SigningSSHKey.Fingerprint}}
 							{{else}}
-								<span class="ui text mr-3">{{.locale.Tr "repo.commits.gpg_key_id"}}:</span>
+								<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.gpg_key_id"}}:</span>
 								{{.Verification.SigningKey.PaddedKeyID}}
 							{{end}}
 						{{else}}
-							{{svg "octicon-shield-lock" 16 "mr-3"}}
+							{{svg "octicon-shield-lock" 16 "gt-mr-3"}}
 							{{if .Verification.SigningSSHKey}}
-								<span class="ui text mr-3 tooltip" data-content="{{.locale.Tr "gpg.default_key"}}">{{.locale.Tr "repo.commits.ssh_key_fingerprint"}}:</span>
+								<span class="ui text gt-mr-3 tooltip" data-content="{{.locale.Tr "gpg.default_key"}}">{{.locale.Tr "repo.commits.ssh_key_fingerprint"}}:</span>
 								{{.Verification.SigningSSHKey.Fingerprint}}
 							{{else}}
-								<span class="ui text mr-3 tooltip" data-content="{{.locale.Tr "gpg.default_key"}}">{{.locale.Tr "repo.commits.gpg_key_id"}}:</span>
+								<span class="ui text gt-mr-3 tooltip" data-content="{{.locale.Tr "gpg.default_key"}}">{{.locale.Tr "repo.commits.gpg_key_id"}}:</span>
 								{{.Verification.SigningKey.PaddedKeyID}}
 							{{end}}
 						{{end}}
 					{{else if .Verification.Warning}}
-						{{svg "octicon-shield" 16 "mr-3"}}
+						{{svg "octicon-shield" 16 "gt-mr-3"}}
 						{{if .Verification.SigningSSHKey}}
-							<span class="ui text mr-3">{{.locale.Tr "repo.commits.ssh_key_fingerprint"}}:</span>
+							<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.ssh_key_fingerprint"}}:</span>
 							{{.Verification.SigningSSHKey.Fingerprint}}
 						{{else}}
-							<span class="ui text mr-3">{{.locale.Tr "repo.commits.gpg_key_id"}}:</span>
+							<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.gpg_key_id"}}:</span>
 							{{.Verification.SigningKey.PaddedKeyID}}
 						{{end}}
 					{{else}}
 						{{if .Verification.SigningKey}}
 							{{if ne .Verification.SigningKey.KeyID ""}}
-								{{svg "octicon-shield" 16 "mr-3"}}
-								<span class="ui text mr-3">{{.locale.Tr "repo.commits.gpg_key_id"}}:</span>
+								{{svg "octicon-shield" 16 "gt-mr-3"}}
+								<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.gpg_key_id"}}:</span>
 								{{.Verification.SigningKey.PaddedKeyID}}
 							{{end}}
 						{{end}}
 						{{if .Verification.SigningSSHKey}}
 							{{if ne .Verification.SigningSSHKey.Fingerprint ""}}
-								{{svg "octicon-shield" 16 "mr-3"}}
-								<span class="ui text mr-3">{{.locale.Tr "repo.commits.ssh_key_fingerprint"}}:</span>
+								{{svg "octicon-shield" 16 "gt-mr-3"}}
+								<span class="ui text gt-mr-3">{{.locale.Tr "repo.commits.ssh_key_fingerprint"}}:</span>
 								{{.Verification.SigningSSHKey.Fingerprint}}
 							{{end}}
 						{{end}}
@@ -264,7 +264,7 @@
 		{{end}}
 		{{if .Note}}
 			<div class="ui top attached header segment git-notes">
-				{{svg "octicon-note" 16 "mr-3"}}
+				{{svg "octicon-note" 16 "gt-mr-3"}}
 				{{.locale.Tr "repo.diff.git-notes"}}:
 				{{if .NoteAuthor}}
 					<a href="{{.NoteAuthor.HomeLink}}">
diff --git a/templates/repo/commit_statuses.tmpl b/templates/repo/commit_statuses.tmpl
index 4fe644ff0..8250a8581 100644
--- a/templates/repo/commit_statuses.tmpl
+++ b/templates/repo/commit_statuses.tmpl
@@ -1,12 +1,12 @@
-{{if eq (len .Statuses) 1}}{{$status := index .Statuses 0}}{{if $status.TargetURL}}<a class="ui link commit-statuses-trigger vm" href="{{$status.TargetURL}}">{{template "repo/commit_status" .Status}}</a>{{end}}{{end}}
+{{if eq (len .Statuses) 1}}{{$status := index .Statuses 0}}{{if $status.TargetURL}}<a class="ui link commit-statuses-trigger gt-vm" href="{{$status.TargetURL}}">{{template "repo/commit_status" .Status}}</a>{{end}}{{end}}
 <div class="ui commit-statuses-popup commit-statuses tippy-target">
 	<div class="ui relaxed list divided">
 		{{range .Statuses}}
-			<div class="ui item singular-status df">
+			<div class="ui item singular-status gt-df">
 				{{template "repo/commit_status" .}}
-				<span class="ui ml-3 f1">{{.Context}} <span class="text grey">{{.Description}}</span></span>
+				<span class="ui gt-ml-3 gt-f1">{{.Context}} <span class="text grey">{{.Description}}</span></span>
 				{{if .TargetURL}}
-					<a class="ml-3" href="{{.TargetURL}}" target="_blank" rel="noopener noreferrer">{{$.root.locale.Tr "repo.pulls.status_checks_details"}}</a>
+					<a class="gt-ml-3" href="{{.TargetURL}}" target="_blank" rel="noopener noreferrer">{{$.root.locale.Tr "repo.pulls.status_checks_details"}}</a>
 				{{end}}
 			</div>
 		{{end}}
diff --git a/templates/repo/commits.tmpl b/templates/repo/commits.tmpl
index 0188a3928..2f890a1f9 100644
--- a/templates/repo/commits.tmpl
+++ b/templates/repo/commits.tmpl
@@ -3,8 +3,8 @@
 	{{template "repo/header" .}}
 	<div class="ui container">
 		{{template "repo/sub_menu" .}}
-		<div class="repo-button-row df ac sb fw mb-4 mt-3">
-			<div class="df ac">
+		<div class="repo-button-row gt-df gt-ac gt-sb gt-fw gt-mb-4 gt-mt-3">
+			<div class="gt-df gt-ac">
 				{{template "repo/branch_dropdown" dict "root" .}}
 				<a href="{{.RepoLink}}/graph" class="ui basic small compact button">
 					<span class="text">
diff --git a/templates/repo/commits_list.tmpl b/templates/repo/commits_list.tmpl
index 96156caa3..eaf86ab4e 100644
--- a/templates/repo/commits_list.tmpl
+++ b/templates/repo/commits_list.tmpl
@@ -18,14 +18,14 @@
 								{{if .User.FullName}}
 									{{$userName = .User.FullName}}
 								{{end}}
-								{{avatar .User 28 "mr-2"}}<a href="{{.User.HomeLink}}">{{$userName}}</a>
+								{{avatar $.Context .User 28 "gt-mr-2"}}<a href="{{.User.HomeLink}}">{{$userName}}</a>
 							{{else}}
-								{{avatarByEmail .Author.Email .Author.Name 28 "mr-2"}}
+								{{avatarByEmail $.Context .Author.Email .Author.Name 28 "gt-mr-2"}}
 								{{$userName}}
 							{{end}}
 						</td>
-						<td class="sha df">
-							<button class="ui button copy-commit-sha df ac" data-clipboard-text="{{.ID}}">{{svg "octicon-copy" 14}}</button>
+						<td class="sha gt-df">
+							<button class="ui button copy-commit-sha gt-df gt-ac" data-clipboard-text="{{.ID}}">{{svg "octicon-copy" 14}}</button>
 							{{$class := "ui sha label"}}
 							{{if .Signature}}
 								{{$class = (printf "%s%s" $class " isSigned")}}
@@ -72,7 +72,7 @@
 							{{end}}
 							{{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses "root" $}}
 							{{if IsMultilineCommitMessage .Message}}
-							<pre class="commit-body" style="display: none;">{{RenderCommitBody $.Context .Message $commitRepoLink $.Repository.ComposeMetas}}</pre>
+							<pre class="commit-body gt-hidden">{{RenderCommitBody $.Context .Message $commitRepoLink $.Repository.ComposeMetas}}</pre>
 							{{end}}
 						</td>
 						{{if .Committer}}
diff --git a/templates/repo/commits_list_small.tmpl b/templates/repo/commits_list_small.tmpl
index f2f121c42..7c34a8f09 100644
--- a/templates/repo/commits_list_small.tmpl
+++ b/templates/repo/commits_list_small.tmpl
@@ -7,10 +7,10 @@
 		<span class="badge badge-commit">{{svg "octicon-git-commit"}}</span>
 		{{if .User}}
 			<a href="{{.User.HomeLink}}">
-				{{avatar .User}}
+				{{avatar $.root.Context .User}}
 			</a>
 		{{else}}
-			{{avatarByEmail .Author.Email .Author.Name}}
+			{{avatarByEmail $.root.Context .Author.Email .Author.Name}}
 		{{end}}
 
 		<span class="ui float right shabox">
@@ -47,12 +47,12 @@
 		</span>
 
 		{{$commitLink:= printf "%s/commit/%s" $.comment.Issue.PullRequest.BaseRepo.Link (PathEscape .ID.String)}}
-		<span class="mono commit-summary {{if gt .ParentCount 1}} grey text{{end}}" title="{{.Summary}}">{{RenderCommitMessageLinkSubject $.root.Context .Message ($.comment.Issue.PullRequest.BaseRepo.Link|Escape) $commitLink $.comment.Issue.PullRequest.BaseRepo.ComposeMetas}}</span>
+		<span class="gt-mono commit-summary {{if gt .ParentCount 1}} grey text{{end}}" title="{{.Summary}}">{{RenderCommitMessageLinkSubject $.root.Context .Message ($.comment.Issue.PullRequest.BaseRepo.Link|Escape) $commitLink $.comment.Issue.PullRequest.BaseRepo.ComposeMetas}}</span>
 		{{if IsMultilineCommitMessage .Message}}
 			<button class="ui button ellipsis-button" aria-expanded="false">...</button>
 		{{end}}
 		{{if IsMultilineCommitMessage .Message}}
-			<pre class="commit-body" style="display: none;">{{RenderCommitBody $.root.Context .Message ($.comment.Issue.PullRequest.BaseRepo.Link|Escape) $.comment.Issue.PullRequest.BaseRepo.ComposeMetas}}</pre>
+			<pre class="commit-body gt-hidden">{{RenderCommitBody $.root.Context .Message ($.comment.Issue.PullRequest.BaseRepo.Link|Escape) $.comment.Issue.PullRequest.BaseRepo.ComposeMetas}}</pre>
 		{{end}}
 	</div>
 {{end}}
diff --git a/templates/repo/commits_table.tmpl b/templates/repo/commits_table.tmpl
index ab54041b9..03fbbdfdc 100644
--- a/templates/repo/commits_table.tmpl
+++ b/templates/repo/commits_table.tmpl
@@ -1,5 +1,5 @@
-<h4 class="ui top attached header commits-table df ac sb">
-	<div class="commits-table-left df ac">
+<h4 class="ui top attached header commits-table gt-df gt-ac gt-sb">
+	<div class="commits-table-left gt-df gt-ac">
 		{{if or .PageIsCommits (gt .CommitCount 0)}}
 			{{.CommitCount}} {{.locale.Tr "repo.commits.commits"}} {{if .RefName}}({{.RefName}}){{end}}
 		{{else if .IsNothingToCompare}}
@@ -8,7 +8,7 @@
 			{{.locale.Tr "repo.commits.no_commits" $.BaseBranch $.HeadBranch}} {{if .RefName}}({{.RefName}}){{end}}
 		{{end}}
 	</div>
-	<div class="commits-table-right df ac">
+	<div class="commits-table-right gt-df gt-ac">
 		{{if .PageIsCommits}}
 			<form class="ignore-dirty" action="{{.RepoLink}}/commits/{{.BranchNameSubURL}}/search">
 				<div class="ui tiny search input">
@@ -19,7 +19,7 @@
 					<input type="checkbox" name="all" id="all" value="true" {{.All}}>
 					<label for="all">{{.locale.Tr "repo.commits.search_all"}} &nbsp;&nbsp;</label>
 				</div>
-				<button class="ui primary tiny button mr-0 tooltip" data-panel="#add-deploy-key-panel" data-content={{.locale.Tr "repo.commits.search.tooltip"}}>{{.locale.Tr "repo.commits.find"}}</button>
+				<button class="ui primary tiny button gt-mr-0 tooltip" data-panel="#add-deploy-key-panel" data-content={{.locale.Tr "repo.commits.search.tooltip"}}>{{.locale.Tr "repo.commits.find"}}</button>
 			</form>
 		{{else if .IsDiffCompare}}
 			<a href="{{$.CommitRepoLink}}/commit/{{.BeforeCommitID | PathEscape}}" class="ui green sha label">{{if not .BaseIsCommit}}{{if .BaseIsBranch}}{{svg "octicon-git-branch"}}{{else if .BaseIsTag}}{{svg "octicon-tag"}}{{end}}{{.BaseBranch}}{{else}}{{ShortSha .BaseBranch}}{{end}}</a>
diff --git a/templates/repo/create.tmpl b/templates/repo/create.tmpl
index 115d829e4..3887706c2 100644
--- a/templates/repo/create.tmpl
+++ b/templates/repo/create.tmpl
@@ -21,18 +21,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser 28 "mini"}}
+								{{avatar $.Context .ContextUser 28 "mini"}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}">
-									{{avatar .SignedUser 28 "mini"}}
+									{{avatar $.Context .SignedUser 28 "mini"}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 									<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-										{{avatar . 28 "mini"}}
+										{{avatar $.Context . 28 "mini"}}
 										<span class="truncated-item-name">{{.ShortName 40}}</span>
 									</div>
 								{{end}}
@@ -73,37 +73,37 @@
 						</div>
 					</div>
 
-					<div id="template_units" style="display: none;">
+					<div id="template_units" class="gt-hidden">
 						<div class="inline field">
 							<label>{{.locale.Tr "repo.template.items"}}</label>
 							<div class="ui checkbox">
-								<input class="hidden" name="git_content" type="checkbox" tabindex="0" {{if .git_content}}checked{{end}}>
+								<input name="git_content" type="checkbox" tabindex="0" {{if .git_content}}checked{{end}}>
 								<label>{{.locale.Tr "repo.template.git_content"}}</label>
 							</div>
 							<div class="ui checkbox{{if not .SignedUser.CanEditGitHook}} tooltip{{end}}"{{if not .SignedUser.CanEditGitHook}} data-content="{{.locale.Tr "repo.template.git_hooks_tooltip"}}"{{end}}>
-								<input class="hidden" name="git_hooks" type="checkbox" tabindex="0" {{if .git_hooks}}checked{{end}}>
+								<input name="git_hooks" type="checkbox" tabindex="0" {{if .git_hooks}}checked{{end}}>
 								<label>{{.locale.Tr "repo.template.git_hooks"}}</label>
 							</div>
 						</div>
 						<div class="inline field">
 							<label></label>
 							<div class="ui checkbox">
-								<input class="hidden" name="webhooks" type="checkbox" tabindex="0" {{if .webhooks}}checked{{end}}>
+								<input name="webhooks" type="checkbox" tabindex="0" {{if .webhooks}}checked{{end}}>
 								<label>{{.locale.Tr "repo.template.webhooks"}}</label>
 							</div>
 							<div class="ui checkbox">
-								<input class="hidden" name="topics" type="checkbox" tabindex="0" {{if .topics}}checked{{end}}>
+								<input name="topics" type="checkbox" tabindex="0" {{if .topics}}checked{{end}}>
 								<label>{{.locale.Tr "repo.template.topics"}}</label>
 							</div>
 						</div>
 						<div class="inline field">
 							<label></label>
 							<div class="ui checkbox">
-								<input class="hidden" name="avatar" type="checkbox" tabindex="0" {{if .avatar}}checked{{end}}>
+								<input name="avatar" type="checkbox" tabindex="0" {{if .avatar}}checked{{end}}>
 								<label>{{.locale.Tr "repo.template.avatar"}}</label>
 							</div>
 							<div class="ui checkbox">
-								<input class="hidden" name="labels" type="checkbox" tabindex="0" {{if .labels}}checked{{end}}>
+								<input name="labels" type="checkbox" tabindex="0" {{if .labels}}checked{{end}}>
 								<label>{{.locale.Tr "repo.template.issue_labels"}}</label>
 							</div>
 						</div>
@@ -169,7 +169,7 @@
 						</div>
 						<div class="inline field">
 							<div class="ui checkbox" id="auto-init">
-								<input class="hidden" name="auto_init" type="checkbox" tabindex="0" {{if .auto_init}}checked{{end}}>
+								<input name="auto_init" type="checkbox" tabindex="0" {{if .auto_init}}checked{{end}}>
 								<label>{{.locale.Tr "repo.auto_init"}}</label>
 							</div>
 						</div>
@@ -204,7 +204,7 @@
 						<div class="inline field">
 							<label>{{.locale.Tr "repo.template"}}</label>
 							<div class="ui checkbox">
-								<input class="hidden" name="template" type="checkbox" tabindex="0">
+								<input name="template" type="checkbox" tabindex="0">
 								<label>{{.locale.Tr "repo.template_helper"}}</label>
 							</div>
 						</div>
diff --git a/templates/repo/diff/blob_excerpt.tmpl b/templates/repo/diff/blob_excerpt.tmpl
index 402435c46..f4f7732c5 100644
--- a/templates/repo/diff/blob_excerpt.tmpl
+++ b/templates/repo/diff/blob_excerpt.tmpl
@@ -25,7 +25,7 @@
 			{{$inlineDiff := $.section.GetComputedInlineDiffFor $line $.locale}}
 			<td class="lines-num lines-num-old" data-line-num="{{if $line.LeftIdx}}{{$line.LeftIdx}}{{end}}"><span rel="{{if $line.LeftIdx}}diff-{{$.FileNameHash}}L{{$line.LeftIdx}}{{end}}"></span></td>
 			<td class="blob-excerpt lines-escape lines-escape-old">{{if and $line.LeftIdx $inlineDiff.EscapeStatus.Escaped}}<a href="" class="toggle-escape-button" title="{{template "repo/diff/escape_title" dict "diff" $inlineDiff "locale" $.locale}}"></a>{{end}}</td>
-			<td class="blob-excerpt lines-type-marker lines-type-marker-old">{{if $line.LeftIdx}}<span class="mono" data-type-marker=""></span>{{end}}</td>
+			<td class="blob-excerpt lines-type-marker lines-type-marker-old">{{if $line.LeftIdx}}<span class="gt-mono" data-type-marker=""></span>{{end}}</td>
 			<td class="blob-excerpt lines-code lines-code-old halfwidth">{{/*
 				*/}}{{if $line.LeftIdx}}{{template "repo/diff/section_code" dict "diff" $inlineDiff "locale" $.locale}}{{else}}{{/*
 					*/}}<code class="code-inner"></code>{{/*
@@ -33,7 +33,7 @@
 			*/}}</td>
 			<td class="lines-num lines-num-new" data-line-num="{{if $line.RightIdx}}{{$line.RightIdx}}{{end}}"><span rel="{{if $line.RightIdx}}diff-{{$.FileNameHash}}R{{$line.RightIdx}}{{end}}"></span></td>
 			<td class="blob-excerpt lines-escape lines-escape-new">{{if and $line.RightIdx $inlineDiff.EscapeStatus.Escaped}}<a href="" class="toggle-escape-button" title="{{template "repo/diff/escape_title" dict "diff" $inlineDiff "locale" $.locale}}"></a>{{end}}</td>
-			<td class="blob-excerpt lines-type-marker lines-type-marker-new">{{if $line.RightIdx}}<span class="mono" data-type-marker=""></span>{{end}}</td>
+			<td class="blob-excerpt lines-type-marker lines-type-marker-new">{{if $line.RightIdx}}<span class="gt-mono" data-type-marker=""></span>{{end}}</td>
 			<td class="blob-excerpt lines-code lines-code-new halfwidth">{{/*
 				*/}}{{if $line.RightIdx}}{{template "repo/diff/section_code" dict "diff" $inlineDiff "locale" $.locale}}{{else}}{{/*
 					*/}}<code class="code-inner"></code>{{/*
@@ -69,7 +69,7 @@
 		{{end}}
 		{{$inlineDiff := $.section.GetComputedInlineDiffFor $line $.locale}}
 		<td class="blob-excerpt lines-escape">{{if $inlineDiff.EscapeStatus.Escaped}}<a href="" class="toggle-escape-button" title="{{template "repo/diff/escape_title" dict "diff" $inlineDiff "locale" $.locale}}"></a>{{end}}</td>
-		<td class="blob-excerpt lines-type-marker"><span class="mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span></td>
+		<td class="blob-excerpt lines-type-marker"><span class="gt-mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span></td>
 		<td class="blob-excerpt lines-code{{if (not $line.RightIdx)}} lines-code-old{{end}}"><code {{if $inlineDiff.EscapeStatus.Escaped}}class="code-inner has-escaped" title="{{template "repo/diff/escape_title" dict "diff" $inlineDiff "locale" $.locale}}"{{else}}class="code-inner"{{end}}>{{$inlineDiff.Content}}</code></td>
 	</tr>
 	{{end}}
diff --git a/templates/repo/diff/box.tmpl b/templates/repo/diff/box.tmpl
index 4bc211f93..1e7982435 100644
--- a/templates/repo/diff/box.tmpl
+++ b/templates/repo/diff/box.tmpl
@@ -13,21 +13,21 @@
 	<h4>{{.locale.Tr "repo.diff.data_not_available"}}</h4>
 {{else}}
 	<div>
-		<div class="diff-detail-box diff-box sticky df sb ac fw">
-			<div class="df ac fw">
-				<a class="diff-toggle-file-tree-button muted df ac">
+		<div class="diff-detail-box diff-box sticky gt-df gt-sb gt-ac gt-fw">
+			<div class="gt-df gt-ac gt-fw">
+				<a class="diff-toggle-file-tree-button muted gt-df gt-ac">
 					{{/* the icon meaning is reversed here, "octicon-sidebar-collapse" means show the file tree */}}
 					{{svg "octicon-sidebar-collapse" 20 "icon hide"}}
 					{{svg "octicon-sidebar-expand" 20 "icon"}}
 				</a>
-				<div class="diff-detail-stats df ac ml-3">
-					{{svg "octicon-diff" 16 "mr-2"}}{{.locale.Tr "repo.diff.stats_desc" .Diff.NumFiles .Diff.TotalAddition .Diff.TotalDeletion | Str2html}}
+				<div class="diff-detail-stats gt-df gt-ac gt-ml-3">
+					{{svg "octicon-diff" 16 "gt-mr-2"}}{{.locale.Tr "repo.diff.stats_desc" .Diff.NumFiles .Diff.TotalAddition .Diff.TotalDeletion | Str2html}}
 				</div>
 			</div>
-			<div class="diff-detail-actions df ac">
+			<div class="diff-detail-actions gt-df gt-ac">
 				{{if and .PageIsPullFiles $.SignedUserID (not .IsArchived)}}
-					<progress id="viewed-files-summary" class="mr-2" value="{{.Diff.NumViewedFiles}}" max="{{.Diff.NumFiles}}"></progress>
-					<label for="viewed-files-summary" id="viewed-files-summary-label" class="mr-3" data-text-changed-template="{{.locale.Tr "repo.pulls.viewed_files_label"}}">
+					<progress id="viewed-files-summary" class="gt-mr-2" value="{{.Diff.NumViewedFiles}}" max="{{.Diff.NumFiles}}"></progress>
+					<label for="viewed-files-summary" id="viewed-files-summary-label" class="gt-mr-3" data-text-changed-template="{{.locale.Tr "repo.pulls.viewed_files_label"}}">
 						{{.locale.Tr "repo.pulls.viewed_files_label" .Diff.NumViewedFiles .Diff.NumFiles}}
 					</label>
 				{{end}}
@@ -67,44 +67,44 @@
 				</script>
 		<div id="diff-file-list"></div>
 		<div id="diff-container">
-				<div id="diff-file-tree" class="hide"></div>
+				<div id="diff-file-tree" class="gt-hidden"></div>
 				<div id="diff-file-boxes" class="sixteen wide column">
 					{{range $i, $file := .Diff.Files}}
 						{{/*notice: the index of Diff.Files should not be used for element ID, because the index will be restarted from 0 when doing load-more for PRs with a lot of files*/}}
-						{{$blobBase := call $.GetBlobByPathForCommit $.BaseCommit $file.OldName}}
+						{{$blobBase := call $.GetBlobByPathForCommit $.BeforeCommit $file.OldName}}
 						{{$blobHead := call $.GetBlobByPathForCommit $.HeadCommit $file.Name}}
 						{{$isImage := or (call $.IsBlobAnImage $blobBase) (call $.IsBlobAnImage $blobHead)}}
 						{{$isCsv := (call $.IsCsvFile $file)}}
 						{{$showFileViewToggle := or $isImage (and (not $file.IsIncomplete) $isCsv)}}
 						{{$isExpandable := or (gt $file.Addition 0) (gt $file.Deletion 0) $file.IsBin}}
-						<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}} mt-3" id="diff-{{$file.NameHash}}" data-old-filename="{{$file.OldName}}" data-new-filename="{{$file.Name}}" {{if or ($file.ShouldBeHidden) (not $isExpandable)}}data-folded="true"{{end}}>
-							<h4 class="diff-file-header sticky-2nd-row ui top attached normal header df ac sb">
-								<div class="df ac">
-									<a role="button" class="fold-file muted mr-2" {{if not $isExpandable}}style="visibility: hidden"{{end}}>
+						<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}} gt-mt-3" id="diff-{{$file.NameHash}}" data-old-filename="{{$file.OldName}}" data-new-filename="{{$file.Name}}" {{if or ($file.ShouldBeHidden) (not $isExpandable)}}data-folded="true"{{end}}>
+							<h4 class="diff-file-header sticky-2nd-row ui top attached normal header gt-df gt-ac gt-sb">
+								<div class="gt-df gt-ac">
+									<a role="button" class="fold-file muted gt-mr-2" {{if not $isExpandable}}style="visibility: hidden"{{end}}>
 										{{if $file.ShouldBeHidden}}
 											{{svg "octicon-chevron-right" 18}}
 										{{else}}
 											{{svg "octicon-chevron-down" 18}}
 										{{end}}
 									</a>
-									<div class="bold df ac mono">
+									<div class="gt-bold gt-df gt-ac gt-mono">
 										{{if $file.IsBin}}
-											<span class="ml-1 mr-3">
+											<span class="gt-ml-1 gt-mr-3">
 												{{$.locale.Tr "repo.diff.bin"}}
 											</span>
 										{{else}}
 											{{template "repo/diff/stats" dict "file" . "root" $}}
 										{{end}}
 									</div>
-									<span class="file mono"><a class="muted" href="#diff-{{$file.NameHash}}">{{if $file.IsRenamed}}{{$file.OldName}} &rarr; {{end}}{{$file.Name}}</a>{{if .IsLFSFile}} ({{$.locale.Tr "repo.stored_lfs"}}){{end}}</span>
+									<span class="file gt-mono"><a class="muted" href="#diff-{{$file.NameHash}}">{{if $file.IsRenamed}}{{$file.OldName}} &rarr; {{end}}{{$file.Name}}</a>{{if .IsLFSFile}} ({{$.locale.Tr "repo.stored_lfs"}}){{end}}</span>
 									{{if $file.IsGenerated}}
-										<span class="ui label ml-3">{{$.locale.Tr "repo.diff.generated"}}</span>
+										<span class="ui label gt-ml-3">{{$.locale.Tr "repo.diff.generated"}}</span>
 									{{end}}
 									{{if $file.IsVendored}}
-										<span class="ui label ml-3">{{$.locale.Tr "repo.diff.vendored"}}</span>
+										<span class="ui label gt-ml-3">{{$.locale.Tr "repo.diff.vendored"}}</span>
 									{{end}}
 								</div>
-								<div class="diff-file-header-actions df ac">
+								<div class="diff-file-header-actions gt-df gt-ac">
 									{{if $showFileViewToggle}}
 										<div class="ui compact icon buttons">
 											<span class="ui tiny basic button tooltip file-view-toggle" data-toggle-selector="#diff-source-{{$file.NameHash}}" data-content="{{$.locale.Tr "repo.file_view_source"}}" data-position="bottom center">{{svg "octicon-code"}}</span>
@@ -116,7 +116,7 @@
 									{{end}}
 									{{if not (or $file.IsIncomplete $file.IsBin $file.IsSubmodule)}}
 										<a class="ui basic tiny button unescape-button">{{$.locale.Tr "repo.unescape_control_characters"}}</a>
-										<a class="ui basic tiny button escape-button" style="display: none;">{{$.locale.Tr "repo.escape_control_characters"}}</a>
+										<a class="ui basic tiny button escape-button gt-hidden">{{$.locale.Tr "repo.escape_control_characters"}}</a>
 									{{end}}
 									{{if and (not $file.IsSubmodule) (not $.PageIsWiki)}}
 										{{if $file.IsDeleted}}
@@ -136,7 +136,7 @@
 								</div>
 							</h4>
 							<div class="diff-file-body ui attached unstackable table segment" {{if $file.IsViewed}}data-folded="true"{{end}}>
-								<div id="diff-source-{{$file.NameHash}}" class="file-body file-code unicode-escaped code-diff{{if $.IsSplitStyle}} code-diff-split{{else}} code-diff-unified{{end}}{{if $showFileViewToggle}} hide{{end}}">
+								<div id="diff-source-{{$file.NameHash}}" class="file-body file-code unicode-escaped code-diff{{if $.IsSplitStyle}} code-diff-split{{else}} code-diff-unified{{end}}{{if $showFileViewToggle}} gt-hidden{{end}}">
 									{{if or $file.IsIncomplete $file.IsBin}}
 										<div class="diff-file-body binary" style="padding: 5px 10px;">
 											{{if $file.IsIncomplete}}
@@ -162,7 +162,7 @@
 								</div>
 								{{if $showFileViewToggle}}
 									<div id="diff-rendered-{{$file.NameHash}}" class="file-body file-code {{if $.IsSplitStyle}} code-diff-split{{else}} code-diff-unified{{end}}">
-										<table class="chroma w-100">
+										<table class="chroma gt-w-100">
 											{{if $isImage}}
 												{{template "repo/diff/image_diff" dict "file" . "root" $ "blobBase" $blobBase "blobHead" $blobHead}}
 											{{else}}
@@ -176,8 +176,8 @@
 					{{end}}
 
 					{{if .Diff.IsIncomplete}}
-						<div class="diff-file-box diff-box file-content mt-3" id="diff-incomplete">
-							<h4 class="ui top attached normal header df ac sb">
+						<div class="diff-file-box diff-box file-content gt-mt-3" id="diff-incomplete">
+							<h4 class="ui top attached normal header gt-df gt-ac gt-sb">
 								{{$.locale.Tr "repo.diff.too_many_files"}}
 								<a class="ui basic tiny button" id="diff-show-more-files" data-href="{{$.Link}}?skip-to={{.Diff.End}}&file-only=true">{{.locale.Tr "repo.diff.show_more"}}</a>
 							</h4>
@@ -187,7 +187,7 @@
 		</div>
 
 		{{if not $.Repository.IsArchived}}
-			<div class="hide" id="edit-content-form">
+			<div class="gt-hidden" id="edit-content-form">
 				<div class="ui comment form">
 					<div class="ui top attached tabular menu">
 						<a class="active write item">{{$.locale.Tr "write"}}</a>
diff --git a/templates/repo/diff/comment_form.tmpl b/templates/repo/diff/comment_form.tmpl
index f51e84072..407f84e5c 100644
--- a/templates/repo/diff/comment_form.tmpl
+++ b/templates/repo/diff/comment_form.tmpl
@@ -1,5 +1,5 @@
 {{if and $.root.SignedUserID (not $.Repository.IsArchived)}}
-	<form class="ui form {{if $.hidden}}hide comment-form comment-form-reply{{end}}" action="{{$.root.Issue.Link}}/files/reviews/comments" method="post">
+	<form class="ui form {{if $.hidden}}gt-hidden comment-form comment-form-reply{{end}}" action="{{$.root.Issue.Link}}/files/reviews/comments" method="post">
 	{{$.root.CsrfTokenHtml}}
 		<input type="hidden" name="origin" value="{{if $.root.PageIsPullFiles}}diff{{else}}timeline{{end}}">
 		<input type="hidden" name="latest_commit_id" value="{{$.root.AfterCommitID}}"/>
@@ -21,7 +21,7 @@
 			{{.locale.Tr "loading"}}
 			</div>
 		</div>
-		<div class="field footer mx-3">
+		<div class="field footer gt-mx-3">
 			<span class="markup-info">{{svg "octicon-markup"}} {{$.root.locale.Tr "repo.diff.comment.markdown_info"}}</span>
 			<div class="ui right">
 				{{if $.reply}}
diff --git a/templates/repo/diff/comments.tmpl b/templates/repo/diff/comments.tmpl
index 8fc51e62f..985ad0655 100644
--- a/templates/repo/diff/comments.tmpl
+++ b/templates/repo/diff/comments.tmpl
@@ -5,13 +5,13 @@
 	{{if .OriginalAuthor}}
 		<span class="avatar"><img src="{{AppSubUrl}}/assets/img/avatar_default.png"></span>
 	{{else}}
-		{{template "shared/user/avatarlink" .Poster}}
+		{{template "shared/user/avatarlink" Dict "Context" $.root.Context "user" .Poster}}
 	{{end}}
 	<div class="content comment-container">
-		<div class="ui top attached header comment-header df ac sb">
-			<div class="comment-header-left df ac">
+		<div class="ui top attached header comment-header gt-df gt-ac gt-sb">
+			<div class="comment-header-left gt-df gt-ac">
 				{{if .OriginalAuthor}}
-					<span class="text black bold mr-2">
+					<span class="text black gt-bold gt-mr-2">
 						{{svg (MigrationIcon $.root.Repository.GetOriginalURLHostname)}}
 						{{.OriginalAuthor}}
 					</span>
@@ -30,7 +30,7 @@
 					</span>
 				{{end}}
 			</div>
-			<div class="comment-header-right actions df ac">
+			<div class="comment-header-right actions gt-df gt-ac">
 				{{if and .Review}}
 					{{if eq .Review.Type 0}}
 						<div class="ui label basic small yellow pending-label tooltip" data-content="{{$.root.locale.Tr "repo.issues.review.pending.tooltip" ($.root.locale.Tr "repo.diff.review") ($.root.locale.Tr "repo.diff.review.approve") ($.root.locale.Tr "repo.diff.review.comment") ($.root.locale.Tr "repo.diff.review.reject")}}">
@@ -54,8 +54,8 @@
 				<span class="no-content">{{$.root.locale.Tr "repo.issues.no_content"}}</span>
 			{{end}}
 			</div>
-			<div id="issuecomment-{{.ID}}-raw" class="raw-content hide">{{.Content}}</div>
-			<div class="edit-content-zone hide" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.root.RepoLink}}/comments/{{.ID}}" data-context="{{$.root.RepoLink}}"></div>
+			<div id="issuecomment-{{.ID}}-raw" class="raw-content gt-hidden">{{.Content}}</div>
+			<div class="edit-content-zone gt-hidden" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.root.RepoLink}}/comments/{{.ID}}" data-context="{{$.root.RepoLink}}"></div>
 		</div>
 		{{$reactions := .Reactions.GroupByType}}
 		{{if $reactions}}
diff --git a/templates/repo/diff/compare.tmpl b/templates/repo/diff/compare.tmpl
index 1010863b7..c7538a796 100644
--- a/templates/repo/diff/compare.tmpl
+++ b/templates/repo/diff/compare.tmpl
@@ -1,7 +1,7 @@
 {{template "base/head" .}}
 <div role="main" aria-label="{{.Title}}" class="page-content repository diff {{if .PageIsComparePull}}compare pull{{end}}">
 	{{template "repo/header" .}}
-	<div class="ui container {{if .IsSplitStyle}}fluid padded{{end}}">
+	<div class="ui container fluid padded">
 
 	<h2 class="ui header">
 		{{if and $.PageIsComparePull $.IsSigned (not .Repository.IsArchived)}}
@@ -49,7 +49,7 @@
 			</div>
 			<div class="menu">
 				<div class="ui icon search input">
-					<i class="icon df ac jc m-0">{{svg "octicon-filter" 16}}</i>
+					<i class="icon gt-df gt-ac gt-jc gt-m-0">{{svg "octicon-filter" 16}}</i>
 					<input name="search" placeholder="{{.locale.Tr "repo.filter_branch_and_tag"}}...">
 				</div>
 				<div class="header">
@@ -57,12 +57,12 @@
 						<div class="two column row">
 							<a class="reference column" href="#" data-target=".base-branch-list">
 								<span class="text black">
-									{{svg "octicon-git-branch" 16 "mr-2"}}{{.locale.Tr "repo.branches"}}
+									{{svg "octicon-git-branch" 16 "gt-mr-2"}}{{.locale.Tr "repo.branches"}}
 								</span>
 							</a>
 							<a class="reference column" href="#" data-target=".base-tag-list">
 								<span class="text black">
-									{{svg "octicon-tag" 16 "mr-2"}}{{.locale.Tr "repo.tags"}}
+									{{svg "octicon-tag" 16 "gt-mr-2"}}{{.locale.Tr "repo.tags"}}
 								</span>
 							</a>
 						</div>
@@ -88,7 +88,7 @@
 						{{end}}
 					{{end}}
 				</div>
-				<div class="scrolling menu reference-list-menu base-tag-list" style="display: none">
+				<div class="scrolling menu reference-list-menu base-tag-list gt-hidden">
 					{{range .Tags}}
 						<div class="item {{if eq $.BaseBranch .}}selected{{end}}" data-url="{{$.RepoLink}}/compare/{{PathEscapeSegments .}}{{$.CompareSeparator}}{{if not $.PullRequestCtx.SameRepo}}{{PathEscape $.HeadUser.Name}}/{{PathEscape $.HeadRepo.Name}}:{{end}}{{PathEscapeSegments $.HeadBranch}}">{{$BaseCompareName}}:{{.}}</div>
 					{{end}}
@@ -118,7 +118,7 @@
 			</div>
 			<div class="menu">
 				<div class="ui icon search input">
-					<i class="icon df ac jc m-0">{{svg "octicon-filter" 16}}</i>
+					<i class="icon gt-df gt-ac gt-jc gt-m-0">{{svg "octicon-filter" 16}}</i>
 					<input name="search" placeholder="{{.locale.Tr "repo.filter_branch_and_tag"}}...">
 				</div>
 				<div class="header">
@@ -126,12 +126,12 @@
 						<div class="two column row">
 							<a class="reference column" href="#" data-target=".head-branch-list">
 								<span class="text black">
-									{{svg "octicon-git-branch" 16 "mr-2"}}{{.locale.Tr "repo.branches"}}
+									{{svg "octicon-git-branch" 16 "gt-mr-2"}}{{.locale.Tr "repo.branches"}}
 								</span>
 							</a>
 							<a class="reference column" href="#" data-target=".head-tag-list">
 								<span class="text black">
-									{{svg "octicon-tag" 16 "mr-2"}}{{.locale.Tr "repo.tags"}}
+									{{svg "octicon-tag" 16 "gt-mr-2"}}{{.locale.Tr "repo.tags"}}
 								</span>
 							</a>
 						</div>
@@ -157,7 +157,7 @@
 						{{end}}
 					{{end}}
 				</div>
-				<div class="scrolling menu reference-list-menu head-tag-list" style="display: none">
+				<div class="scrolling menu reference-list-menu head-tag-list gt-hidden">
 					{{range .HeadTags}}
 						<div class="{{if eq $.HeadBranch .}}selected{{end}} item" data-url="{{$.RepoLink}}/compare/{{PathEscapeSegments $.BaseBranch}}{{$.CompareSeparator}}{{if not $.PullRequestCtx.SameRepo}}{{PathEscape $.HeadUser.Name}}/{{PathEscape $.HeadRepo.Name}}:{{end}}{{PathEscapeSegments .}}">{{$HeadCompareName}}:{{.}}</div>
 					{{end}}
@@ -184,10 +184,10 @@
 	{{if .IsNothingToCompare}}
 		{{if and $.IsSigned $.AllowEmptyPr (not .Repository.IsArchived)}}
 			<div class="ui segment">{{.locale.Tr "repo.pulls.nothing_to_compare_and_allow_empty_pr"}}</div>
-			<div class="ui info message show-form-container" {{if .Flash}}style="display: none"{{end}}>
+			<div class="ui info message show-form-container {{if .Flash}}gt-hidden{{end}}">
 				<button class="ui button green show-form">{{.locale.Tr "repo.pulls.new"}}</button>
 			</div>
-			<div class="pullrequest-form" {{if not .Flash}}style="display: none"{{end}}>
+			<div class="pullrequest-form {{if not .Flash}}gt-hidden{{end}}">
 				{{template "repo/issue/new_form" .}}
 			</div>
 		{{else}}
@@ -214,7 +214,7 @@
 			</div>
 		{{else}}
 			{{if and $.IsSigned (not .Repository.IsArchived)}}
-				<div class="ui info message show-form-container" {{if .Flash}}style="display: none"{{end}}>
+				<div class="ui info message show-form-container {{if .Flash}}gt-hidden{{end}}">
 					<button class="ui button green show-form">{{.locale.Tr "repo.pulls.new"}}</button>
 				</div>
 			{{else if .Repository.IsArchived}}
@@ -223,7 +223,7 @@
 				</div>
 			{{end}}
 			{{if $.IsSigned}}
-				<div class="pullrequest-form" {{if not .Flash}}style="display: none"{{end}}>
+				<div class="pullrequest-form {{if not .Flash}}gt-hidden{{end}}">
 					{{template "repo/issue/new_form" .}}
 				</div>
 			{{end}}
diff --git a/templates/repo/diff/conversation.tmpl b/templates/repo/diff/conversation.tmpl
index 204a2146f..999197f94 100644
--- a/templates/repo/diff/conversation.tmpl
+++ b/templates/repo/diff/conversation.tmpl
@@ -3,31 +3,31 @@
 {{$isNotPending := (not (eq (index .comments 0).Review.Type 0))}}
 <div class="conversation-holder" data-path="{{(index .comments 0).TreePath}}" data-side="{{if lt (index .comments 0).Line 0}}left{{else}}right{{end}}" data-idx="{{(index .comments 0).UnsignedLine}}">
 	{{if $resolved}}
-		<div class="ui attached header resolved-placeholder df ac sb">
+		<div class="ui attached header resolved-placeholder gt-df gt-ac gt-sb">
 			<div class="ui grey text">
-				{{svg "octicon-check" 16 "icon mr-2"}}
+				{{svg "octicon-check" 16 "icon gt-mr-2"}}
 				<b>{{$resolveDoer.Name}}</b> {{$.locale.Tr "repo.issues.review.resolved_by"}}
 			</div>
 			<div>
-				<button id="show-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="ui tiny right labeled button show-outdated df ac">
-					{{svg "octicon-unfold" 16 "mr-3"}}
+				<button id="show-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="ui tiny right labeled button show-outdated gt-df gt-ac">
+					{{svg "octicon-unfold" 16 "gt-mr-3"}}
 					{{$.locale.Tr "repo.issues.review.show_resolved"}}
 				</button>
-				<button id="hide-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="hide ui tiny right labeled button hide-outdated df ac">
-					{{svg "octicon-fold" 16 "mr-3"}}
+				<button id="hide-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="ui tiny right labeled button hide-outdated gt-df gt-ac gt-hidden">
+					{{svg "octicon-fold" 16 "gt-mr-3"}}
 					{{$.locale.Tr "repo.issues.review.hide_resolved"}}
 				</button>
 			</div>
 		</div>
 	{{end}}
-	<div id="code-comments-{{(index  .comments 0).ID}}" class="field comment-code-cloud {{if $resolved}}hide{{end}}">
+	<div id="code-comments-{{(index  .comments 0).ID}}" class="field comment-code-cloud {{if $resolved}}gt-hidden{{end}}">
 		<div class="comment-list">
 			<ui class="ui comments">
 				{{template "repo/diff/comments" dict "root" $ "comments" .comments}}
 			</ui>
 		</div>
-		<div class="df je js-small ac fw mt-3">
-			<div class="ui buttons mr-2">
+		<div class="gt-df gt-je gt-js-small gt-ac gt-fw gt-mt-3">
+			<div class="ui buttons gt-mr-2">
 				<button class="ui icon tiny basic button previous-conversation">
 					{{svg "octicon-arrow-up" 12 "icon"}} {{$.locale.Tr "repo.issues.previous"}}
 				</button>
@@ -45,8 +45,8 @@
 				</button>
 			{{end}}
 			{{if and $.SignedUserID (not $.Repository.IsArchived)}}
-				<button class="comment-form-reply ui green tiny labeled icon button ml-2 mr-0">
-					{{svg "octicon-reply" 16 "reply icon mr-2"}}{{$.locale.Tr "repo.diff.comment.reply"}}
+				<button class="comment-form-reply ui green tiny labeled icon button gt-ml-2 gt-mr-0">
+					{{svg "octicon-reply" 16 "reply icon gt-mr-2"}}{{$.locale.Tr "repo.diff.comment.reply"}}
 				</button>
 			{{end}}
 		</div>
diff --git a/templates/repo/diff/image_diff.tmpl b/templates/repo/diff/image_diff.tmpl
index 4b95c8d85..2d4a73175 100644
--- a/templates/repo/diff/image_diff.tmpl
+++ b/templates/repo/diff/image_diff.tmpl
@@ -11,7 +11,7 @@
 					{{end}}
 				</div>
 			</div>
-			<div class="hide">
+			<div class="gt-hidden">
 				<div class="ui bottom attached tab image-diff-container active" data-tab="diff-side-by-side-{{.file.Index}}">
 					<div class="diff-side-by-side">
 						{{if .blobBase}}
@@ -74,7 +74,7 @@
 				</div>
 				{{end}}
 			</div>
-			<div class="ui active centered inline loader mb-4"></div>
+			<div class="ui active centered inline loader gt-mb-4"></div>
 		</div>
 	</td>
 </tr>
diff --git a/templates/repo/diff/new_review.tmpl b/templates/repo/diff/new_review.tmpl
index 60ebb61fb..8586cd6a5 100644
--- a/templates/repo/diff/new_review.tmpl
+++ b/templates/repo/diff/new_review.tmpl
@@ -1,5 +1,5 @@
 <div class="ui top right pointing dropdown custom" id="review-box">
-	<div class="ui tiny green button btn-review ml-2 mr-0">
+	<div class="ui tiny green button btn-review gt-ml-2 gt-mr-0">
 		{{.locale.Tr "repo.diff.review"}}
 		<span class="ui small label review-comments-counter" data-pending-comment-number="{{.PendingCodeCommentNumber}}">{{.PendingCodeCommentNumber}}</span>
 		{{svg "octicon-triangle-down" 14 "dropdown icon"}}
@@ -9,9 +9,9 @@
 			<form class="ui form" action="{{.Link}}/reviews/submit" method="post">
 			{{.CsrfTokenHtml}}
 				<input type="hidden" name="commit_id" value="{{.AfterCommitID}}"/>
-				<div class="header df ac pb-3">
-					<div class="f1">{{$.locale.Tr "repo.diff.review.header"}}</div>
-					<a class="muted close px-3">{{svg "octicon-x" 16}}</a>
+				<div class="header gt-df gt-ac gt-pb-3">
+					<div class="gt-f1">{{$.locale.Tr "repo.diff.review.header"}}</div>
+					<a class="muted close gt-px-3">{{svg "octicon-x" 16}}</a>
 				</div>
 				<div class="ui field">
 					<textarea name="content" tabindex="0" rows="2" placeholder="{{$.locale.Tr "repo.diff.review.placeholder"}}"></textarea>
diff --git a/templates/repo/diff/section_split.tmpl b/templates/repo/diff/section_split.tmpl
index 24302e536..c4b5ad042 100644
--- a/templates/repo/diff/section_split.tmpl
+++ b/templates/repo/diff/section_split.tmpl
@@ -32,7 +32,7 @@
 					{{- $rightDiff := ""}}{{if $match.RightIdx}}{{$rightDiff = $section.GetComputedInlineDiffFor $match $.root.locale}}{{end}}
 					<td class="lines-num lines-num-old del-code" data-line-num="{{$line.LeftIdx}}"><span rel="diff-{{$file.NameHash}}L{{$line.LeftIdx}}"></span></td>
 					<td class="lines-escape del-code lines-escape-old">{{if $line.LeftIdx}}{{if $leftDiff.EscapeStatus.Escaped}}<a href="" class="toggle-escape-button" title="{{template "repo/diff/escape_title" dict "diff" $leftDiff "locale" $.root.locale}}"></a>{{end}}{{end}}</td>
-					<td class="lines-type-marker lines-type-marker-old del-code"><span class="mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span></td>
+					<td class="lines-type-marker lines-type-marker-old del-code"><span class="gt-mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span></td>
 					<td class="lines-code lines-code-old halfwidth del-code">{{/*
 						*/}}{{if and $.root.SignedUserID $.root.PageIsPullFiles}}{{/*
 							*/}}<a class="ui primary button add-code-comment add-code-comment-left{{if (not $line.CanComment)}} invisible{{end}}" data-side="left" data-idx="{{$line.LeftIdx}}">{{/*
@@ -47,7 +47,7 @@
 					*/}}</td>
 					<td class="lines-num lines-num-new add-code" data-line-num="{{if $match.RightIdx}}{{$match.RightIdx}}{{end}}"><span rel="{{if $match.RightIdx}}diff-{{$file.NameHash}}R{{$match.RightIdx}}{{end}}"></span></td>
 					<td class="lines-escape add-code lines-escape-new">{{if $match.RightIdx}}{{if $rightDiff.EscapeStatus.Escaped}}<a href="" class="toggle-escape-button" title="{{template "repo/diff/escape_title" dict "diff" $rightDiff "locale" $.root.locale}}"></a>{{end}}{{end}}</td>
-					<td class="lines-type-marker lines-type-marker-new add-code">{{if $match.RightIdx}}<span class="mono" data-type-marker="{{$match.GetLineTypeMarker}}"></span>{{end}}</td>
+					<td class="lines-type-marker lines-type-marker-new add-code">{{if $match.RightIdx}}<span class="gt-mono" data-type-marker="{{$match.GetLineTypeMarker}}"></span>{{end}}</td>
 					<td class="lines-code lines-code-new halfwidth add-code">{{/*
 						*/}}{{if and $.root.SignedUserID $.root.PageIsPullFiles}}{{/*
 							*/}}<a class="ui primary button add-code-comment add-code-comment-right{{if (not $match.CanComment)}} invisible{{end}}" data-side="right" data-idx="{{$match.RightIdx}}">{{/*
@@ -64,7 +64,7 @@
 					{{$inlineDiff := $section.GetComputedInlineDiffFor $line $.root.locale}}
 					<td class="lines-num lines-num-old" data-line-num="{{if $line.LeftIdx}}{{$line.LeftIdx}}{{end}}"><span rel="{{if $line.LeftIdx}}diff-{{$file.NameHash}}L{{$line.LeftIdx}}{{end}}"></span></td>
 					<td class="lines-escape lines-escape-old">{{if $line.LeftIdx}}{{if $inlineDiff.EscapeStatus.Escaped}}<a href="" class="toggle-escape-button" title="{{template "repo/diff/escape_title" dict "diff" $inlineDiff "locale" $.root.locale}}"></a>{{end}}{{end}}</td>
-					<td class="lines-type-marker lines-type-marker-old">{{if $line.LeftIdx}}<span class="mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span>{{end}}</td>
+					<td class="lines-type-marker lines-type-marker-old">{{if $line.LeftIdx}}<span class="gt-mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span>{{end}}</td>
 					<td class="lines-code lines-code-old halfwidth">{{/*
 						*/}}{{if and $.root.SignedUserID $.root.PageIsPullFiles (not (eq .GetType 2))}}{{/*
 							*/}}<a class="ui primary button add-code-comment add-code-comment-left{{if (not $line.CanComment)}} invisible{{end}}" data-side="left" data-idx="{{$line.LeftIdx}}">{{/*
@@ -79,7 +79,7 @@
 					*/}}</td>
 					<td class="lines-num lines-num-new" data-line-num="{{if $line.RightIdx}}{{$line.RightIdx}}{{end}}"><span rel="{{if $line.RightIdx}}diff-{{$file.NameHash}}R{{$line.RightIdx}}{{end}}"></span></td>
 					<td class="lines-escape lines-escape-new">{{if $line.RightIdx}}{{if $inlineDiff.EscapeStatus.Escaped}}<a href="" class="toggle-escape-button" title="{{template "repo/diff/escape_title" dict "diff" $inlineDiff "locale" $.root.locale}}"></a>{{end}}{{end}}</td>
-					<td class="lines-type-marker lines-type-marker-new">{{if $line.RightIdx}}<span class="mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span>{{end}}</td>
+					<td class="lines-type-marker lines-type-marker-new">{{if $line.RightIdx}}<span class="gt-mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span>{{end}}</td>
 					<td class="lines-code lines-code-new halfwidth">{{/*
 						*/}}{{if and $.root.SignedUserID $.root.PageIsPullFiles (not (eq .GetType 3))}}{{/*
 							*/}}<a class="ui primary button add-code-comment add-code-comment-right{{if (not $line.CanComment)}} invisible{{end}}" data-side="right" data-idx="{{$line.RightIdx}}">{{/*
diff --git a/templates/repo/diff/section_unified.tmpl b/templates/repo/diff/section_unified.tmpl
index e83b1f779..63cd51022 100644
--- a/templates/repo/diff/section_unified.tmpl
+++ b/templates/repo/diff/section_unified.tmpl
@@ -27,7 +27,7 @@
 				{{end}}
 				{{$inlineDiff := $section.GetComputedInlineDiffFor $line $.root.locale -}}
 				<td class="lines-escape">{{if $inlineDiff.EscapeStatus.Escaped}}<a href="" class="toggle-escape-button" title="{{template "repo/diff/escape_title" dict "diff" $inlineDiff "locale" $.root.locale}}"></a>{{end}}</td>
-				<td class="lines-type-marker"><span class="mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span></td>
+				<td class="lines-type-marker"><span class="gt-mono" data-type-marker="{{$line.GetLineTypeMarker}}"></span></td>
 				{{if eq .GetType 4}}
 					<td class="chroma lines-code blob-hunk">{{/*
 						*/}}{{template "repo/diff/section_code" dict "diff" $inlineDiff "locale" $.root.locale}}{{/*
diff --git a/templates/repo/diff/stats.tmpl b/templates/repo/diff/stats.tmpl
index fd1cb019a..ac6e45a7e 100644
--- a/templates/repo/diff/stats.tmpl
+++ b/templates/repo/diff/stats.tmpl
@@ -1,4 +1,4 @@
 {{Add .file.Addition .file.Deletion}}
-<span class="diff-stats-bar tooltip mx-3" data-content="{{.root.locale.Tr "repo.diff.stats_desc_file" (Add .file.Addition .file.Deletion) .file.Addition .file.Deletion | Str2html}}">
+<span class="diff-stats-bar tooltip gt-mx-3" data-content="{{.root.locale.Tr "repo.diff.stats_desc_file" (Add .file.Addition .file.Deletion) .file.Addition .file.Deletion | Str2html}}">
 	<div class="diff-stats-add-bar" style="width: {{DiffStatsWidth .file.Addition .file.Deletion}}%"></div>
 </span>
diff --git a/templates/repo/diff/whitespace_dropdown.tmpl b/templates/repo/diff/whitespace_dropdown.tmpl
index 47a5ab553..cacfb20a2 100644
--- a/templates/repo/diff/whitespace_dropdown.tmpl
+++ b/templates/repo/diff/whitespace_dropdown.tmpl
@@ -3,26 +3,26 @@
 	{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 	<div class="menu">
 		<a class="item" href="?style={{if .IsSplitStyle}}split{{else}}unified{{end}}&whitespace=show-all">
-			<label class="pointer-events-none">
-				<input class="mr-3 pointer-events-none" type="radio"{{if eq .WhitespaceBehavior "show-all"}} checked{{end}}>
+			<label class="gt-pointer-events-none">
+				<input class="gt-mr-3 gt-pointer-events-none" type="radio"{{if eq .WhitespaceBehavior "show-all"}} checked{{end}}>
 				{{.locale.Tr "repo.diff.whitespace_show_everything"}}
 			</label>
 		</a>
 		<a class="item" href="?style={{if .IsSplitStyle}}split{{else}}unified{{end}}&whitespace=ignore-all">
-			<label class="pointer-events-none">
-				<input class="mr-3 pointer-events-none" type="radio"{{if eq .WhitespaceBehavior "ignore-all"}} checked{{end}}>
+			<label class="gt-pointer-events-none">
+				<input class="gt-mr-3 gt-pointer-events-none" type="radio"{{if eq .WhitespaceBehavior "ignore-all"}} checked{{end}}>
 				{{.locale.Tr "repo.diff.whitespace_ignore_all_whitespace"}}
 				<label>
 		</a>
 		<a class="item" href="?style={{if .IsSplitStyle}}split{{else}}unified{{end}}&whitespace=ignore-change">
-			<label class="pointer-events-none">
-				<input class="mr-3 pointer-events-none" type="radio"{{if eq .WhitespaceBehavior "ignore-change"}} checked{{end}}>
+			<label class="gt-pointer-events-none">
+				<input class="gt-mr-3 gt-pointer-events-none" type="radio"{{if eq .WhitespaceBehavior "ignore-change"}} checked{{end}}>
 				{{.locale.Tr "repo.diff.whitespace_ignore_amount_changes"}}
 			</label>
 		</a>
 		<a class="item" href="?style={{if .IsSplitStyle}}split{{else}}unified{{end}}&whitespace=ignore-eol">
-			<label class="pointer-events-none">
-				<input class="mr-3 pointer-events-none" type="radio"{{if eq .WhitespaceBehavior "ignore-eol"}} checked{{end}}>
+			<label class="gt-pointer-events-none">
+				<input class="gt-mr-3 gt-pointer-events-none" type="radio"{{if eq .WhitespaceBehavior "ignore-eol"}} checked{{end}}>
 				{{.locale.Tr "repo.diff.whitespace_ignore_at_eol"}}
 			</label>
 		</a>
diff --git a/templates/repo/editor/commit_form.tmpl b/templates/repo/editor/commit_form.tmpl
index f4778e22d..7fac7f13b 100644
--- a/templates/repo/editor/commit_form.tmpl
+++ b/templates/repo/editor/commit_form.tmpl
@@ -1,5 +1,5 @@
 <div class="commit-form-wrapper">
-	{{avatar .SignedUser 48 "commit-avatar"}}
+	{{avatar $.Context .SignedUser 48 "commit-avatar"}}
 	<div class="commit-form">
 		<h3>{{- if .CanCommitToBranch.WillSign}}
 			<span title="{{.locale.Tr "repo.signing.will_sign" .CanCommitToBranch.SigningKey}}">{{svg "octicon-lock" 24}}</span>
@@ -16,7 +16,7 @@
 		</div>
 		<div class="inline field">
 			<div class="ui checkbox">
-				<input name="signoff" type="checkbox" tabindex="0" class="hidden">
+				<input name="signoff" type="checkbox" tabindex="0">
 				<label>{{.locale.Tr "repo.editor.signoff_desc"}}</label>
 			</div>
 		</div>
@@ -61,7 +61,7 @@
 			<div class="quick-pull-branch-name {{if not (eq .commit_choice "commit-to-new-branch")}}hide{{end}}">
 				<div class="new-branch-name-input field {{if .Err_NewBranchName}}error{{end}}">
 					{{svg "octicon-git-branch"}}
-					<input type="text" name="new_branch_name" value="{{.new_branch_name}}" class="input-contrast mr-2 js-quick-pull-new-branch-name" placeholder="{{.locale.Tr "repo.editor.new_branch_name_desc"}}" {{if eq .commit_choice "commit-to-new-branch"}}required{{end}} title="{{.locale.Tr "repo.editor.new_branch_name"}}">
+					<input type="text" name="new_branch_name" value="{{.new_branch_name}}" class="input-contrast gt-mr-2 js-quick-pull-new-branch-name" placeholder="{{.locale.Tr "repo.editor.new_branch_name_desc"}}" {{if eq .commit_choice "commit-to-new-branch"}}required{{end}} title="{{.locale.Tr "repo.editor.new_branch_name"}}">
 					<span class="text-muted js-quick-pull-normalization-info"></span>
 				</div>
 			</div>
diff --git a/templates/repo/editor/edit.tmpl b/templates/repo/editor/edit.tmpl
index c4a48af9f..992ccee8e 100644
--- a/templates/repo/editor/edit.tmpl
+++ b/templates/repo/editor/edit.tmpl
@@ -36,7 +36,7 @@
 					{{end}}
 				</div>
 				<div class="ui bottom attached active tab segment" data-tab="write">
-					<textarea id="edit_area" name="content" class="hide" data-id="repo-{{.Repository.Name}}-{{.TreePath}}"
+					<textarea id="edit_area" name="content" class="gt-hidden" data-id="repo-{{.Repository.Name}}-{{.TreePath}}"
 						data-url="{{.Repository.Link}}/markdown"
 						data-context="{{.RepoLink}}"
 						data-markdown-file-exts="{{.MarkdownFileExts}}"
diff --git a/templates/repo/editor/patch.tmpl b/templates/repo/editor/patch.tmpl
index 892adf957..bbd5c2dbd 100644
--- a/templates/repo/editor/patch.tmpl
+++ b/templates/repo/editor/patch.tmpl
@@ -22,10 +22,10 @@
 			</div>
 			<div class="field">
 				<div class="ui top attached tabular menu" data-write="write">
-					<a class="active item" data-tab="write">{{svg "octicon-code" 16 "mr-2"}}{{.locale.Tr "repo.editor.new_patch"}}</a>
+					<a class="active item" data-tab="write">{{svg "octicon-code" 16 "gt-mr-2"}}{{.locale.Tr "repo.editor.new_patch"}}</a>
 				</div>
 				<div class="ui bottom attached active tab segment" data-tab="write">
-					<textarea id="edit_area" name="content" class="hide" data-id="repo-{{.Repository.Name}}-patch"
+					<textarea id="edit_area" name="content" class="gt-hidden" data-id="repo-{{.Repository.Name}}-patch"
 						data-context="{{.RepoLink}}"
 						data-line-wrap-extensions="{{.LineWrapExtensions}}">
 {{.FileContent}}</textarea>
diff --git a/templates/repo/file_info.tmpl b/templates/repo/file_info.tmpl
index 90a831fb8..8de65bffa 100644
--- a/templates/repo/file_info.tmpl
+++ b/templates/repo/file_info.tmpl
@@ -1,4 +1,4 @@
-<div class="file-info text grey normal mono">
+<div class="file-info text grey normal gt-mono">
 	{{if .FileIsSymlink}}
 		<div class="file-info-entry">
 			{{.locale.Tr "repo.symbolic_link"}}
@@ -16,7 +16,7 @@
 	{{end}}
 	{{if .LFSLock}}
 		<div class="file-info-entry ui tooltip" data-content="{{.LFSLockHint}}">
-			{{svg "octicon-lock" 16 "mr-2"}}
+			{{svg "octicon-lock" 16 "gt-mr-2"}}
 			<a href="{{.LFSLockOwnerHomeLink}}">{{.LFSLockOwner}}</a>
 		</div>
 	{{end}}
diff --git a/templates/repo/find/files.tmpl b/templates/repo/find/files.tmpl
index ab6f03f4a..dab46cf36 100644
--- a/templates/repo/find/files.tmpl
+++ b/templates/repo/find/files.tmpl
@@ -2,10 +2,10 @@
 <div role="main" aria-label="{{.Title}}" class="page-content repository">
 	{{template "repo/header" .}}
 	<div class="ui container">
-		<div class="df ac">
+		<div class="gt-df gt-ac">
 			<a href="{{$.RepoLink}}">{{.RepoName}}</a>
-			<span class="mx-3">/</span>
-			<div class="ui input f1">
+			<span class="gt-mx-3">/</span>
+			<div class="ui input gt-f1">
 				<input id="repo-file-find-input" type="text" autofocus data-url-data-link="{{.DataLink}}" data-url-tree-link="{{.TreeLink}}">
 			</div>
 		</div>
@@ -13,7 +13,7 @@
 			<tbody>
 			</tbody>
 		</table>
-		<div id="repo-find-file-no-result" class="ui row center mt-5" hidden>
+		<div id="repo-find-file-no-result" class="ui row center gt-mt-5 gt-hidden">
 			<h3>{{.locale.Tr "repo.find_file.no_matching"}}</h3>
 		</div>
 	</div>
diff --git a/templates/repo/forks.tmpl b/templates/repo/forks.tmpl
index b328dc0c1..b05ebcc63 100644
--- a/templates/repo/forks.tmpl
+++ b/templates/repo/forks.tmpl
@@ -8,7 +8,7 @@
 		<div class="ui list">
 			{{range .Forks}}
 				<div class="item">
-					{{avatar .Owner}}
+					{{avatar $.Context .Owner}}
 					<div class="link">
 						<a href="{{.Owner.HomeLink}}">{{.Owner.Name}}</a>
 						/
diff --git a/templates/repo/graph.tmpl b/templates/repo/graph.tmpl
index 52c013a5d..181aba497 100644
--- a/templates/repo/graph.tmpl
+++ b/templates/repo/graph.tmpl
@@ -13,7 +13,7 @@
 						<div class="menu">
 							<div class="item" data-value="...flow-hide-pr-refs">
 								<span class="truncate">
-									{{svg "octicon-eye-closed" 16 "mr-2"}}<span title="{{.locale.Tr "repo.commit_graph.hide_pr_refs"}}">{{.locale.Tr "repo.commit_graph.hide_pr_refs"}}</span>
+									{{svg "octicon-eye-closed" 16 "gt-mr-2"}}<span title="{{.locale.Tr "repo.commit_graph.hide_pr_refs"}}">{{.locale.Tr "repo.commit_graph.hide_pr_refs"}}</span>
 								</span>
 							</div>
 							{{range .AllRefs}}
@@ -21,37 +21,37 @@
 								{{if eq $refGroup "pull"}}
 									<div class="item" data-value="{{.Name}}">
 										<span class="truncate">
-											{{svg "octicon-git-pull-request" 16 "mr-2"}}<span title="{{.ShortName}}">#{{.ShortName}}</span>
+											{{svg "octicon-git-pull-request" 16 "gt-mr-2"}}<span title="{{.ShortName}}">#{{.ShortName}}</span>
 										</span>
 									</div>
 								{{else if eq $refGroup "tags"}}
 									<div class="item" data-value="{{.Name}}">
 										<span class="truncate">
-											{{svg "octicon-tag" 16 "mr-2"}}<span title="{{.ShortName}}">{{.ShortName}}</span>
+											{{svg "octicon-tag" 16 "gt-mr-2"}}<span title="{{.ShortName}}">{{.ShortName}}</span>
 										</span>
 									</div>
 								{{else if eq $refGroup "remotes"}}
 									<div class="item" data-value="{{.Name}}">
 										<span class="truncate">
-											{{svg "octicon-cross-reference" 16 "mr-2"}}<span title="{{.ShortName}}">{{.ShortName}}</span>
+											{{svg "octicon-cross-reference" 16 "gt-mr-2"}}<span title="{{.ShortName}}">{{.ShortName}}</span>
 										</span>
 									</div>
 								{{else if eq $refGroup "heads"}}
 									<div class="item" data-value="{{.Name}}">
 										<span class="truncate">
-											{{svg "octicon-git-branch" 16 "mr-2"}}<span title="{{.ShortName}}">{{.ShortName}}</span>
+											{{svg "octicon-git-branch" 16 "gt-mr-2"}}<span title="{{.ShortName}}">{{.ShortName}}</span>
 										</span>
 									</div>
 								{{end}}
 							{{end}}
 						</div>
 					</div>
-					<button id="flow-color-monochrome" class="ui labelled icon button{{if eq .Mode "monochrome"}} active{{end}}" title="{{.locale.Tr "repo.commit_graph.monochrome"}}">{{svg "material-invert-colors" 16 "mr-2"}}{{.locale.Tr "repo.commit_graph.monochrome"}}</button>
-					<button id="flow-color-colored" class="ui labelled icon button{{if ne .Mode "monochrome"}} active{{end}}" title="{{.locale.Tr "repo.commit_graph.color"}}">{{svg "material-palette" 16 "mr-2"}}{{.locale.Tr "repo.commit_graph.color"}}</button>
+					<button id="flow-color-monochrome" class="ui labelled icon button{{if eq .Mode "monochrome"}} active{{end}}" title="{{.locale.Tr "repo.commit_graph.monochrome"}}">{{svg "material-invert-colors" 16 "gt-mr-2"}}{{.locale.Tr "repo.commit_graph.monochrome"}}</button>
+					<button id="flow-color-colored" class="ui labelled icon button{{if ne .Mode "monochrome"}} active{{end}}" title="{{.locale.Tr "repo.commit_graph.color"}}">{{svg "material-palette" 16 "gt-mr-2"}}{{.locale.Tr "repo.commit_graph.color"}}</button>
 				</div>
 			</h2>
 			<div class="ui dividing"></div>
-			<div class="ui segment loading hide" id="loading-indicator"></div>
+			<div class="ui segment loading gt-hidden" id="loading-indicator"></div>
 			{{template "repo/graph/svgcontainer" .}}
 			{{template "repo/graph/commits" .}}
 		</div>
diff --git a/templates/repo/graph/commits.tmpl b/templates/repo/graph/commits.tmpl
index fc4b1a1ea..0c1e777c3 100644
--- a/templates/repo/graph/commits.tmpl
+++ b/templates/repo/graph/commits.tmpl
@@ -28,50 +28,50 @@
 							{{- end -}}
 						</a>
 					</span>
-					<span class="message dib ellipsis mr-2">
+					<span class="message gt-dib gt-ellipsis gt-mr-2">
 						<span>{{RenderCommitMessage $.Context $commit.Subject $.RepoLink $.Repository.ComposeMetas}}</span>
 					</span>
-					<span class="tags df ac">
+					<span class="tags gt-df gt-ac">
 						{{range $commit.Refs}}
 							{{$refGroup := .RefGroup}}
 							{{if eq $refGroup "pull"}}
 								{{if or (not $.HidePRRefs) (containGeneric $.SelectedBranches .Name)}}
 									<!-- it's intended to use issues not pulls, if it's a pull you will get redirected -->
-									<a class="ui labelled icon button basic tiny mr-2" href="{{$.RepoLink}}/{{if $.Repository.UnitEnabled $.Context $.UnitTypePullRequests}}pulls{{else}}issues{{end}}/{{.ShortName|PathEscape}}">
-										{{svg "octicon-git-pull-request" 16 "mr-2"}}#{{.ShortName}}
+									<a class="ui labelled icon button basic tiny gt-mr-2" href="{{$.RepoLink}}/{{if $.Repository.UnitEnabled $.Context $.UnitTypePullRequests}}pulls{{else}}issues{{end}}/{{.ShortName|PathEscape}}">
+										{{svg "octicon-git-pull-request" 16 "gt-mr-2"}}#{{.ShortName}}
 									</a>
 								{{end}}
 							{{else if eq $refGroup "tags"}}
-								<a class="ui labelled icon button basic tiny mr-2" href="{{$.RepoLink}}/src/tag/{{.ShortName|PathEscape}}">
-									{{svg "octicon-tag" 16 "mr-2"}}{{.ShortName}}
+								<a class="ui labelled icon button basic tiny gt-mr-2" href="{{$.RepoLink}}/src/tag/{{.ShortName|PathEscape}}">
+									{{svg "octicon-tag" 16 "gt-mr-2"}}{{.ShortName}}
 								</a>
 							{{else if eq $refGroup "remotes"}}
-								<a class="ui labelled icon button basic tiny mr-2" href="{{$.RepoLink}}/src/commit/{{$commit.Rev|PathEscape}}">
-									{{svg "octicon-cross-reference" 16 "mr-2"}}{{.ShortName}}
+								<a class="ui labelled icon button basic tiny gt-mr-2" href="{{$.RepoLink}}/src/commit/{{$commit.Rev|PathEscape}}">
+									{{svg "octicon-cross-reference" 16 "gt-mr-2"}}{{.ShortName}}
 								</a>
 							{{else if eq $refGroup "heads"}}
-								<a class="ui labelled icon button basic tiny mr-2" href="{{$.RepoLink}}/src/branch/{{.ShortName|PathEscape}}">
-									{{svg "octicon-git-branch" 16 "mr-2"}}{{.ShortName}}
+								<a class="ui labelled icon button basic tiny gt-mr-2" href="{{$.RepoLink}}/src/branch/{{.ShortName|PathEscape}}">
+									{{svg "octicon-git-branch" 16 "gt-mr-2"}}{{.ShortName}}
 								</a>
 							{{else}}
 								<!-- Unknown ref type {{.Name}} -->
 							{{end}}
 						{{end}}
 					</span>
-					<span class="author df ac mr-2">
+					<span class="author gt-df gt-ac gt-mr-2">
 						{{$userName := $commit.Commit.Author.Name}}
 						{{if $commit.User}}
 							{{if $commit.User.FullName}}
 								{{$userName = $commit.User.FullName}}
 							{{end}}
-							{{avatar $commit.User}}
+							{{avatar $.Context $commit.User}}
 							<a href="{{$commit.User.HomeLink}}">{{$userName}}</a>
 						{{else}}
-							{{avatarByEmail $commit.Commit.Author.Email $userName}}
+							{{avatarByEmail $.Context $commit.Commit.Author.Email $userName}}
 							{{$userName}}
 						{{end}}
 					</span>
-					<span class="time df ac">{{$commit.Date}}</span>
+					<span class="time gt-df gt-ac">{{$commit.Date}}</span>
 				{{end}}
 			</li>
 		{{end}}
diff --git a/templates/repo/header.tmpl b/templates/repo/header.tmpl
index 7a7201eb3..beea89399 100644
--- a/templates/repo/header.tmpl
+++ b/templates/repo/header.tmpl
@@ -2,21 +2,21 @@
 {{with .Repository}}
 	<div class="ui container">
 		<div class="repo-header">
-			<div class="repo-title-wrap df fc">
-				<div class="repo-title">
-					{{$avatar := (repoAvatar . 32 "mr-3")}}
+			<div class="repo-title-wrap gt-df gt-fc">
+				<div class="repo-title" role="heading" aria-level="1">
+					{{$avatar := (repoAvatar . 32 "gt-mr-3")}}
 					{{if $avatar}}
 						{{$avatar}}
 					{{else}}
 						{{template "repo/icon" .}}
 					{{end}}
 					<a href="{{.Owner.HomeLink}}">{{.Owner.Name}}</a>
-					<div class="mx-2">/</div>
+					<div class="gt-mx-2">/</div>
 					<a href="{{$.RepoLink}}">{{.Name}}</a>
 					{{if $.EnableFeed}}
-						<a href="{{$.RepoLink}}.rss"><i class="ui grey icon tooltip ml-3" data-content="{{$.locale.Tr "rss_feed"}}" data-position="top center">{{svg "octicon-rss" 18}}</i></a>
+						<a href="{{$.RepoLink}}.rss"><i class="ui grey icon tooltip gt-ml-3" data-content="{{$.locale.Tr "rss_feed"}}" data-position="top center">{{svg "octicon-rss" 18}}</i></a>
 					{{end}}
-					<div class="labels df ac fw">
+					<div class="labels gt-df gt-ac gt-fw">
 						{{if .IsTemplate}}
 							{{if .IsPrivate}}
 								<span class="ui basic label">{{$.locale.Tr "repo.desc.private_template"}}</span>
@@ -122,12 +122,12 @@
 								<div class="header">
 									{{$.locale.Tr "repo.already_forked" .Name}}
 								</div>
-								<div class="content tl">
+								<div class="content gt-tl">
 									<div class="ui list">
 										{{range $.UserAndOrgForks}}
-											<div class="ui item py-3">
+											<div class="ui item gt-py-3">
 												<a href="{{.Link}}">
-													{{svg "octicon-repo-forked" 16 "mr-3"}}{{.FullName}}
+													{{svg "octicon-repo-forked" 16 "gt-mr-3"}}{{.FullName}}
 												</a>
 											</div>
 										{{end}}
diff --git a/templates/repo/home.tmpl b/templates/repo/home.tmpl
index bdca346f8..075b859a0 100644
--- a/templates/repo/home.tmpl
+++ b/templates/repo/home.tmpl
@@ -17,7 +17,7 @@
 							<div class="ui action input{{if .CodeIndexerUnavailable}} disabled left icon tooltip{{end}}"{{if .CodeIndexerUnavailable}} data-content="{{.locale.Tr "repo.search.code_search_unavailable"}}"{{end}}>
 								<input name="q" value="{{.Keyword}}"{{if .CodeIndexerUnavailable}} disabled{{end}} placeholder="{{.locale.Tr "repo.search.search_repo"}}">
 								{{if .CodeIndexerUnavailable}}
-									<i class="icon df ac jc">{{svg "octicon-alert"}}</i>
+									<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-alert"}}</i>
 								{{end}}
 								<button class="ui icon button"{{if .CodeIndexerUnavailable}} disabled{{end}} type="submit">
 									{{svg "octicon-search"}}
@@ -28,19 +28,19 @@
 				</div>
 			{{end}}
 		</div>
-		<div class="mt-3" id="repo-topics">
+		<div class="gt-mt-3" id="repo-topics">
 		{{range .Topics}}<a class="ui repo-topic large label topic" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=1">{{.Name}}</a>{{end}}
 		{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}<a id="manage_topic" class="muted">{{.locale.Tr "repo.topic.manage_topics"}}</a>{{end}}
 		</div>
 		{{end}}
 		{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}
-		<div class="ui repo-topic-edit grid form" id="topic_edit" style="display:none">
+		<div class="ui repo-topic-edit grid form gt-hidden" id="topic_edit">
 			<div class="fourteen wide column">
 				<div class="field">
 					<div class="ui fluid multiple search selection dropdown">
 						<input type="hidden" name="topics" value="{{range $i, $v := .Topics}}{{.Name}}{{if lt (Add $i 1) (len $.Topics)}},{{end}}{{end}}">
 						{{range .Topics}}
-						<div class="ui small label topic transition visible" data-value="{{.Name}}" style="display: inline-block !important; cursor: default;">{{.Name}}{{svg "octicon-x" 16 "delete icon ml-3 mt-1"}}</div>
+						<div class="ui small label topic transition visible" data-value="{{.Name}}" style="display: inline-block !important; cursor: default;">{{.Name}}{{svg "octicon-x" 16 "delete icon gt-ml-3 gt-mt-1"}}</div>
 						{{end}}
 						<div class="text"></div>
 					</div>
@@ -52,7 +52,7 @@
 			</div>
 		</div>
 		{{end}}
-		<div class="hide" id="validate_prompt">
+		<div class="gt-hidden" id="validate_prompt">
 			<span id="count_prompt">{{.locale.Tr "repo.topic.count_prompt"}}</span>
 			<span id="format_prompt">{{.locale.Tr "repo.topic.format_prompt"}}</span>
 		</div>
@@ -62,12 +62,12 @@
 			</div>
 		{{end}}
 		{{template "repo/sub_menu" .}}
-		<div class="repo-button-row df ac sb fw">
-			<div class="df ac">
+		<div class="repo-button-row gt-df gt-ac gt-sb gt-fw">
+			<div class="gt-df gt-ac">
 				{{template "repo/branch_dropdown" dict "root" .}}
 				{{$n := len .TreeNames}}
 				{{$l := Subtract $n 1}}
-				<!-- If home page, show new PR. If not, show breadcrumb -->
+				<!-- If home page, show new pr. If not, show breadcrumb -->
 				{{if eq $n 0}}
 					{{if and .CanCompareOrPull .IsViewBranch (not .Repository.IsArchived)}}
 						<a href="{{CompareLink .BaseRepo .Repository .BranchName}}">
@@ -77,7 +77,7 @@
 					<a href="{{.Repository.Link}}/find/{{.BranchNameSubURL}}" class="ui compact basic button">{{.locale.Tr "repo.find_file.go_to_file"}}</a>
 				{{end}}
 				{{if or .CanAddFile .CanUploadFile}}
-					<button class="ui basic small compact dropdown jump icon button mr-2"{{if not .Repository.CanEnableEditor}} disabled{{end}}>
+					<button class="ui basic small compact dropdown jump icon button gt-mr-2"{{if not .Repository.CanEnableEditor}} disabled{{end}}>
 						<span class="text">{{.locale.Tr "repo.editor.add_file"}}</span>
 						<div class="menu">
 							{{if .CanAddFile}}
@@ -100,10 +100,10 @@
 					</button>
 				{{end}}
 				{{if ne $n 0}}
-					<span class="ui breadcrumb repo-path ml-2"><a class="section" href="{{.RepoLink}}/src/{{.BranchNameSubURL}}" title="{{.Repository.Name}}">{{EllipsisString .Repository.Name 30}}</a>{{range $i, $v := .TreeNames}}<span class="divider">/</span>{{if eq $i $l}}<span class="active section" title="{{$v}}">{{EllipsisString $v 30}}</span>{{else}}{{$p := index $.Paths $i}}<span class="section"><a href="{{$.BranchLink}}/{{PathEscapeSegments $p}}" title="{{$v}}">{{EllipsisString $v 30}}</a></span>{{end}}{{end}}</span>
+					<span class="ui breadcrumb repo-path gt-ml-2"><a class="section" href="{{.RepoLink}}/src/{{.BranchNameSubURL}}" title="{{.Repository.Name}}">{{EllipsisString .Repository.Name 30}}</a>{{range $i, $v := .TreeNames}}<span class="divider">/</span>{{if eq $i $l}}<span class="active section" title="{{$v}}">{{EllipsisString $v 30}}</span>{{else}}{{$p := index $.Paths $i}}<span class="section"><a href="{{$.BranchLink}}/{{PathEscapeSegments $p}}" title="{{$v}}">{{EllipsisString $v 30}}</a></span>{{end}}{{end}}</span>
 				{{end}}
 			</div>
-			<div class="df ac">
+			<div class="gt-df gt-ac">
 				{{if eq $n 0}}
 					{{if .Repository.IsTemplate}}
 						<div class="ui tiny primary buttons">
@@ -121,14 +121,14 @@
 							{{svg "octicon-kebab-horizontal"}}
 							<div class="menu">
 								{{if not $.DisableDownloadSourceArchives}}
-									<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.zip" rel="nofollow">{{svg "octicon-file-zip" 16 "mr-3"}}{{.locale.Tr "repo.download_zip"}}</a>
-									<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip" 16 "mr-3"}}{{.locale.Tr "repo.download_tar"}}</a>
-									<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.bundle" rel="nofollow">{{svg "octicon-package" 16 "mr-3"}}{{.locale.Tr "repo.download_bundle"}}</a>
+									<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.zip" rel="nofollow">{{svg "octicon-file-zip" 16 "gt-mr-3"}}{{.locale.Tr "repo.download_zip"}}</a>
+									<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip" 16 "gt-mr-3"}}{{.locale.Tr "repo.download_tar"}}</a>
+									<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.bundle" rel="nofollow">{{svg "octicon-package" 16 "gt-mr-3"}}{{.locale.Tr "repo.download_bundle"}}</a>
 									{{if .CitiationExist}}
-										<a class="item" id="cite-repo-button">{{svg "octicon-cross-reference" 16 "mr-3"}}{{.locale.Tr "repo.cite_this_repo"}}</a>
+										<a class="item" id="cite-repo-button">{{svg "octicon-cross-reference" 16 "gt-mr-3"}}{{.locale.Tr "repo.cite_this_repo"}}</a>
 									{{end}}
 								{{end}}
-								<a class="item js-clone-url-vsc" href="vscode://vscode.git/clone?url={{.CloneButtonOriginLink.HTTPS}}">{{svg "gitea-vscode" 16 "mr-3"}}{{.locale.Tr "repo.clone_in_vsc"}}</a>
+								<a class="item js-clone-url-vsc" href="vscode://vscode.git/clone?url={{.CloneButtonOriginLink.HTTPS}}">{{svg "gitea-vscode" 16 "gt-mr-3"}}{{.locale.Tr "repo.clone_in_vsc"}}</a>
 							</div>
 						</button>
 						{{template "repo/clone_script" .}}{{/* the script will update `.js-clone-url` and related elements */}}
@@ -137,7 +137,7 @@
 				{{end}}
 				{{if and (ne $n 0) (not .IsViewFile) (not .IsBlame)}}
 					<a class="ui button" href="{{.RepoLink}}/commits/{{.BranchNameSubURL}}/{{.TreePath | PathEscapeSegments}}">
-						{{svg "octicon-history" 16 "mr-3"}}{{.locale.Tr "repo.file_history"}}
+						{{svg "octicon-history" 16 "gt-mr-3"}}{{.locale.Tr "repo.file_history"}}
 					</a>
 				{{end}}
 			</div>
diff --git a/templates/repo/icon.tmpl b/templates/repo/icon.tmpl
index 70634a634..e95674515 100644
--- a/templates/repo/icon.tmpl
+++ b/templates/repo/icon.tmpl
@@ -1,4 +1,4 @@
-<div class="repo-icon mr-3">
+<div class="repo-icon gt-mr-3">
 	{{if $.IsTemplate}}
 		{{svg "octicon-repo-template" 32}}
 	{{else}}
diff --git a/templates/repo/issue/branch_selector_field.tmpl b/templates/repo/issue/branch_selector_field.tmpl
index 214914b1b..51eb5e26a 100644
--- a/templates/repo/issue/branch_selector_field.tmpl
+++ b/templates/repo/issue/branch_selector_field.tmpl
@@ -12,7 +12,7 @@
 	</div>
 	<div class="menu">
 		<div class="ui icon search input">
-			<i class="icon df ac jc m-0">{{svg "octicon-filter" 16}}</i>
+			<i class="icon gt-df gt-ac gt-jc gt-m-0">{{svg "octicon-filter" 16}}</i>
 			<input name="search" placeholder="{{.locale.Tr "repo.filter_branch_and_tag"}}...">
 		</div>
 		<div class="header">
@@ -20,12 +20,12 @@
 				<div class="two column row">
 					<a class="reference column" href="#" data-target="#branch-list">
 						<span class="text black">
-							{{svg "octicon-git-branch" 16 "mr-2"}}{{.locale.Tr "repo.branches"}}
+							{{svg "octicon-git-branch" 16 "gt-mr-2"}}{{.locale.Tr "repo.branches"}}
 						</span>
 					</a>
 					<a class="reference column" href="#" data-target="#tag-list">
 						<span class="text">
-							{{svg "octicon-tag" 16 "mr-2"}}{{.locale.Tr "repo.tags"}}
+							{{svg "octicon-tag" 16 "gt-mr-2"}}{{.locale.Tr "repo.tags"}}
 						</span>
 					</a>
 				</div>
@@ -39,7 +39,7 @@
 				<div class="item" data-id="refs/heads/{{.}}" data-name="{{.}}" data-id-selector="#ref_selector">{{.}}</div>
 			{{end}}
 		</div>
-		<div id="tag-list" class="scrolling menu reference-list-menu {{if not .Issue}}new-issue{{end}}" style="display: none">
+		<div id="tag-list" class="scrolling menu reference-list-menu {{if not .Issue}}new-issue{{end}} gt-hidden">
 			{{if .Reference}}
 				<div class="item text small" data-id="" data-id-selector="#ref_selector"><strong><a href="#">{{.locale.Tr "repo.clear_ref"}}</a></strong></div>
 			{{end}}
diff --git a/templates/repo/issue/labels/edit_delete_label.tmpl b/templates/repo/issue/labels/edit_delete_label.tmpl
index a0479dde1..450061e83 100644
--- a/templates/repo/issue/labels/edit_delete_label.tmpl
+++ b/templates/repo/issue/labels/edit_delete_label.tmpl
@@ -26,31 +26,45 @@
 		<form class="ui edit-label form ignore-dirty" action="{{$.Link}}/edit" method="post">
 			{{.CsrfTokenHtml}}
 			<input id="label-modal-id" name="id" type="hidden">
-			<div class="ui grid">
-				<div class="three wide column">
-					<div class="ui small input">
-						<input class="new-label-input emoji-input" name="title" placeholder="{{.locale.Tr "repo.issues.new_label_placeholder"}}" autofocus required maxlength="50">
-					</div>
+			<div class="required field">
+				<label for="name">{{.locale.Tr "repo.issues.label_title"}}</label>
+				<div class="ui small input">
+					<input class="label-name-input emoji-input" name="title" placeholder="{{.locale.Tr "repo.issues.new_label_placeholder"}}" autofocus required maxlength="50">
 				</div>
-				<div class="five wide column">
-					<div class="ui small fluid input">
-						<input class="new-label-desc-input" name="description" placeholder="{{.locale.Tr "repo.issues.new_label_desc_placeholder"}}" maxlength="200">
-					</div>
+			</div>
+			<div class="field label-exclusive-input-field">
+				<div class="ui checkbox">
+					<input class="label-exclusive-input" name="exclusive" type="checkbox">
+					<label>{{.locale.Tr "repo.issues.label_exclusive"}}</label>
 				</div>
+				<br/>
+				<small class="desc">{{.locale.Tr "repo.issues.label_exclusive_desc" | Safe}}</small>
+				<div class="desc gt-ml-2 gt-mt-3 gt-hidden label-exclusive-warning">
+					{{svg "octicon-alert"}} {{.locale.Tr "repo.issues.label_exclusive_warning" | Safe}}
+				</div>
+			</div>
+			<div class="field">
+				<label for="description">{{.locale.Tr "repo.issues.label_description"}}</label>
+				<div class="ui small fluid input">
+					<input class="label-desc-input" name="description" placeholder="{{.locale.Tr "repo.issues.new_label_desc_placeholder"}}" maxlength="200">
+				</div>
+			</div>
+			<div class="field color-field">
+				<label for="color">{{$.locale.Tr "repo.issues.label_color"}}</label>
 				<div class="color picker column">
 					<input class="color-picker" name="color" value="#70c24a" required maxlength="7">
-				</div>
-				<div class="column precolors">
-					{{template "repo/issue/label_precolors"}}
+					<div class="column precolors">
+						{{template "repo/issue/label_precolors"}}
+					</div>
 				</div>
 			</div>
 		</form>
 	</div>
 	<div class="actions">
-		<div class="ui negative button">
+		<div class="ui secondary small basic cancel button">
 			{{.locale.Tr "cancel"}}
 		</div>
-		<div class="ui positive button">
+		<div class="ui primary small approve button">
 			{{.locale.Tr "save"}}
 		</div>
 	</div>
diff --git a/templates/repo/issue/labels/label.tmpl b/templates/repo/issue/labels/label.tmpl
index 0afe5cb6e..6e9177aec 100644
--- a/templates/repo/issue/labels/label.tmpl
+++ b/templates/repo/issue/labels/label.tmpl
@@ -1,9 +1,7 @@
 <a
-	class="ui label item {{if not .label.IsChecked}}hide{{end}}"
+	class="item {{if not .label.IsChecked}}gt-hidden{{end}}"
 	id="label_{{.label.ID}}"
 	href="{{.root.RepoLink}}/{{if or .root.IsPull .root.Issue.IsPull}}pulls{{else}}issues{{end}}?labels={{.label.ID}}"{{/* FIXME: use .root.Issue.Link or create .root.Link */}}
-	style="color: {{.label.ForegroundColor}}; background-color: {{.label.Color}}"
-	title="{{.label.Description | RenderEmojiPlain}}"
 >
-	{{.label.Name | RenderEmoji}}
+	{{RenderLabel .label}}
 </a>
diff --git a/templates/repo/issue/labels/label_list.tmpl b/templates/repo/issue/labels/label_list.tmpl
index 464c9fe20..e8f00fa25 100644
--- a/templates/repo/issue/labels/label_list.tmpl
+++ b/templates/repo/issue/labels/label_list.tmpl
@@ -30,28 +30,24 @@
 		{{range .Labels}}
 			<li class="item">
 			<div class="ui grid middle aligned">
-				<div class="four wide column">
-					<div class="ui label" style="color: {{.ForegroundColor}}; background-color: {{.Color}}">{{svg "octicon-tag"}} {{.Name | RenderEmoji}}</div>
-				</div>
-				<div class="six wide column">
-					<div class="ui">
-					{{.Description | RenderEmoji}}
-					</div>
+				<div class="nine wide column">
+					{{RenderLabel .}}
+					{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji}}</small>{{end}}
 				</div>
-				<div class="three wide column">
+				<div class="four wide column">
 					{{if $.PageIsOrgSettingsLabels}}
-						<a class="ui right open-issues" href="{{AppSubUrl}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
+						<a class="ui left open-issues" href="{{AppSubUrl}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
 					{{else}}
-						<a class="ui right open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
+						<a class="ui left open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
 					{{end}}
 				</div>
 				<div class="three wide column">
 					{{if and (not $.PageIsOrgSettingsLabels ) (not $.Repository.IsArchived) (or $.CanWriteIssues $.CanWritePulls)}}
 						<a class="ui right delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
-						<a class="ui right edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
+						<a class="ui right edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
 					{{else if $.PageIsOrgSettingsLabels}}
 						<a class="ui right delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
-						<a class="ui right edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
+						<a class="ui right edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
 					{{end}}
 				</div>
 			</div>
@@ -73,16 +69,12 @@
 					{{range .OrgLabels}}
 					<li class="item">
 					<div class="ui grid middle aligned">
-						<div class="three wide column">
-							<div class="ui label" style="color: {{.ForegroundColor}}; background-color: {{.Color}}">{{svg "octicon-tag"}} {{.Name | RenderEmoji}}</div>
+						<div class="nine wide column">
+							{{RenderLabel .}}
+							{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji}}</small>{{end}}
 						</div>
-						<div class="seven wide column">
-							<div class="ui">
-							{{.Description | RenderEmoji}}
-							</div>
-						</div>
-						<div class="three wide column">
-								<a class="ui right open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenRepoIssues}}</a>
+						<div class="four wide column">
+							<a class="ui left open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenRepoIssues}}</a>
 						</div>
 						<div class="three wide column">
 						</div>
diff --git a/templates/repo/issue/labels/label_new.tmpl b/templates/repo/issue/labels/label_new.tmpl
index 035a4db80..62f7155b7 100644
--- a/templates/repo/issue/labels/label_new.tmpl
+++ b/templates/repo/issue/labels/label_new.tmpl
@@ -1,27 +1,47 @@
-<div class="ui new-label segment hide">
-	<form class="ui form" action="{{$.Link}}/new" method="post">
-		{{.CsrfTokenHtml}}
-		<div class="ui grid">
-			<div class="three wide column">
+<div class="ui small new-label modal">
+	<div class="header">
+		{{.locale.Tr "repo.issues.new_label"}}
+	</div>
+	<div class="content">
+		<form class="ui new-label form ignore-dirty" action="{{$.Link}}/new" method="post">
+			{{.CsrfTokenHtml}}
+			<div class="required field">
+				<label for="name">{{.locale.Tr "repo.issues.label_title"}}</label>
 				<div class="ui small input">
-					<input class="new-label-input emoji-input" name="title" placeholder="{{.locale.Tr "repo.issues.new_label_placeholder"}}" autofocus required maxlength="50">
+					<input class="label-name-input emoji-input" name="title" placeholder="{{.locale.Tr "repo.issues.new_label_placeholder"}}" autofocus required maxlength="50">
 				</div>
 			</div>
-			<div class="three wide column">
-				<div class="ui small fluid input">
-					<input class="new-label-desc-input" name="description" placeholder="{{.locale.Tr "repo.issues.new_label_desc_placeholder"}}" maxlength="200">
+			<div class="field label-exclusive-input-field">
+				<div class="ui checkbox">
+					<input class="label-exclusive-input" name="exclusive" type="checkbox">
+					<label>{{.locale.Tr "repo.issues.label_exclusive"}}</label>
 				</div>
+				<br/>
+				<small class="desc">{{.locale.Tr "repo.issues.label_exclusive_desc" | Safe}}</small>
 			</div>
-			<div class="color picker column">
-				<input class="color-picker" name="color" value="#70c24a" required maxlength="7">
-			</div>
-			<div class="column precolors">
-				{{template "repo/issue/label_precolors"}}
+			<div class="field">
+				<label for="description">{{.locale.Tr "repo.issues.label_description"}}</label>
+				<div class="ui small fluid input">
+					<input class="label-desc-input" name="description" placeholder="{{.locale.Tr "repo.issues.new_label_desc_placeholder"}}" maxlength="200">
+				</div>
 			</div>
-			<div class="buttons">
-				<div class="ui secondary small basic cancel button">{{.locale.Tr "repo.milestones.cancel"}}</div>
-				<button class="ui primary small button">{{.locale.Tr "repo.issues.create_label"}}</button>
+			<div class="field color-field">
+				<label for="color">{{$.locale.Tr "repo.issues.label_color"}}</label>
+				<div class="color picker column">
+					<input class="color-picker" name="color" value="#70c24a" required maxlength="7">
+					<div class="column precolors">
+						{{template "repo/issue/label_precolors"}}
+					</div>
+				</div>
 			</div>
+		</form>
+	</div>
+	<div class="actions">
+		<div class="ui secondary small basic cancel button">
+			{{.locale.Tr "cancel"}}
+		</div>
+		<div class="ui primary small approve button">
+			{{.locale.Tr "repo.issues.create_label"}}
 		</div>
-	</form>
+	</div>
 </div>
diff --git a/templates/repo/issue/labels/labels_sidebar.tmpl b/templates/repo/issue/labels/labels_sidebar.tmpl
index e2ef38d62..bd878d6f5 100644
--- a/templates/repo/issue/labels/labels_sidebar.tmpl
+++ b/templates/repo/issue/labels/labels_sidebar.tmpl
@@ -1,5 +1,5 @@
 <div class="ui labels list">
-	<span class="no-select item {{if .ctx.HasSelectedLabel}}hide{{end}}">{{.ctx.locale.Tr "repo.issues.new.no_label"}}</span>
+	<span class="no-select item {{if .ctx.HasSelectedLabel}}gt-hidden{{end}}">{{.ctx.locale.Tr "repo.issues.new.no_label"}}</span>
 	<span class="labels-list">
 		{{range .ctx.Labels}}
 			{{template "repo/issue/labels/label" dict "root" $.root "label" .}}
diff --git a/templates/repo/issue/list.tmpl b/templates/repo/issue/list.tmpl
index c04b07422..2b1bea822 100644
--- a/templates/repo/issue/list.tmpl
+++ b/templates/repo/issue/list.tmpl
@@ -29,7 +29,7 @@
 		<div id="issue-filters" class="ui stackable grid">
 			<div class="six wide column">
 				{{if $.CanWriteIssuesOrPulls}}
-					<div class="ui checkbox issue-checkbox-all vm">
+					<div class="ui checkbox issue-checkbox-all gt-vm">
 						<input type="checkbox" title="{{.locale.Tr "repo.issues.action_check_all"}}">
 					</div>
 				{{end}}
@@ -45,13 +45,19 @@
 						</span>
 						<div class="menu">
 							<div class="ui icon search input">
-								<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+								<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 								<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_label"}}">
 							</div>
 							<span class="info">{{.locale.Tr "repo.issues.filter_label_exclude" | Safe}}</span>
 							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&milestone={{$.MilestoneID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">{{.locale.Tr "repo.issues.filter_label_no_select"}}</a>
+							{{$previousExclusiveScope := "_no_scope"}}
 							{{range .Labels}}
-								<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&milestone={{$.MilestoneID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if .IsSelected}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}</a>
+								{{$exclusiveScope := .ExclusiveScope}}
+								{{if and (ne $previousExclusiveScope "_no_scope") (ne $previousExclusiveScope $exclusiveScope)}}
+									<div class="ui divider"></div>
+								{{end}}
+								{{$previousExclusiveScope = $exclusiveScope}}
+								<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&milestone={{$.MilestoneID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if .IsSelected}}{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}{{end}} {{RenderLabel .}}</a>
 							{{end}}
 						</div>
 					</div>
@@ -64,7 +70,7 @@
 						</span>
 						<div class="menu">
 							<div class="ui icon search input">
-								<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+								<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 								<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_milestone"}}">
 							</div>
 							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">{{.locale.Tr "repo.issues.filter_milestone_no_select"}}</a>
@@ -82,7 +88,7 @@
 						</span>
 						<div class="menu">
 							<div class="ui icon search input">
-								<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+								<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 								<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_project"}}">
 							</div>
 							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">{{.locale.Tr "repo.issues.filter_project_all"}}</a>
@@ -94,7 +100,7 @@
 								</div>
 								{{range .OpenProjects}}
 									<a class="{{if $.ProjectID}}{{if eq $.ProjectID .ID}}active selected{{end}}{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&project={{.ID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">
-										{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "mr-3"}}{{else}}{{svg "octicon-project" 18 "mr-3"}}{{end}}
+										{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "gt-mr-3"}}{{else}}{{svg "octicon-project" 18 "gt-mr-3"}}{{end}}
 										{{.Title}}
 									</a>
 								{{end}}
@@ -106,7 +112,7 @@
 								</div>
 								{{range .ClosedProjects}}
 									<a class="{{if $.ProjectID}}{{if eq $.ProjectID .ID}}active selected{{end}}{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&project={{.ID}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">
-										{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "mr-3"}}{{else}}{{svg "octicon-project" 18 "mr-3"}}{{end}}
+										{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "gt-mr-3"}}{{else}}{{svg "octicon-project" 18 "gt-mr-3"}}{{end}}
 										{{.Title}}
 									</a>
 								{{end}}
@@ -122,13 +128,13 @@
 						</span>
 						<div class="menu">
 							<div class="ui icon search input">
-								<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+								<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 								<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_poster"}}">
 							</div>
 							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}">{{.locale.Tr "repo.issues.filter_poster_no_select"}}</a>
 							{{range .Posters}}
 								<a class="{{if eq $.PosterID .ID}}active selected{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&project={{$.ProjectID}}&assignee={{$.AssigneeID}}&poster={{.ID}}">
-									{{avatar .}} {{.GetDisplayName}}
+									{{avatar $.Context .}} {{.GetDisplayName}}
 								</a>
 							{{end}}
 						</div>
@@ -142,13 +148,13 @@
 						</span>
 						<div class="menu">
 							<div class="ui icon search input">
-								<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+								<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 								<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_assignee"}}">
 							</div>
 							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&milestone={{$.MilestoneID}}&project={{$.ProjectID}}&poster={{$.PosterID}}">{{.locale.Tr "repo.issues.filter_assginee_no_select"}}</a>
 							{{range .Assignees}}
 								<a class="{{if eq $.AssigneeID .ID}}active selected{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&milestone={{$.MilestoneID}}&project={{$.ProjectID}}&assignee={{.ID}}&poster={{$.PosterID}}">
-									{{avatar .}} {{.GetDisplayName}}
+									{{avatar $.Context .}} {{.GetDisplayName}}
 								</a>
 							{{end}}
 						</div>
@@ -193,7 +199,7 @@
 				</div>
 			</div>
 		</div>
-		<div id="issue-actions" class="ui stackable grid hide">
+		<div id="issue-actions" class="ui stackable grid gt-hidden">
 			<div class="six wide column">
 				{{template "repo/issue/openclose" .}}
 			</div>
@@ -217,9 +223,15 @@
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 						</span>
 						<div class="menu">
+							{{$previousExclusiveScope := "_no_scope"}}
 							{{range .Labels}}
+								{{$exclusiveScope := .ExclusiveScope}}
+								{{if and (ne $previousExclusiveScope "_no_scope") (ne $previousExclusiveScope $exclusiveScope)}}
+									<div class="ui divider"></div>
+								{{end}}
+								{{$previousExclusiveScope = $exclusiveScope}}
 								<div class="item issue-action" data-action="toggle" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/labels">
-									{{if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
+									{{if contain $.SelLabelIDs .ID}}{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}{{end}} {{RenderLabel .}}
 								</div>
 							{{end}}
 						</div>
@@ -260,7 +272,7 @@
 								</div>
 								{{range .OpenProjects}}
 									<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/projects">
-										{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "mr-3"}}{{else}}{{svg "octicon-project" 18 "mr-3"}}{{end}}
+										{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "gt-mr-3"}}{{else}}{{svg "octicon-project" 18 "gt-mr-3"}}{{end}}
 										{{.Title}}
 									</div>
 								{{end}}
@@ -272,7 +284,7 @@
 								</div>
 								{{range .ClosedProjects}}
 									<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/projects">
-										{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "mr-3"}}{{else}}{{svg "octicon-project" 18 "mr-3"}}{{end}}
+										{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "gt-mr-3"}}{{else}}{{svg "octicon-project" 18 "gt-mr-3"}}{{end}}
 										{{.Title}}
 									</div>
 								{{end}}
@@ -292,7 +304,7 @@
 							</div>
 							{{range .Assignees}}
 								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/assignee">
-									{{avatar .}} {{.GetDisplayName}}
+									{{avatar $.Context .}} {{.GetDisplayName}}
 								</div>
 							{{end}}
 						</div>
diff --git a/templates/repo/issue/milestone_issues.tmpl b/templates/repo/issue/milestone_issues.tmpl
index f0d6ae6bf..fca959744 100644
--- a/templates/repo/issue/milestone_issues.tmpl
+++ b/templates/repo/issue/milestone_issues.tmpl
@@ -52,13 +52,13 @@
 						</span>
 						<div class="menu">
 							<div class="ui icon search input">
-								<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+								<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 								<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_label"}}">
 							</div>
 							<span class="info">{{.locale.Tr "repo.issues.filter_label_exclude" | Safe}}</span>
 							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">{{.locale.Tr "repo.issues.filter_label_no_select"}}</a>
 							{{range .Labels}}
-								<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}</a>
+								<a class="item label-filter-item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.QueryString}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}" data-label-id="{{.ID}}">{{if .IsExcluded}}{{svg "octicon-circle-slash"}}{{else if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}} {{RenderLabel .}}</a>
 							{{end}}
 						</div>
 					</div>
@@ -73,7 +73,7 @@
 							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&assignee={{$.AssigneeID}}">{{.locale.Tr "repo.issues.filter_poster_no_select"}}</a>
 							{{range .Posters}}
 								<a class="{{if eq $.PosterID .ID}}active selected{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&assignee={{$.AssigneeID}}&poster={{.ID}}">
-									{{avatar .}} {{.GetDisplayName}}
+									{{avatar $.Context .}} {{.GetDisplayName}}
 								</a>
 							{{end}}
 						</div>
@@ -87,13 +87,13 @@
 						</span>
 						<div class="menu">
 							<div class="ui icon search input">
-								<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+								<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 								<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_assignee"}}">
 							</div>
 							<a class="item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{.SelectLabels}}&poster={{$.PosterID}}">{{.locale.Tr "repo.issues.filter_assginee_no_select"}}</a>
 							{{range .Assignees}}
 								<a class="{{if eq $.AssigneeID .ID}}active selected{{end}} item" href="{{$.Link}}?type={{$.ViewType}}&sort={{$.SortType}}&state={{$.State}}&labels={{$.SelectLabels}}&assignee={{.ID}}&poster={{$.PosterID}}">
-									{{avatar . 28 "mr-2"}}
+									{{avatar $.Context . 28 "gt-mr-2"}}
 									{{.GetDisplayName}}
 								</a>
 							{{end}}
@@ -135,7 +135,7 @@
 				</div>
 			</div>
 		</div>
-		<div id="issue-actions" class="ui stackable grid hide">
+		<div id="issue-actions" class="ui stackable grid gt-hidden">
 			<div class="six wide column">
 				{{template "repo/issue/openclose" .}}
 			</div>
@@ -161,7 +161,7 @@
 						<div class="menu">
 							{{range .Labels}}
 								<div class="item issue-action" data-action="toggle" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/labels">
-									{{if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}}<span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
+									{{if contain $.SelLabelIDs .ID}}{{svg "octicon-check"}}{{end}} {{RenderLabel .}}
 								</div>
 							{{end}}
 						</div>
@@ -179,7 +179,7 @@
 							</div>
 							{{range .Assignees}}
 								<div class="item issue-action" data-element-id="{{.ID}}" data-url="{{$.RepoLink}}/issues/assignee">
-									{{avatar . 28 "mr-2"}}
+									{{avatar $.Context . 28 "gt-mr-2"}}
 									{{.GetDisplayName}}
 								</div>
 							{{end}}
diff --git a/templates/repo/issue/milestones.tmpl b/templates/repo/issue/milestones.tmpl
index 0d0a18b63..3730d3d3c 100644
--- a/templates/repo/issue/milestones.tmpl
+++ b/templates/repo/issue/milestones.tmpl
@@ -17,11 +17,11 @@
 			<div class="column">
 				<div class="ui compact tiny menu">
 					<a class="item{{if not .IsShowClosed}} active{{end}}" href="{{.RepoLink}}/milestones?state=open&q={{$.Keyword}}">
-						{{svg "octicon-milestone" 16 "mr-3"}}
+						{{svg "octicon-milestone" 16 "gt-mr-3"}}
 						{{JsPrettyNumber .OpenCount}}&nbsp;{{.locale.Tr "repo.issues.open_title"}}
 					</a>
 					<a class="item{{if .IsShowClosed}} active{{end}}" href="{{.RepoLink}}/milestones?state=closed&q={{$.Keyword}}">
-						{{svg "octicon-check" 16 "mr-3"}}
+						{{svg "octicon-check" 16 "gt-mr-3"}}
 						{{JsPrettyNumber .ClosedCount}}&nbsp;{{.locale.Tr "repo.issues.closed_title"}}
 					</a>
 				</div>
@@ -38,7 +38,7 @@
 				</form>
 			</div>
 
-			<div class="column right aligned df ac je">
+			<div class="column right aligned gt-df gt-ac gt-je">
 				<!-- Sort -->
 				<div class="ui dropdown type jump item">
 					<span class="text">
@@ -61,12 +61,12 @@
 		<div class="milestone list">
 			{{range .Milestones}}
 				<li class="item">
-					<div class="df ac sb">
-						<h2 class="df ac m-0 fw">
-							{{svg "octicon-milestone" 16 "mr-3"}}<a class="muted" href="{{$.RepoLink}}/milestone/{{.ID}}">{{.Name}}</a>
-						</h2>
-						<div class="df ac">
-							<span class="mr-3">{{.Completeness}}%</span>
+					<div class="gt-df gt-ac gt-sb">
+						<h3 class="gt-df gt-ac gt-m-0 gt-fw">
+							{{svg "octicon-milestone" 16 "gt-mr-3"}}<a class="muted" href="{{$.RepoLink}}/milestone/{{.ID}}">{{.Name}}</a>
+						</h3>
+						<div class="gt-df gt-ac">
+							<span class="gt-mr-3">{{.Completeness}}%</span>
 							<progress value="{{.Completeness}}" max="100"></progress>
 						</div>
 					</div>
@@ -83,9 +83,9 @@
 							{{end}}
 						{{end}}
 						<span class="issue-stats">
-							{{svg "octicon-issue-opened" 16 "mr-3"}}
+							{{svg "octicon-issue-opened" 16 "gt-mr-3"}}
 							{{JsPrettyNumber .NumOpenIssues}}&nbsp;{{$.locale.Tr "repo.issues.open_title"}}
-							{{svg "octicon-check" 16 "mr-3"}}
+							{{svg "octicon-check" 16 "gt-mr-3"}}
 							{{JsPrettyNumber .NumClosedIssues}}&nbsp;{{$.locale.Tr "repo.issues.closed_title"}}
 							{{if .TotalTrackedTime}}{{svg "octicon-clock"}} {{.TotalTrackedTime|Sec2Time}}{{end}}
 							{{if .UpdatedUnix}}{{svg "octicon-clock"}} {{$.locale.Tr "repo.milestones.update_ago" (.TimeSinceUpdate|Sec2Time)}}{{end}}
diff --git a/templates/repo/issue/navbar.tmpl b/templates/repo/issue/navbar.tmpl
index 1e5767965..fce835d66 100644
--- a/templates/repo/issue/navbar.tmpl
+++ b/templates/repo/issue/navbar.tmpl
@@ -1,4 +1,4 @@
-<div class="ui compact left small menu">
+<h2 class="ui compact small menu header">
 	<a class="{{if .PageIsLabels}}active {{end}}item" href="{{.RepoLink}}/labels">{{.locale.Tr "repo.labels"}}</a>
 	<a class="{{if .PageIsMilestones}}active {{end}}item" href="{{.RepoLink}}/milestones">{{.locale.Tr "repo.milestones"}}</a>
-</div>
+</h2>
diff --git a/templates/repo/issue/new_form.tmpl b/templates/repo/issue/new_form.tmpl
index ed1fd4778..8346d07a1 100644
--- a/templates/repo/issue/new_form.tmpl
+++ b/templates/repo/issue/new_form.tmpl
@@ -8,7 +8,7 @@
 	<div class="twelve wide column">
 		<div class="ui comments">
 			<div class="comment">
-				{{template "shared/user/avatarlink" .SignedUser}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .SignedUser}}
 				<div class="ui segment content">
 					<div class="field">
 						<input name="title" id="issue_title" placeholder="{{.locale.Tr "repo.milestones.title"}}" value="{{if .TitleQuery}}{{.TitleQuery}}{{else if .IssueTemplateTitle}}{{.IssueTemplateTitle}}{{else}}{{.title}}{{end}}" tabindex="3" autofocus required maxlength="255" autocomplete="off">
@@ -47,20 +47,32 @@
 					<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_labels_title"}}</div>
 					{{if or .Labels .OrgLabels}}
 					<div class="ui icon search input">
-						<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+						<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 						<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_labels"}}">
 					</div>
 					{{end}}
 					<div class="no-select item">{{.locale.Tr "repo.issues.new.clear_labels"}}</div>
 					{{if or .Labels .OrgLabels}}
+						{{$previousExclusiveScope := "_no_scope"}}
 						{{range .Labels}}
-							<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{svg "octicon-check"}}</span><span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
+							{{$exclusiveScope := .ExclusiveScope}}
+							{{if and (ne $previousExclusiveScope "_no_scope") (ne $previousExclusiveScope $exclusiveScope)}}
+								<div class="ui divider"></div>
+							{{end}}
+							{{$previousExclusiveScope = $exclusiveScope}}
+							<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}" data-scope="{{$exclusiveScope}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}</span>&nbsp;&nbsp;{{RenderLabel .}}
 							{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji}}</small>{{end}}</a>
 						{{end}}
 
 						<div class="ui divider"></div>
+						{{$previousExclusiveScope := "_no_scope"}}
 						{{range .OrgLabels}}
-							<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{svg "octicon-check"}}</span><span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
+							{{$exclusiveScope := .ExclusiveScope}}
+							{{if and (ne $previousExclusiveScope "_no_scope") (ne $previousExclusiveScope $exclusiveScope)}}
+								<div class="ui divider"></div>
+							{{end}}
+							{{$previousExclusiveScope = $exclusiveScope}}
+							<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}" data-scope="{{$exclusiveScope}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}</span>&nbsp;&nbsp;{{RenderLabel .}}
 							{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji}}</small>{{end}}</a>
 						{{end}}
 					{{else}}
@@ -84,7 +96,7 @@
 					<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_milestone_title"}}</div>
 					{{if or .OpenMilestones .ClosedMilestones}}
 					<div class="ui icon search input">
-						<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+						<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 						<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_milestones"}}">
 					</div>
 					{{end}}
@@ -101,7 +113,7 @@
 							</div>
 							{{range .OpenMilestones}}
 								<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
-									{{svg "octicon-milestone" 16 "mr-2"}}
+									{{svg "octicon-milestone" 16 "gt-mr-2"}}
 									{{.Name}}
 								</a>
 							{{end}}
@@ -113,7 +125,7 @@
 							</div>
 							{{range .ClosedMilestones}}
 								<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
-									{{svg "octicon-milestone" 16 "mr-2"}}
+									{{svg "octicon-milestone" 16 "gt-mr-2"}}
 									{{.Name}}
 								</a>
 							{{end}}
@@ -122,11 +134,11 @@
 				</div>
 			</div>
 			<div class="ui select-milestone list">
-				<span class="no-select item {{if .Milestone}}hide{{end}}">{{.locale.Tr "repo.issues.new.no_milestone"}}</span>
+				<span class="no-select item {{if .Milestone}}gt-hidden{{end}}">{{.locale.Tr "repo.issues.new.no_milestone"}}</span>
 				<div class="selected">
 					{{if .Milestone}}
 						<a class="item muted sidebar-item-link" href="{{.RepoLink}}/issues?milestone={{.Milestone.ID}}">
-							{{svg "octicon-milestone" 18 "mr-3"}}
+							{{svg "octicon-milestone" 18 "gt-mr-3"}}
 							{{.Milestone.Name}}
 						</a>
 					{{end}}
@@ -148,7 +160,7 @@
 					<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_project_title"}}</div>
 					{{if or .OpenProjects .ClosedProjects}}
 					<div class="ui icon search input">
-						<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+						<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 						<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_projects"}}">
 					</div>
 					{{end}}
@@ -165,7 +177,7 @@
 							</div>
 							{{range .OpenProjects}}
 								<a class="item muted sidebar-item-link" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">
-									{{svg "octicon-project" 18 "mr-3"}}
+									{{svg "octicon-project" 18 "gt-mr-3"}}
 									{{.Title}}
 								</a>
 							{{end}}
@@ -177,7 +189,7 @@
 							</div>
 							{{range .ClosedProjects}}
 								<a class="item muted sidebar-item-link" data-id="{{.ID}}" data-href="{{$.RepoLink}}/projects/{{.ID}}">
-									{{svg "octicon-project" 18 "mr-3"}}
+									{{svg "octicon-project" 18 "gt-mr-3"}}
 									{{.Title}}
 								</a>
 							{{end}}
@@ -186,11 +198,11 @@
 				</div>
 			</div>
 			<div class="ui select-project list">
-				<span class="no-select item {{if .Project}}hide{{end}}">{{.locale.Tr "repo.issues.new.no_projects"}}</span>
+				<span class="no-select item {{if .Project}}gt-hidden{{end}}">{{.locale.Tr "repo.issues.new.no_projects"}}</span>
 				<div class="selected">
 					{{if .Project}}
 						<a class="item muted sidebar-item-link" href="{{.RepoLink}}/projects/{{.Project.ID}}">
-							{{svg "octicon-project" 18 "mr-3"}}
+							{{svg "octicon-project" 18 "gt-mr-3"}}
 							{{.Project.Title}}
 						</a>
 					{{end}}
@@ -209,7 +221,7 @@
 					<div class="filter menu" data-id="#assignee_ids">
 						<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_assignees_title"}}</div>
 						<div class="ui icon search input">
-							<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+							<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 							<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_assignees"}}">
 						</div>
 						<div class="no-select item">{{.locale.Tr "repo.issues.new.clear_assignees"}}</div>
@@ -217,19 +229,19 @@
 							<a class="item muted" href="#" data-id="{{.ID}}" data-id-selector="#assignee_{{.ID}}">
 								<span class="octicon-check invisible">{{svg "octicon-check"}}</span>
 								<span class="text">
-									{{avatar . 28 "mr-3"}}{{.GetDisplayName}}
+									{{avatar $.Context . 28 "gt-mr-3"}}{{.GetDisplayName}}
 								</span>
 							</a>
 						{{end}}
 					</div>
 				</div>
 				<div class="ui assignees list">
-					<span class="no-select item {{if .HasSelectedLabel}}hide{{end}}">
+					<span class="no-select item {{if .HasSelectedLabel}}gt-hidden{{end}}">
 						{{.locale.Tr "repo.issues.new.no_assignees"}}
 					</span>
 					{{range .Assignees}}
-						<a class="hide item p-2 muted" id="assignee_{{.ID}}" href="{{$.RepoLink}}/issues?assignee={{.ID}}">
-							{{avatar . 28 "mr-3 vm"}}{{.GetDisplayName}}
+						<a class="item gt-p-2 muted gt-hidden" id="assignee_{{.ID}}" href="{{$.RepoLink}}/issues?assignee={{.ID}}">
+							{{avatar $.Context . 28 "gt-mr-3 gt-vm"}}{{.GetDisplayName}}
 						</a>
 					{{end}}
 				</div>
@@ -238,7 +250,7 @@
 				<div class="inline field">
 					<div class="ui checkbox">
 						<label class="tooltip" data-content="{{.locale.Tr "repo.pulls.allow_edits_from_maintainers_desc"}}"><strong>{{.locale.Tr "repo.pulls.allow_edits_from_maintainers"}}</strong></label>
-						<input name="allow_maintainer_edit" type="checkbox">
+						<input name="allow_maintainer_edit" type="checkbox" {{if .AllowMaintainerEdit}}checked{{end}}>
 					</div>
 				</div>
 			{{end}}
diff --git a/templates/repo/issue/openclose.tmpl b/templates/repo/issue/openclose.tmpl
index 9299fe1cb..e2c13fea1 100644
--- a/templates/repo/issue/openclose.tmpl
+++ b/templates/repo/issue/openclose.tmpl
@@ -1,14 +1,14 @@
 <div class="ui compact tiny menu">
 	<a class="{{if not .IsShowClosed}}active {{end}}item" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&sort={{$.SortType}}&state=open&labels={{.SelectLabels}}&milestone={{.MilestoneID}}&project={{.ProjectID}}&assignee={{.AssigneeID}}&poster={{.PosterID}}">
 		{{if .PageIsPullList}}
-			{{svg "octicon-git-pull-request" 16 "mr-3"}}
+			{{svg "octicon-git-pull-request" 16 "gt-mr-3"}}
 		{{else}}
-			{{svg "octicon-issue-opened" 16 "mr-3"}}
+			{{svg "octicon-issue-opened" 16 "gt-mr-3"}}
 		{{end}}
 		{{JsPrettyNumber .IssueStats.OpenCount}}&nbsp;{{.locale.Tr "repo.issues.open_title"}}
 	</a>
 	<a class="{{if .IsShowClosed}}active {{end}}item" href="{{$.Link}}?q={{$.Keyword}}&type={{.ViewType}}&sort={{$.SortType}}&state=closed&labels={{.SelectLabels}}&milestone={{.MilestoneID}}&project={{.ProjectID}}&assignee={{.AssigneeID}}&poster={{.PosterID}}">
-		{{svg "octicon-check" 16 "mr-3"}}
+		{{svg "octicon-check" 16 "gt-mr-3"}}
 		{{JsPrettyNumber .IssueStats.ClosedCount}}&nbsp;{{.locale.Tr "repo.issues.closed_title"}}
 	</a>
 </div>
diff --git a/templates/repo/issue/view_content.tmpl b/templates/repo/issue/view_content.tmpl
index 7b318d51f..887dd2c42 100644
--- a/templates/repo/issue/view_content.tmpl
+++ b/templates/repo/issue/view_content.tmpl
@@ -23,14 +23,14 @@
 				<span class="timeline-avatar"><img src="{{AppSubUrl}}/assets/img/avatar_default.png"></span>
 			{{else}}
 				<a class="timeline-avatar" {{if gt .Issue.Poster.ID 0}}href="{{.Issue.Poster.HomeLink}}"{{end}}>
-					{{avatar .Issue.Poster}}
+					{{avatar $.Context .Issue.Poster}}
 				</a>
 			{{end}}
 				<div class="content comment-container">
-					<div class="ui top attached header comment-header df ac sb">
-						<div class="comment-header-left df ac">
+					<div class="ui top attached header comment-header gt-df gt-ac gt-sb">
+						<div class="comment-header-left gt-df gt-ac">
 							{{if .Issue.OriginalAuthor}}
-								<span class="text black bold">
+								<span class="text black gt-bold">
 									{{svg (MigrationIcon .Repository.GetOriginalURLHostname)}}
 									{{.Issue.OriginalAuthor}}
 								</span>
@@ -42,7 +42,7 @@
 								</span>
 							{{else}}
 								<a class="inline-timeline-avatar" href="{{.Issue.Poster.HomeLink}}">
-									{{avatar .Issue.Poster}}
+									{{avatar $.Context .Issue.Poster}}
 								</a>
 								<span class="text grey">
 									{{template "shared/user/authorlink" .Issue.Poster}}
@@ -50,7 +50,7 @@
 								</span>
 							{{end}}
 						</div>
-						<div class="comment-header-right actions df ac">
+						<div class="comment-header-right actions gt-df gt-ac">
 							{{if gt .Issue.ShowRole 0}}
 								{{if (.Issue.ShowRole.HasRole "Writer")}}
 									<div class="ui basic label role-label">
@@ -77,8 +77,8 @@
 								<span class="no-content">{{.locale.Tr "repo.issues.no_content"}}</span>
 							{{end}}
 						</div>
-						<div id="issue-{{.Issue.ID}}-raw" class="raw-content hide">{{.Issue.Content}}</div>
-						<div class="edit-content-zone hide" data-write="issue-{{.Issue.ID}}-write" data-preview="issue-{{.Issue.ID}}-preview" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/content" data-context="{{.RepoLink}}" data-attachment-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/attachments" data-view-attachment-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/view-attachments"></div>
+						<div id="issue-{{.Issue.ID}}-raw" class="raw-content gt-hidden">{{.Issue.Content}}</div>
+						<div class="edit-content-zone gt-hidden" data-write="issue-{{.Issue.ID}}-write" data-preview="issue-{{.Issue.ID}}-preview" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/content" data-context="{{.RepoLink}}" data-attachment-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/attachments" data-view-attachment-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/view-attachments"></div>
 						{{if .Issue.Attachments}}
 							{{template "repo/issue/view_content/attachments" Dict "ctx" $ "Attachments" .Issue.Attachments "Content" .Issue.RenderedContent}}
 						{{end}}
@@ -101,7 +101,7 @@
 				{{if and (or .IsRepoAdmin .HasIssuesOrPullsWritePermission (not .Issue.IsLocked)) (not .Repository.IsArchived)}}
 				<div class="timeline-item comment form">
 					<a class="timeline-avatar" href="{{.SignedUser.HomeLink}}">
-						{{avatar .SignedUser}}
+						{{avatar $.Context .SignedUser}}
 					</a>
 					<div class="content">
 						<form class="ui segment form" id="comment-form" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/comments" method="post">
@@ -152,7 +152,7 @@
 					{{if .Repository.IsArchived}}
 					<div class="timeline-item comment form">
 						<a class="timeline-avatar" href="{{.SignedUser.HomeLink}}">
-							{{avatar .SignedUser}}
+							{{avatar $.Context .SignedUser}}
 						</a>
 						<div class="content">
 							<form class="ui segment form" id="comment-form" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/comments" method="post">
@@ -194,7 +194,7 @@
 	{{template "repo/issue/view_content/sidebar" .}}
 </div>
 
-<div class="hide" id="edit-content-form">
+<div class="gt-hidden" id="edit-content-form">
 	<div class="ui comment form">
 		<div class="ui top tabular menu">
 			<a class="active write item">{{$.locale.Tr "write"}}</a>
@@ -224,7 +224,7 @@
 
 {{template "repo/issue/view_content/reference_issue_dialog" .}}
 
-<div class="hide" id="no-content">
+<div class="gt-hidden" id="no-content">
 	<span class="no-content">{{.locale.Tr "repo.issues.no_content"}}</span>
 </div>
 
diff --git a/templates/repo/issue/view_content/comments.tmpl b/templates/repo/issue/view_content/comments.tmpl
index 37aa82345..b81c3c7f0 100644
--- a/templates/repo/issue/view_content/comments.tmpl
+++ b/templates/repo/issue/view_content/comments.tmpl
@@ -18,14 +18,14 @@
 				<span class="timeline-avatar"><img src="{{AppSubUrl}}/assets/img/avatar_default.png"></span>
 			{{else}}
 				<a class="timeline-avatar"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
-					{{avatar .Poster}}
+					{{avatar $.Context .Poster}}
 				</a>
 			{{end}}
 				<div class="content comment-container">
-					<div class="ui top attached header comment-header df ac sb">
-						<div class="comment-header-left df ac">
+					<div class="ui top attached header comment-header gt-df gt-ac gt-sb">
+						<div class="comment-header-left gt-df gt-ac">
 							{{if .OriginalAuthor}}
-								<span class="text black bold mr-2">
+								<span class="text black gt-bold gt-mr-2">
 									{{svg (MigrationIcon $.Repository.GetOriginalURLHostname)}}
 									{{.OriginalAuthor}}
 								</span>
@@ -38,7 +38,7 @@
 							{{else}}
 								{{if gt .Poster.ID 0}}
 									<a class="inline-timeline-avatar" href="{{.Poster.HomeLink}}">
-										{{avatar .Poster}}
+										{{avatar $.Context .Poster}}
 									</a>
 								{{end}}
 								<span class="text grey muted-links">
@@ -47,7 +47,7 @@
 								</span>
 							{{end}}
 						</div>
-						<div class="comment-header-right actions df ac">
+						<div class="comment-header-right actions gt-df gt-ac">
 							{{if (.ShowRole.HasRole "Poster")}}
 								<div class="ui basic label">
 									{{$.locale.Tr "repo.issues.poster"}}
@@ -77,8 +77,8 @@
 								<span class="no-content">{{$.locale.Tr "repo.issues.no_content"}}</span>
 							{{end}}
 						</div>
-						<div id="issuecomment-{{.ID}}-raw" class="raw-content hide">{{.Content}}</div>
-						<div class="edit-content-zone hide" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.RepoLink}}/comments/{{.ID}}" data-context="{{$.RepoLink}}" data-attachment-url="{{$.RepoLink}}/comments/{{.ID}}/attachments"></div>
+						<div id="issuecomment-{{.ID}}-raw" class="raw-content gt-hidden">{{.Content}}</div>
+						<div class="edit-content-zone gt-hidden" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.RepoLink}}/comments/{{.ID}}" data-context="{{$.RepoLink}}" data-attachment-url="{{$.RepoLink}}/comments/{{.ID}}/attachments"></div>
 						{{if .Attachments}}
 							{{template "repo/issue/view_content/attachments" Dict "ctx" $ "Attachments" .Attachments "Content" .RenderedContent}}
 						{{end}}
@@ -93,8 +93,8 @@
 			</div>
 		{{else if eq .Type 1}}
 			<div class="timeline-item event" id="{{.HashTag}}">
-				<span class="badge bg-green text-white">{{svg "octicon-dot-fill"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				<span class="badge gt-bg-green gt-text-white">{{svg "octicon-dot-fill"}}</span>
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{if .Issue.IsPull}}
@@ -106,8 +106,8 @@
 			</div>
 		{{else if eq .Type 2}}
 			<div class="timeline-item event" id="{{.HashTag}}">
-				<span class="badge bg-red text-white">{{svg "octicon-circle-slash"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				<span class="badge gt-bg-red gt-text-white">{{svg "octicon-circle-slash"}}</span>
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{if .Issue.IsPull}}
@@ -119,8 +119,8 @@
 			</div>
 		{{else if eq .Type 28}}
 			<div class="timeline-item event" id="{{.HashTag}}">
-				<span class="badge bg-purple text-white">{{svg "octicon-git-merge"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				<span class="badge gt-bg-purple gt-text-white">{{svg "octicon-git-merge"}}</span>
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$link := printf "%s/commit/%s" $.Repository.Link ($.Issue.PullRequest.MergedCommitID|PathEscape)}}
@@ -147,7 +147,7 @@
 			{{$createdStr:= TimeSinceUnix .CreatedUnix $.locale}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-bookmark"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				{{if eq .RefAction 3}}<del>{{end}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
@@ -162,7 +162,7 @@
 		{{else if eq .Type 4}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-bookmark"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.commit_ref_at" .EventTag $createdStr | Safe}}
@@ -176,7 +176,7 @@
 			{{if or .AddedLabels .RemovedLabels}}
 				<div class="timeline-item event" id="{{.HashTag}}">
 					<span class="badge">{{svg "octicon-tag"}}</span>
-					{{template "shared/user/avatarlink" .Poster}}
+					{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 					<span class="text grey muted-links">
 						{{template "shared/user/authorlink" .Poster}}
 						{{if and .AddedLabels (not .RemovedLabels)}}
@@ -192,7 +192,7 @@
 		{{else if eq .Type 8}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-milestone"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{if gt .OldMilestoneID 0}}{{if gt .MilestoneID 0}}{{$.locale.Tr "repo.issues.change_milestone_at" (.OldMilestone.Name|Escape) (.Milestone.Name|Escape) $createdStr | Safe}}{{else}}{{$.locale.Tr "repo.issues.remove_milestone_at" (.OldMilestone.Name|Escape) $createdStr | Safe}}{{end}}{{else if gt .MilestoneID 0}}{{$.locale.Tr "repo.issues.add_milestone_at" (.Milestone.Name|Escape) $createdStr | Safe}}{{end}}
@@ -203,7 +203,7 @@
 				<span class="badge">{{svg "octicon-person"}}</span>
 				{{if gt .AssigneeID 0}}
 					{{if .RemovedAssignee}}
-						{{template "shared/user/avatarlink" .Assignee}}
+						{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Assignee}}
 						<span class="text grey muted-links">
 							{{template "shared/user/authorlink" .Assignee}}
 							{{if eq .Poster.ID .Assignee.ID}}
@@ -213,7 +213,7 @@
 							{{end}}
 						</span>
 					{{else}}
-						{{template "shared/user/avatarlink" .Assignee}}
+						{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Assignee}}
 						<span class="text grey muted-links">
 							{{template "shared/user/authorlink" .Assignee}}
 							{{if eq .Poster.ID .AssigneeID}}
@@ -228,7 +228,7 @@
 		{{else if eq .Type 10}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-pencil"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.change_title_at" (.OldTitle|RenderEmoji) (.NewTitle|RenderEmoji) $createdStr | Safe}}
@@ -237,7 +237,7 @@
 		{{else if eq .Type 11}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-git-branch"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.delete_branch_at" (.OldRef|Escape) $createdStr | Safe}}
@@ -246,7 +246,7 @@
 		{{else if eq .Type 12}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-clock"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.start_tracking_history"  $createdStr | Safe}}
@@ -255,7 +255,7 @@
 		{{else if eq .Type 13}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-clock"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.stop_tracking_history"  $createdStr | Safe}}
@@ -269,7 +269,7 @@
 		{{else if eq .Type 14}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-clock"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.add_time_history"  $createdStr | Safe}}
@@ -283,7 +283,7 @@
 		{{else if eq .Type 15}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-clock"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.cancel_tracking_history"  $createdStr | Safe}}
@@ -292,7 +292,7 @@
 		{{else if eq .Type 16}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-clock"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.due_date_added" .Content $createdStr | Safe}}
@@ -301,7 +301,7 @@
 		{{else if eq .Type 17}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-clock"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$parsedDeadline := .Content | ParseDeadline}}
@@ -311,7 +311,7 @@
 		{{else if eq .Type 18}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-clock"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.due_date_remove" .Content $createdStr | Safe}}
@@ -320,7 +320,7 @@
 		{{else if eq .Type 19}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-package-dependents"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.dependency.added_dependency" $createdStr | Safe}}
@@ -343,7 +343,7 @@
 		{{else if eq .Type 20}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-package-dependents"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.dependency.removed_dependency" $createdStr | Safe}}
@@ -369,10 +369,10 @@
 					{{if .OriginalAuthor}}
 					{{else}}
 					<a class="timeline-avatar"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
-						{{avatar .Poster}}
+						{{avatar $.Context .Poster}}
 					</a>
 					{{end}}
-					<span class="badge{{if eq .Review.Type 1}} bg-green text-white{{else if eq .Review.Type 3}} bg-red text-white{{end}}">{{svg (printf "octicon-%s" .Review.Type.Icon)}}</span>
+					<span class="badge{{if eq .Review.Type 1}} gt-bg-green gt-text-white{{else if eq .Review.Type 3}} gt-bg-red gt-text-white{{end}}">{{svg (printf "octicon-%s" .Review.Type.Icon)}}</span>
 					<span class="text grey muted-links">
 						{{if .OriginalAuthor}}
 							<span class="text black">
@@ -402,11 +402,11 @@
 				{{if .Content}}
 				<div class="timeline-item comment" id="{{.HashTag}}">
 					<div class="content comment-container">
-						<div class="ui top attached header comment-header df ac sb">
-							<div class="comment-header-left df ac">
+						<div class="ui top attached header comment-header gt-df gt-ac gt-sb">
+							<div class="comment-header-left gt-df gt-ac">
 								<span class="text grey muted-links">
 									{{if .OriginalAuthor}}
-										<span class="text black bold">
+										<span class="text black gt-bold">
 											{{svg (MigrationIcon $.Repository.GetOriginalURLHostname)}}
 											{{.OriginalAuthor}}
 										</span>
@@ -419,7 +419,7 @@
 									{{$.locale.Tr "repo.issues.review.left_comment" | Safe}}
 								</span>
 							</div>
-							<div class="comment-header-right actions df ac">
+							<div class="comment-header-right actions gt-df gt-ac">
 									{{if (.ShowRole.HasRole "Poster")}}
 										<div class="ui basic label">
 												{{$.locale.Tr "repo.issues.poster"}}
@@ -449,8 +449,8 @@
 									<span class="no-content">{{$.locale.Tr "repo.issues.no_content"}}</span>
 								{{end}}
 							</div>
-							<div id="issuecomment-{{.ID}}-raw" class="raw-content hide">{{.Content}}</div>
-							<div class="edit-content-zone hide" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.RepoLink}}/comments/{{.ID}}" data-context="{{$.RepoLink}}" data-attachment-url="{{$.RepoLink}}/comments/{{.ID}}/attachments"></div>
+							<div id="issuecomment-{{.ID}}-raw" class="raw-content gt-hidden">{{.Content}}</div>
+							<div class="edit-content-zone gt-hidden" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.RepoLink}}/comments/{{.ID}}" data-context="{{$.RepoLink}}" data-attachment-url="{{$.RepoLink}}/comments/{{.ID}}/attachments"></div>
 							{{if .Attachments}}
 								{{template "repo/issue/view_content/attachments" Dict "ctx" $ "Attachments" .Attachments "Content" .RenderedContent}}
 							{{end}}
@@ -470,31 +470,31 @@
 					{{range $filename, $lines := .Review.CodeComments}}
 						{{range $line, $comms := $lines}}
 								<div class="ui segments">
-									<div class="ui segment py-3 df ac sb">
+									<div class="ui segment gt-py-3 gt-df gt-ac gt-sb">
 										{{$invalid := (index $comms 0).Invalidated}}
 										{{$resolved := (index $comms 0).IsResolved}}
 										{{$resolveDoer := (index $comms 0).ResolveDoer}}
 										{{$isNotPending := (not (eq (index $comms 0).Review.Type 0))}}
-										<div class="df ac">
-											<a href="{{(index $comms 0).CodeCommentLink}}" class="file-comment ml-3 word-break">{{$filename}}</a>
+										<div class="gt-df gt-ac">
+											<a href="{{(index $comms 0).CodeCommentLink}}" class="file-comment gt-ml-3 gt-word-break">{{$filename}}</a>
 											{{if $invalid}}
-												<span class="ui label basic small ml-3">
+												<span class="ui label basic small gt-ml-3">
 													{{$.locale.Tr "repo.issues.review.outdated"}}
 												</span>
 											{{end}}
 										</div>
 										<div>
 											{{if or $invalid $resolved}}
-												<button id="show-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="{{if not $resolved}}hide {{end}}ui compact right labeled button show-outdated df ac">
-													{{svg "octicon-unfold" 16 "mr-3"}}
+												<button id="show-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="{{if not $resolved}}gt-hidden {{end}}ui compact right labeled button show-outdated gt-df gt-ac">
+													{{svg "octicon-unfold" 16 "gt-mr-3"}}
 													{{if $resolved}}
 														{{$.locale.Tr "repo.issues.review.show_resolved"}}
 													{{else}}
 														{{$.locale.Tr "repo.issues.review.show_outdated"}}
 													{{end}}
 												</button>
-												<button id="hide-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="{{if $resolved}}hide {{end}}ui compact right labeled button hide-outdated df ac">
-													{{svg "octicon-fold" 16 "mr-3"}}
+												<button id="hide-outdated-{{(index $comms 0).ID}}" data-comment="{{(index $comms 0).ID}}" class="{{if $resolved}}gt-hidden {{end}}ui compact right labeled button hide-outdated gt-df gt-ac">
+													{{svg "octicon-fold" 16 "gt-mr-3"}}
 													{{if $resolved}}
 														{{$.locale.Tr "repo.issues.review.hide_resolved"}}
 													{{else}}
@@ -507,7 +507,7 @@
 									{{$diff := (CommentMustAsDiff (index $comms 0))}}
 									{{if $diff}}
 										{{$file := (index $diff.Files 0)}}
-										<div id="code-preview-{{(index $comms 0).ID}}" class="ui table segment{{if $resolved}} hide{{end}}">
+										<div id="code-preview-{{(index $comms 0).ID}}" class="ui table segment{{if $resolved}} gt-hidden{{end}}">
 											<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}}">
 												<div class="file-body file-code code-view code-diff code-diff-unified unicode-escaped">
 													<table>
@@ -519,22 +519,22 @@
 											</div>
 										</div>
 									{{end}}
-									<div id="code-comments-{{(index $comms 0).ID}}" class="comment-code-cloud ui segment{{if $resolved}} hide{{end}}">
-										<div class="ui comments mb-0">
+									<div id="code-comments-{{(index $comms 0).ID}}" class="comment-code-cloud ui segment{{if $resolved}} gt-hidden{{end}}">
+										<div class="ui comments gt-mb-0">
 											{{range $comms}}
 												{{$createdSubStr:= TimeSinceUnix .CreatedUnix $.locale}}
-												<div class="comment code-comment pb-4" id="{{.HashTag}}">
+												<div class="comment code-comment gt-pb-4" id="{{.HashTag}}">
 													<div class="content">
 														<div class="header comment-header">
-															<div class="comment-header-left df ac">
+															<div class="comment-header-left gt-df gt-ac">
 																{{if not .OriginalAuthor}}
 																	<a class="avatar">
-																		{{avatar .Poster}}
+																		{{avatar $.Context .Poster}}
 																	</a>
 																{{end}}
 																<span class="text grey muted-links">
 																	{{if .OriginalAuthor}}
-																		<span class="text black bold">
+																		<span class="text black gt-bold">
 																			{{svg (MigrationIcon $.Repository.GetOriginalURLHostname)}}
 																			{{.OriginalAuthor}}
 																		</span>
@@ -546,7 +546,7 @@
 																	{{$.locale.Tr "repo.issues.commented_at" (.HashTag|Escape) $createdSubStr | Safe}}
 																</span>
 															</div>
-															<div class="comment-header-right actions df ac">
+															<div class="comment-header-right actions gt-df gt-ac">
 																{{if (.ShowRole.HasRole "Poster")}}
 																	<div class="ui basic label">
 																		{{$.locale.Tr "repo.issues.poster"}}
@@ -576,8 +576,8 @@
 																<span class="no-content">{{$.locale.Tr "repo.issues.no_content"}}</span>
 															{{end}}
 															</div>
-															<div id="issuecomment-{{.ID}}-raw" class="raw-content hide">{{.Content}}</div>
-															<div class="edit-content-zone hide" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.RepoLink}}/comments/{{.ID}}" data-context="{{$.RepoLink}}" data-attachment-url="{{$.RepoLink}}/comments/{{.ID}}/attachments"></div>
+															<div id="issuecomment-{{.ID}}-raw" class="raw-content gt-hidden">{{.Content}}</div>
+															<div class="edit-content-zone gt-hidden" data-write="issuecomment-{{.ID}}-write" data-preview="issuecomment-{{.ID}}-preview" data-update-url="{{$.RepoLink}}/comments/{{.ID}}" data-context="{{$.RepoLink}}" data-attachment-url="{{$.RepoLink}}/comments/{{.ID}}/attachments"></div>
 														</div>
 														{{$reactions := .Reactions.GroupByType}}
 														{{if $reactions}}
@@ -589,11 +589,11 @@
 												</div>
 											{{end}}
 										</div>
-										<div class="code-comment-buttons df ac fw mt-3 mb-2 mx-3">
-											<div class="f1">
+										<div class="code-comment-buttons gt-df gt-ac gt-fw gt-mt-3 gt-mb-2 gt-mx-3">
+											<div class="gt-f1">
 												{{if $resolved}}
 													<div class="ui grey text">
-														{{svg "octicon-check" 16 "mr-2"}}
+														{{svg "octicon-check" 16 "gt-mr-2"}}
 														<b>{{$resolveDoer.Name}}</b> {{$.locale.Tr "repo.issues.review.resolved_by"}}
 													</div>
 												{{end}}
@@ -609,8 +609,8 @@
 													</button>
 												{{end}}
 												{{if and $.SignedUserID (not $.Repository.IsArchived)}}
-													<button class="comment-form-reply ui green tiny labeled icon button ml-2 mr-0">
-														{{svg "octicon-reply" 16 "reply icon mr-2"}}{{$.locale.Tr "repo.diff.comment.reply"}}
+													<button class="comment-form-reply ui green tiny labeled icon button gt-ml-2 gt-mr-0">
+														{{svg "octicon-reply" 16 "reply icon gt-mr-2"}}{{$.locale.Tr "repo.diff.comment.reply"}}
 													</button>
 												{{end}}
 											</div>
@@ -626,7 +626,7 @@
 		{{else if eq .Type 23}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-lock"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				{{if .Content}}
 					<span class="text grey muted-links">
 						{{template "shared/user/authorlink" .Poster}}
@@ -642,7 +642,7 @@
 		{{else if eq .Type 24}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-key"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{$.locale.Tr "repo.issues.unlock_comment" $createdStr | Safe}}
@@ -651,7 +651,7 @@
 		{{else if eq .Type 25}}
 			<div class="timeline-item event">
 				<span class="badge">{{svg "octicon-git-branch"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					<a{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>{{.Poster.Name}}</a>
 					{{$.locale.Tr "repo.pulls.change_target_branch_at" (.OldRef|Escape) (.NewRef|Escape) $createdStr | Safe}}
@@ -660,7 +660,7 @@
 		{{else if eq .Type 26}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-clock"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 
@@ -674,7 +674,7 @@
 		{{else if eq .Type 27}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-eye"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{if (gt .AssigneeID 0)}}
@@ -715,7 +715,7 @@
 			{{if not $.UnitProjectsGlobalDisabled}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-project"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{if gt .OldProjectID 0}}
@@ -734,7 +734,7 @@
 			<div class="timeline-item-group">
 				<div class="timeline-item event" id="{{.HashTag}}">
 					<a class="timeline-avatar"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
-						<img src="{{.Poster.AvatarLink}}">
+						<img src="{{.Poster.AvatarLink $.Context}}">
 					</a>
 					<span class="badge grey">{{svg "octicon-x" 16}}</span>
 					<span class="text grey muted-links">
@@ -772,7 +772,7 @@
 		{{else if eq .Type 33}}
 			<div class="timeline-item event" id="{{.HashTag}}">
 				<span class="badge">{{svg "octicon-git-branch"}}</span>
-				{{template "shared/user/avatarlink" .Poster}}
+				{{template "shared/user/avatarlink" Dict "Context" $.Context "user" .Poster}}
 				<span class="text grey muted-links">
 					{{template "shared/user/authorlink" .Poster}}
 					{{if and .OldRef .NewRef}}
diff --git a/templates/repo/issue/view_content/pull.tmpl b/templates/repo/issue/view_content/pull.tmpl
index f32c278b6..cbcc163df 100644
--- a/templates/repo/issue/view_content/pull.tmpl
+++ b/templates/repo/issue/view_content/pull.tmpl
@@ -10,10 +10,10 @@
 						<div class="review-item-left">
 							{{if .User}}
 								<a href="{{.User.HomeLink}}">
-									{{avatar .User}}
+									{{avatar $.Context .User}}
 								</a>
 							{{end}}
-							<span>
+							<span class="gt-ml-2">
 								{{if .User}}
 									<a href="{{.User.HomeLink}}">{{.User.GetDisplayName}}</a>
 								{{else if .Team}}
@@ -167,9 +167,11 @@
 				<div class="item text">
 					{{svg "octicon-x"}}
 					{{$.locale.Tr "repo.pulls.files_conflicted"}}
-					{{range .ConflictedFiles}}
-						<div>{{.}}</div>
-					{{end}}
+					<ul>
+						{{range .ConflictedFiles}}
+							<li>{{.}}</li>
+						{{end}}
+					</ul>
 				</div>
 			{{else if .IsPullRequestBroken}}
 				<div class="item">
@@ -177,7 +179,7 @@
 					{{$.locale.Tr "repo.pulls.data_broken"}}
 				</div>
 			{{else if .IsPullWorkInProgress}}
-				<div class="item toggle-wip df ac sb" data-title="{{.Issue.Title}}" data-wip-prefix="{{(.WorkInProgressPrefix|Escape)}}" data-update-url="{{.Issue.Link}}/title">
+				<div class="item toggle-wip gt-df gt-ac gt-sb" data-title="{{.Issue.Title}}" data-wip-prefix="{{(.WorkInProgressPrefix|Escape)}}" data-update-url="{{.Issue.Link}}/title">
 					<div>
 						<i class="icon icon-octicon">{{svg "octicon-x"}}</i>
 						{{$.locale.Tr "repo.pulls.cannot_merge_work_in_progress"}}
@@ -226,11 +228,11 @@
 					<div class="item">
 						<i class="icon icon-octicon">{{svg "octicon-x" 16}}</i>
 						{{$.locale.TrN $.ChangedProtectedFilesNum "repo.pulls.blocked_by_changed_protected_files_1" "repo.pulls.blocked_by_changed_protected_files_n" | Safe}}
-						<div class="ui ordered list">
+						<ul>
 							{{range .ChangedProtectedFiles}}
-								<div data-value="-" class="item">{{.}}</div>
+								<li>{{.}}</li>
 							{{end}}
-						</div>
+						</ul>
 					</div>
 				{{else if and .EnableStatusCheck (or .RequiredStatusCheckState.IsError .RequiredStatusCheckState.IsFailure)}}
 					<div class="item">
@@ -333,7 +335,7 @@
 								'hasPendingPullRequestMergeTip': {{$hasPendingPullRequestMergeTip}},
 							};
 
-							const generalHideAutoMerge = mergeForm.canMergeNow && mergeForm.allOverridableChecksOk; // if this PR can be merged now, then hide the auto merge
+							const generalHideAutoMerge = mergeForm.canMergeNow && mergeForm.allOverridableChecksOk; // if this pr can be merged now, then hide the auto merge
 							mergeForm['mergeStyles'] = [
 								{
 									'name': 'merge',
@@ -378,10 +380,6 @@
 						</script>
 
 						<div id="pull-request-merge-form"></div>
-
-						{{if .ShowMergeInstructions}}
-							{{template "repo/issue/view_content/pull_merge_instruction" (dict "locale" .locale "Issue" .Issue)}}
-						{{end}}
 					{{else}}
 						{{/* no merge style was set in repo setting: not or ($prUnit.PullRequestsConfig.AllowMerge ...) */}}
 						<div class="ui divider"></div>
@@ -428,11 +426,11 @@
 					<div class="item text red">
 						<i class="icon icon-octicon">{{svg "octicon-x" 16}}</i>
 						{{$.locale.TrN $.ChangedProtectedFilesNum "repo.pulls.blocked_by_changed_protected_files_1" "repo.pulls.blocked_by_changed_protected_files_n" | Safe}}
-						<div class="ui ordered list">
+						<ul>
 							{{range .ChangedProtectedFiles}}
-								<div data-value="-" class="item">{{.}}</div>
+								<li>{{.}}</li>
 							{{end}}
-						</div>
+						</ul>
 					</div>
 				{{else if and .EnableStatusCheck (not .RequiredStatusCheckState.IsSuccess)}}
 					<div class="item text red">
@@ -458,7 +456,7 @@
 
 			{{if $.StillCanManualMerge}}
 				<div class="ui divider"></div>
-				<div class="ui form manually-merged-fields" style="display: none">
+				<div class="ui form manually-merged-fields gt-hidden">
 					<form action="{{.Link}}/merge" method="post">
 						{{.CsrfTokenHtml}}
 						<div class="field">
@@ -479,6 +477,10 @@
 					</button>
 				</div>
 			{{end}}
+
+			{{if and .ShowMergeInstructions .Issue.PullRequest.HeadRepo}}
+				{{template "repo/issue/view_content/pull_merge_instruction" (dict "locale" .locale "Issue" .Issue)}}
+			{{end}}
 		</div>
 	</div>
 </div>
diff --git a/templates/repo/issue/view_content/pull_merge_instruction.tmpl b/templates/repo/issue/view_content/pull_merge_instruction.tmpl
index 21bb3d8e7..78deed956 100644
--- a/templates/repo/issue/view_content/pull_merge_instruction.tmpl
+++ b/templates/repo/issue/view_content/pull_merge_instruction.tmpl
@@ -1,17 +1,16 @@
-<div class="instruct-toggle mt-3"> {{$.locale.Tr "repo.pulls.merge_instruction_hint" | Safe}} </div>
-<div class="instruct-content" style="display:none">
-	<div class="ui divider"></div>
-	<div><h3 class="di">{{$.locale.Tr "step1"}} </h3>{{$.locale.Tr "repo.pulls.merge_instruction_step1_desc"}}</div>
+<div class="ui divider"></div>
+<div class="instruct-toggle"> {{$.locale.Tr "repo.pulls.merge_instruction_hint" | Safe}} </div>
+<div class="instruct-content gt-mt-3 gt-hidden">
+	<div><h3 class="gt-di">{{$.locale.Tr "step1"}} </h3>{{$.locale.Tr "repo.pulls.merge_instruction_step1_desc"}}</div>
 	<div class="ui secondary segment">
 		{{if eq $.Issue.PullRequest.Flow 0}}
 		<div>git checkout -b {{if ne $.Issue.PullRequest.HeadRepo.ID $.Issue.PullRequest.BaseRepo.ID}}{{$.Issue.PullRequest.HeadRepo.OwnerName}}-{{end}}{{$.Issue.PullRequest.HeadBranch}} {{$.Issue.PullRequest.BaseBranch}}</div>
-		{{/* the only legacy HTMLURL used in template, which doesn't affect users too much and is very diffcult to fix, it should be fixed together with other AppUrl usages*/}}
-		<div>git pull {{if ne $.Issue.PullRequest.HeadRepo.ID $.Issue.PullRequest.BaseRepo.ID}}{{$.Issue.PullRequest.HeadRepo.HTMLURL}}{{else}}origin{{end}} {{$.Issue.PullRequest.HeadBranch}}</div>
+		<div>git pull {{if ne $.Issue.PullRequest.HeadRepo.ID $.Issue.PullRequest.BaseRepo.ID}}<gitea-origin-url data-url="{{$.Issue.PullRequest.HeadRepo.Link}}"></gitea-origin-url>{{else}}origin{{end}} {{$.Issue.PullRequest.HeadBranch}}</div>
 		{{else}}
 		<div>git fetch origin {{$.Issue.PullRequest.GetGitRefName}}:{{$.Issue.PullRequest.HeadBranch}}</div>
 		{{end}}
 	</div>
-	<div><h3 class="di">{{$.locale.Tr "step2"}} </h3>{{$.locale.Tr "repo.pulls.merge_instruction_step2_desc"}}</div>
+	<div><h3 class="gt-di">{{$.locale.Tr "step2"}} </h3>{{$.locale.Tr "repo.pulls.merge_instruction_step2_desc"}}</div>
 	<div class="ui secondary segment">
 		<div>git checkout {{$.Issue.PullRequest.BaseBranch}}</div>
 		<div>git merge --no-ff {{if ne $.Issue.PullRequest.HeadRepo.ID $.Issue.PullRequest.BaseRepo.ID}}{{$.Issue.PullRequest.HeadRepo.OwnerName}}-{{end}}{{$.Issue.PullRequest.HeadBranch}}</div>
diff --git a/templates/repo/issue/view_content/sidebar.tmpl b/templates/repo/issue/view_content/sidebar.tmpl
index 10bb6a07f..2b24825b5 100644
--- a/templates/repo/issue/view_content/sidebar.tmpl
+++ b/templates/repo/issue/view_content/sidebar.tmpl
@@ -6,17 +6,17 @@
 
 			<input id="reviewer_id" name="reviewer_id" type="hidden" value="{{.reviewer_id}}">
 			<div class="ui {{if or (not .Reviewers) (not .CanChooseReviewer) .Repository.IsArchived}}disabled{{end}} floating jump select-reviewers-modify dropdown">
-				<a class="text df ac muted">
+				<a class="text gt-df gt-ac muted">
 					<strong>{{.locale.Tr "repo.issues.review.reviewers"}}</strong>
 					{{if and .CanChooseReviewer (not .Repository.IsArchived)}}
-						{{svg "octicon-gear" 16 "ml-2"}}
+						{{svg "octicon-gear" 16 "gt-ml-2"}}
 					{{end}}
 				</a>
 				<div class="filter menu" data-action="update" data-issue-id="{{$.Issue.ID}}" data-update-url="{{$.RepoLink}}/issues/request_review">
 					<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_reviewer_title"}}</div>
 					{{if .Reviewers}}
 						<div class="ui icon search input">
-							<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+							<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 							<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_reviewers"}}">
 						</div>
 					{{end}}
@@ -26,7 +26,7 @@
 								<a class="{{if not .CanChange}}ui tooltip{{end}} item {{if .Checked}} checked {{end}} {{if not .CanChange}}ban-change{{end}}" href="#" data-id="{{.ItemID}}" data-id-selector="#review_request_{{.ItemID}}" {{if not .CanChange}} data-content="{{$.locale.Tr "repo.issues.remove_request_review_block"}}"{{end}}>
 									<span class="octicon-check {{if not .Checked}}invisible{{end}}">{{svg "octicon-check"}}</span>
 									<span class="text">
-										{{avatar .User 28 "mr-3"}}
+										{{avatar $.Context .User 28 "gt-mr-3"}}
 										{{.User.GetDisplayName}}
 									</span>
 								</a>
@@ -40,7 +40,7 @@
 								<a class="{{if not .CanChange}}ui tooltip{{end}} item {{if .Checked}} checked {{end}} {{if not .CanChange}}ban-change{{end}}" href="#" data-id="{{.ItemID}}" data-id-selector="#review_request_team_{{.Team.ID}}" {{if not .CanChange}} data-content="{{$.locale.Tr "repo.issues.remove_request_review_block"}}"{{end}}>
 									<span class="octicon-check {{if not .Checked}}invisible{{end}}">{{svg "octicon-check" 16}}</span>
 									<span class="text">
-										{{svg "octicon-people" 16 "ml-4 mr-2"}}{{$.Issue.Repo.OwnerName}}/{{.Team.Name}}
+										{{svg "octicon-people" 16 "gt-ml-4 gt-mr-2"}}{{$.Issue.Repo.OwnerName}}/{{.Team.Name}}
 									</span>
 								</a>
 							{{end}}
@@ -50,13 +50,13 @@
 			</div>
 
 			<div class="ui assignees list">
-				<span class="no-select item {{if or .OriginalReviews .PullReviewers}}hide{{end}}">{{.locale.Tr "repo.issues.new.no_reviewers"}}</span>
+				<span class="no-select item {{if or .OriginalReviews .PullReviewers}}gt-hidden{{end}}">{{.locale.Tr "repo.issues.new.no_reviewers"}}</span>
 				<div class="selected">
 					{{range .PullReviewers}}
-						<div class="item mb-2">
+						<div class="item gt-mb-2">
 							{{if .User}}
 								<a class="muted sidebar-item-link" href="{{.User.HomeLink}}">
-									{{avatar .User 28 "mr-3"}}
+									{{avatar $.Context .User 28 "gt-mr-3"}}
 									{{.User.GetDisplayName}}
 								</a>
 							{{else if .Team}}
@@ -107,29 +107,41 @@
 		{{end}}
 
 		<div class="ui {{if or (not .HasIssuesOrPullsWritePermission) .Repository.IsArchived}}disabled{{end}} floating jump select-label dropdown">
-			<a class="text df ac muted">
+			<a class="text gt-df gt-ac muted">
 				<strong>{{.locale.Tr "repo.issues.new.labels"}}</strong>
 				{{if and .HasIssuesOrPullsWritePermission (not .Repository.IsArchived)}}
-					{{svg "octicon-gear" 16 "ml-2"}}
+					{{svg "octicon-gear" 16 "gt-ml-2"}}
 				{{end}}
 			</a>
 			<div class="filter menu" data-action="update" data-issue-id="{{$.Issue.ID}}" data-update-url="{{$.RepoLink}}/issues/labels">
 				<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_labels_title"}}</div>
 				{{if or .Labels .OrgLabels}}
 					<div class="ui icon search input">
-						<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+						<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 						<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_labels"}}">
 					</div>
 				{{end}}
 				<div class="no-select item">{{.locale.Tr "repo.issues.new.clear_labels"}}</div>
 				{{if or .Labels .OrgLabels}}
+					{{$previousExclusiveScope := "_no_scope"}}
 					{{range .Labels}}
-						<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{svg "octicon-check"}}</span><span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
+						{{$exclusiveScope := .ExclusiveScope}}
+						{{if and (ne $previousExclusiveScope "_no_scope") (ne $previousExclusiveScope $exclusiveScope)}}
+							<div class="ui divider"></div>
+						{{end}}
+						{{$previousExclusiveScope = $exclusiveScope}}
+						<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}" data-scope="{{$exclusiveScope}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}</span>&nbsp;&nbsp;{{RenderLabel .}}
 						{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji}}</small>{{end}}</a>
 					{{end}}
 					<div class="ui divider"></div>
+					{{$previousExclusiveScope := "_no_scope"}}
 					{{range .OrgLabels}}
-						<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{svg "octicon-check"}}</span><span class="label color" style="background-color: {{.Color}}"></span> {{.Name | RenderEmoji}}
+						{{$exclusiveScope := .ExclusiveScope}}
+						{{if and (ne $previousExclusiveScope "_no_scope") (ne $previousExclusiveScope $exclusiveScope)}}
+							<div class="ui divider"></div>
+						{{end}}
+						{{$previousExclusiveScope = $exclusiveScope}}
+						<a class="{{if .IsChecked}}checked{{end}} item" href="#" data-id="{{.ID}}" data-id-selector="#label_{{.ID}}" data-scope="{{$exclusiveScope}}"><span class="octicon-check {{if not .IsChecked}}invisible{{end}}">{{if $exclusiveScope}}{{svg "octicon-dot-fill"}}{{else}}{{svg "octicon-check"}}{{end}}</span>&nbsp;&nbsp;{{RenderLabel .}}
 						{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji}}</small>{{end}}</a>
 					{{end}}
 				{{else}}
@@ -142,17 +154,17 @@
 		<div class="ui divider"></div>
 
 		<div class="ui {{if or (not .HasIssuesOrPullsWritePermission) .Repository.IsArchived}}disabled{{end}} floating jump select-milestone dropdown">
-			<a class="text df ac muted">
+			<a class="text gt-df gt-ac muted">
 				<strong>{{.locale.Tr "repo.issues.new.milestone"}}</strong>
 				{{if and .HasIssuesOrPullsWritePermission (not .Repository.IsArchived)}}
-					{{svg "octicon-gear" 16 "ml-2"}}
+					{{svg "octicon-gear" 16 "gt-ml-2"}}
 				{{end}}
 			</a>
 			<div class="menu" data-action="update" data-issue-id="{{$.Issue.ID}}" data-update-url="{{$.RepoLink}}/issues/milestone">
 				<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_milestone_title"}}</div>
 				{{if or .OpenMilestones .ClosedMilestones}}
 				<div class="ui icon search input">
-					<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+					<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 					<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_milestones"}}">
 				</div>
 				{{end}}
@@ -169,7 +181,7 @@
 						</div>
 						{{range .OpenMilestones}}
 							<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
-								{{svg "octicon-milestone" 16 "mr-2"}}
+								{{svg "octicon-milestone" 16 "gt-mr-2"}}
 								{{.Name}}
 							</a>
 						{{end}}
@@ -181,7 +193,7 @@
 						</div>
 						{{range .ClosedMilestones}}
 							<a class="item" data-id="{{.ID}}" data-href="{{$.RepoLink}}/issues?milestone={{.ID}}">
-								{{svg "octicon-milestone" 16 "mr-2"}}
+								{{svg "octicon-milestone" 16 "gt-mr-2"}}
 								{{.Name}}
 							</a>
 						{{end}}
@@ -190,11 +202,11 @@
 			</div>
 		</div>
 		<div class="ui select-milestone list">
-			<span class="no-select item {{if .Issue.Milestone}}hide{{end}}">{{.locale.Tr "repo.issues.new.no_milestone"}}</span>
+			<span class="no-select item {{if .Issue.Milestone}}gt-hidden{{end}}">{{.locale.Tr "repo.issues.new.no_milestone"}}</span>
 			<div class="selected">
 				{{if .Issue.Milestone}}
 					<a class="item muted sidebar-item-link" href="{{.RepoLink}}/milestone/{{.Issue.Milestone.ID}}">
-						{{svg "octicon-milestone" 18 "mr-3"}}
+						{{svg "octicon-milestone" 18 "gt-mr-3"}}
 						{{.Issue.Milestone.Name}}
 					</a>
 				{{end}}
@@ -205,17 +217,17 @@
 			<div class="ui divider"></div>
 
 			<div class="ui {{if or (not .HasIssuesOrPullsWritePermission) .Repository.IsArchived}}disabled{{end}} floating jump select-project dropdown">
-				<a class="text df ac muted">
+				<a class="text gt-df gt-ac muted">
 					<strong>{{.locale.Tr "repo.issues.new.projects"}}</strong>
 					{{if and .HasIssuesOrPullsWritePermission (not .Repository.IsArchived)}}
-						{{svg "octicon-gear" 16 "ml-2"}}
+						{{svg "octicon-gear" 16 "gt-ml-2"}}
 					{{end}}
 				</a>
 				<div class="menu" data-action="update" data-issue-id="{{$.Issue.ID}}" data-update-url="{{$.RepoLink}}/issues/projects">
 					<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_project_title"}}</div>
 					{{if or .OpenProjects .ClosedProjects}}
 					<div class="ui icon search input">
-						<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+						<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 						<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_projects"}}">
 					</div>
 					{{end}}
@@ -227,7 +239,7 @@
 						</div>
 						{{range .OpenProjects}}
 							<a class="item muted sidebar-item-link" data-id="{{.ID}}" data-href="{{.Link}}">
-								{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "mr-3"}}{{else}}{{svg "octicon-project" 18 "mr-3"}}{{end}}
+								{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "gt-mr-3"}}{{else}}{{svg "octicon-project" 18 "gt-mr-3"}}{{end}}
 								{{.Title}}
 							</a>
 						{{end}}
@@ -239,7 +251,7 @@
 						</div>
 						{{range .ClosedProjects}}
 							<a class="item muted sidebar-item-link" data-id="{{.ID}}" data-href="{{.Link}}">
-								{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "mr-3"}}{{else}}{{svg "octicon-project" 18 "mr-3"}}{{end}}
+								{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "gt-mr-3"}}{{else}}{{svg "octicon-project" 18 "gt-mr-3"}}{{end}}
 								{{.Title}}
 							</a>
 						{{end}}
@@ -247,11 +259,11 @@
 				</div>
 			</div>
 			<div class="ui select-project list">
-				<span class="no-select item {{if .Issue.ProjectID}}hide{{end}}">{{.locale.Tr "repo.issues.new.no_projects"}}</span>
+				<span class="no-select item {{if .Issue.ProjectID}}gt-hidden{{end}}">{{.locale.Tr "repo.issues.new.no_projects"}}</span>
 				<div class="selected">
 					{{if .Issue.ProjectID}}
 						<a class="item muted sidebar-item-link" href="{{.Issue.Project.Link}}">
-							{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "mr-3"}}{{else}}{{svg "octicon-project" 18 "mr-3"}}{{end}}
+							{{if .IsOrganizationProject}}{{svg "octicon-project-symlink" 18 "gt-mr-3"}}{{else}}{{svg "octicon-project" 18 "gt-mr-3"}}{{end}}
 							{{.Issue.Project.Title}}
 						</a>
 					{{end}}
@@ -263,16 +275,16 @@
 
 		<input id="assignee_id" name="assignee_id" type="hidden" value="{{.assignee_id}}">
 		<div class="ui {{if or (not .HasIssuesOrPullsWritePermission) .Repository.IsArchived}}disabled{{end}} floating jump select-assignees-modify dropdown">
-			<a class="text df ac muted">
+			<a class="text gt-df gt-ac muted">
 				<strong>{{.locale.Tr "repo.issues.new.assignees"}}</strong>
 				{{if and .HasIssuesOrPullsWritePermission (not .Repository.IsArchived)}}
-					{{svg "octicon-gear" 16 "ml-2"}}
+					{{svg "octicon-gear" 16 "gt-ml-2"}}
 				{{end}}
 			</a>
 			<div class="filter menu" data-action="update" data-issue-id="{{$.Issue.ID}}" data-update-url="{{$.RepoLink}}/issues/assignee">
 				<div class="header" style="text-transform: none;font-size:16px;">{{.locale.Tr "repo.issues.new.add_assignees_title"}}</div>
 				<div class="ui icon search input">
-					<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+					<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 					<input type="text" placeholder="{{.locale.Tr "repo.issues.filter_assignees"}}">
 				</div>
 				<div class="no-select item">{{.locale.Tr "repo.issues.new.clear_assignees"}}</div>
@@ -288,7 +300,7 @@
 						{{end}}
 						<span class="octicon-check {{if not $checked}}invisible{{end}}">{{svg "octicon-check"}}</span>
 						<span class="text">
-							{{avatar . 28 "mr-3"}}
+							{{avatar $.Context . 28 "gt-mr-3"}}
 							{{.GetDisplayName}}
 						</span>
 					</a>
@@ -296,12 +308,12 @@
 			</div>
 		</div>
 		<div class="ui assignees list">
-			<span class="no-select item {{if .Issue.Assignees}}hide{{end}}">{{.locale.Tr "repo.issues.new.no_assignees"}}</span>
+			<span class="no-select item {{if .Issue.Assignees}}gt-hidden{{end}}">{{.locale.Tr "repo.issues.new.no_assignees"}}</span>
 			<div class="selected">
 				{{range .Issue.Assignees}}
 					<div class="item">
 						<a class="muted sidebar-item-link" href="{{$.RepoLink}}/{{if $.Issue.IsPull}}pulls{{else}}issues{{end}}?assignee={{.ID}}">
-							{{avatar . 28 "mr-3"}}
+							{{avatar $.Context . 28 "gt-mr-3"}}
 							{{.GetDisplayName}}
 						</a>
 					</div>
@@ -313,10 +325,10 @@
 
 		{{if .Participants}}
 			<span class="text"><strong>{{.locale.Tr "repo.issues.num_participants" .NumParticipants}}</strong></span>
-			<div class="ui list df fw">
+			<div class="ui list gt-df gt-fw">
 				{{range .Participants}}
 					<a class="ui tooltip" {{if gt .ID 0}}href="{{.HomeLink}}"{{end}} data-content="{{.GetDisplayName}}" data-position="top center">
-						{{avatar . 28 "my-1 mr-2"}}
+						{{avatar $.Context . 28 "gt-my-1 gt-mr-2"}}
 					</a>
 				{{end}}
 			</div>
@@ -327,16 +339,16 @@
 
 			<div class="ui watching">
 				<span class="text"><strong>{{.locale.Tr "notification.notifications"}}</strong></span>
-				<div class="mt-3">
+				<div class="gt-mt-3">
 					<form method="POST" action="{{.Issue.Link}}/watch">
 						<input type="hidden" name="watch" value="{{if $.IssueWatch.IsWatching}}0{{else}}1{{end}}" />
 						{{$.CsrfTokenHtml}}
-						<button class="fluid ui button df jc">
+						<button class="fluid ui button gt-df gt-jc">
 							{{if $.IssueWatch.IsWatching}}
-								{{svg "octicon-mute" 16 "mr-3"}}
+								{{svg "octicon-mute" 16 "gt-mr-3"}}
 								{{.locale.Tr "repo.issues.unsubscribe"}}
 							{{else}}
-								{{svg "octicon-unmute" 16 "mr-3"}}
+								{{svg "octicon-unmute" 16 "gt-mr-3"}}
 								{{.locale.Tr "repo.issues.subscribe"}}
 							{{end}}
 						</button>
@@ -349,7 +361,7 @@
 				<div class="ui divider"></div>
 				<div class="ui timetrack">
 					<span class="text"><strong>{{.locale.Tr "repo.issues.tracker"}}</strong></span>
-					<div class="mt-3">
+					<div class="gt-mt-3">
 						<form method="POST" action="{{.Issue.Link}}/times/stopwatch/toggle" id="toggle_stopwatch_form">
 							{{$.CsrfTokenHtml}}
 						</form>
@@ -358,7 +370,7 @@
 						</form>
 						{{if  $.IsStopwatchRunning}}
 							<button class="ui fluid button issue-stop-time">{{.locale.Tr "repo.issues.stop_tracking"}}</button>
-							<button class="ui fluid negative button issue-cancel-time mt-3">{{.locale.Tr "repo.issues.cancel_tracking"}}</button>
+							<button class="ui fluid negative button issue-cancel-time gt-mt-3">{{.locale.Tr "repo.issues.cancel_tracking"}}</button>
 						{{else}}
 							{{if .HasUserStopwatch}}
 								<div class="ui warning message">
@@ -380,7 +392,7 @@
 									<div class="ui red cancel button">{{.locale.Tr "repo.issues.add_time_cancel"}}</div>
 								</div>
 							</div>
-							<button class="ui fluid button green tooltip issue-add-time mt-3" data-content='{{.locale.Tr "repo.issues.add_time"}}' data-position="top center">{{.locale.Tr "repo.issues.add_time_short"}}</button>
+							<button class="ui fluid button green tooltip issue-add-time gt-mt-3" data-content='{{.locale.Tr "repo.issues.add_time"}}' data-position="top center">{{.locale.Tr "repo.issues.add_time_short"}}</button>
 						{{end}}
 					</div>
 				</div>
@@ -391,9 +403,9 @@
 					<span class="text"><strong>{{.locale.Tr "repo.issues.time_spent_from_all_authors"  ($.Issue.TotalTrackedTime | Sec2Time) | Safe}}</strong></span>
 					<div>
 						{{range $user, $trackedtime := .WorkingUsers}}
-							<div class="comment mt-3">
+							<div class="comment gt-mt-3">
 								<a class="avatar">
-									{{avatar $user}}
+									{{avatar $.Context $user}}
 								</a>
 								<div class="content">
 									{{template "shared/user/authorlink" $user}}
@@ -411,20 +423,20 @@
 		<div class="ui divider"></div>
 		<span class="text"><strong>{{.locale.Tr "repo.issues.due_date"}}</strong></span>
 		<div class="ui form" id="deadline-loader">
-			<div class="ui negative message" id="deadline-err-invalid-date" style="display: none;">
+			<div class="ui negative message gt-hidden" id="deadline-err-invalid-date">
 				{{svg "octicon-x" 16 "close icon"}}
 				{{.locale.Tr "repo.issues.due_date_invalid"}}
 			</div>
 			{{if ne .Issue.DeadlineUnix 0}}
 				<p>
-					<div class="df sb ac">
+					<div class="gt-df gt-sb gt-ac">
 						<div class="due-date tooltip {{if .Issue.IsOverdue}}text red{{end}}" {{if .Issue.IsOverdue}}data-content="{{.locale.Tr "repo.issues.due_date_overdue"}}"{{end}}>
-							{{svg "octicon-calendar" 16 "mr-3"}}
+							{{svg "octicon-calendar" 16 "gt-mr-3"}}
 							<time data-format="date" datetime="{{.Issue.DeadlineUnix.FormatDate}}">{{.Issue.DeadlineUnix.FormatDate}}</time>
 						</div>
 						<div>
 							{{if and .HasIssuesOrPullsWritePermission (not .Repository.IsArchived)}}
-								<a class="issue-due-edit tooltip muted" data-content="{{$.locale.Tr "repo.issues.due_date_form_edit"}}">{{svg "octicon-pencil" 16 "mr-2"}}</a>
+								<a class="issue-due-edit tooltip muted" data-content="{{$.locale.Tr "repo.issues.due_date_form_edit"}}">{{svg "octicon-pencil" 16 "gt-mr-2"}}</a>
 								<a class="issue-due-remove tooltip muted" data-content="{{$.locale.Tr "repo.issues.due_date_form_remove"}}">{{svg "octicon-trash"}}</a>
 							{{end}}
 						</div>
@@ -435,7 +447,7 @@
 			{{end}}
 
 			{{if and .HasIssuesOrPullsWritePermission (not .Repository.IsArchived)}}
-				<div {{if ne .Issue.DeadlineUnix 0}} style="display: none;"{{end}} id="deadlineForm">
+				<div {{if ne .Issue.DeadlineUnix 0}} class="gt-hidden"{{end}} id="deadlineForm">
 					<form class="ui fluid action input issue-due-form" action="{{AppSubUrl}}/{{PathEscape .Repository.Owner.Name}}/{{PathEscape .Repository.Name}}/issues/{{.Issue.Index}}/deadline" method="post" id="update-issue-deadline-form">
 						{{$.CsrfTokenHtml}}
 						<input required placeholder="{{.locale.Tr "repo.issues.due_date_form"}}" {{if gt .Issue.DeadlineUnix 0}}value="{{.Issue.DeadlineUnix.Format "2006-01-02"}}"{{end}} type="date" name="deadlineDate" id="deadlineDate">
@@ -473,8 +485,8 @@
 					</span>
 					<div class="ui relaxed divided list">
 						{{range .BlockingDependencies}}
-							<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} df ac sb">
-								<div class="item-left df jc fc f1">
+							<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb">
+								<div class="item-left gt-df gt-jc gt-fc gt-f1">
 									<a class="title tooltip" href="{{.Issue.Link}}" data-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji}}">
 										#{{.Issue.Index}} {{.Issue.Title | RenderEmoji}}
 									</a>
@@ -482,7 +494,7 @@
 										{{.Repository.OwnerName}}/{{.Repository.Name}}
 									</div>
 								</div>
-								<div class="item-right df ac">
+								<div class="item-right gt-df gt-ac">
 									{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
 										<a class="delete-dependency-button tooltip ci muted" data-id="{{.Issue.ID}}" data-type="blocking" data-content="{{$.locale.Tr "repo.issues.dependency.remove_info"}}" data-inverted="">
 											{{svg "octicon-trash" 16}}
@@ -500,8 +512,8 @@
 					</span>
 					<div class="ui relaxed divided list">
 						{{range .BlockedByDependencies}}
-							<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} df ac sb">
-								<div class="item-left df jc fc f1">
+							<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb">
+								<div class="item-left gt-df gt-jc gt-fc gt-f1">
 									<a class="title tooltip" href="{{.Issue.Link}}" data-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji}}">
 										#{{.Issue.Index}} {{.Issue.Title | RenderEmoji}}
 									</a>
@@ -509,7 +521,7 @@
 										{{.Repository.OwnerName}}/{{.Repository.Name}}
 									</div>
 								</div>
-								<div class="item-right df ac">
+								<div class="item-right gt-df gt-ac">
 									{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
 										<a class="delete-dependency-button tooltip ci muted" data-id="{{.Issue.ID}}" data-type="blockedBy" data-content="{{$.locale.Tr "repo.issues.dependency.remove_info"}}" data-inverted="">
 											{{svg "octicon-trash" 16}}
@@ -577,10 +589,10 @@
 
 		<div class="ui divider"></div>
 		<div class="ui equal width compact grid">
-			<div class="row ac">
-				{{$issueReferenceLink := printf "%s#%d" .Issue.Repo.FullName .Issue.Index}}
+			{{$issueReferenceLink := printf "%s#%d" .Issue.Repo.FullName .Issue.Index}}
+			<div class="row gt-ac tooltip" data-content="{{$issueReferenceLink}}">
 				<span class="text column truncate">{{.locale.Tr "repo.issues.reference_link" $issueReferenceLink}}</span>
-				<button class="ui two wide button column p-3" data-clipboard-text="{{$issueReferenceLink}}">{{svg "octicon-copy" 14}}</button>
+				<button class="ui two wide button column gt-p-3" data-clipboard-text="{{$issueReferenceLink}}">{{svg "octicon-copy" 14}}</button>
 			</div>
 		</div>
 
@@ -639,7 +651,7 @@
 
 									<div class="default text"> </div>
 
-									<div class="menu transition hidden" tabindex="-1" style="display: block !important;">
+									<div class="menu">
 										{{range .LockReasons}}
 											<div class="item" data-value="{{.}}">{{.}}</div>
 										{{end}}
@@ -661,7 +673,7 @@
 					</form>
 				</div>
 			</div>
-			<button class="fluid ui show-modal button negative mt-3" data-modal="#delete">
+			<button class="fluid ui show-modal button negative gt-mt-3" data-modal="#delete">
 				{{svg "octicon-trash"}}
 				{{.locale.Tr "repo.issues.delete"}}
 			</button>
diff --git a/templates/repo/issue/view_content/update_branch_by_merge.tmpl b/templates/repo/issue/view_content/update_branch_by_merge.tmpl
index 3bc8dcca9..6d36a9b45 100644
--- a/templates/repo/issue/view_content/update_branch_by_merge.tmpl
+++ b/templates/repo/issue/view_content/update_branch_by_merge.tmpl
@@ -8,7 +8,7 @@
 		</div>
 		<div class="item-section-right">
 			{{if and .UpdateAllowed .UpdateByRebaseAllowed}}
-				<div class="dib">
+				<div class="gt-dib">
 					<div class="ui buttons update-button">
 						<button class="ui button" data-do="{{.Link}}/update" data-redirect="{{.Link}}">
 							<span class="button-text">
diff --git a/templates/repo/issue/view_title.tmpl b/templates/repo/issue/view_title.tmpl
index 67ab71d69..b43253f90 100644
--- a/templates/repo/issue/view_title.tmpl
+++ b/templates/repo/issue/view_title.tmpl
@@ -8,14 +8,14 @@
 		<h1>
 			<span id="issue-title">{{RenderIssueTitle $.Context .Issue.Title $.RepoLink $.Repository.ComposeMetas | RenderCodeBlock}}</span>
 			<span class="index">#{{.Issue.Index}}</span>
-			<div id="edit-title-input" class="ui input ml-4" style="display: none">
+			<div id="edit-title-input" class="ui input gt-ml-4 gt-hidden">
 				<input value="{{.Issue.Title}}" maxlength="255" autocomplete="off">
 			</div>
 		</h1>
 		{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}}
 			<div class="edit-buttons">
-				<button id="cancel-edit-title" class="ui basic button secondary in-edit" style="display: none">{{.locale.Tr "repo.issues.cancel"}}</button>
-				<button id="save-edit-title" class="ui primary button in-edit" style="display: none" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/title" {{if .Issue.IsPull}}data-target-update-url="{{$.RepoLink}}/pull/{{.Issue.Index}}/target_branch"{{end}}>{{.locale.Tr "repo.issues.save"}}</button>
+				<button id="cancel-edit-title" class="ui basic button secondary in-edit gt-hidden">{{.locale.Tr "repo.issues.cancel"}}</button>
+				<button id="save-edit-title" class="ui primary button in-edit gt-hidden" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/title" {{if .Issue.IsPull}}data-target-update-url="{{$.RepoLink}}/pull/{{.Issue.Index}}/target_branch"{{end}}>{{.locale.Tr "repo.issues.save"}}</button>
 			</div>
 		{{end}}
 	</div>
@@ -61,7 +61,7 @@
 					{{$.locale.Tr "repo.pulls.title_desc" .NumCommits $headHref $baseHref | Safe}}
 				</span>
 			{{end}}
-			<span id="pull-desc-edit" style="display: none">
+			<span id="pull-desc-edit gt-hidden">
 				<div class="ui floating filter dropdown">
 					<div class="ui basic small button">
 						<span class="text">{{.locale.Tr "repo.pulls.compare_compare"}}: {{$.HeadTarget}}</span>
@@ -75,7 +75,7 @@
 					</div>
 					<div class="menu">
 						<div class="ui icon search input">
-							<i class="icon df ac jc m-0">{{svg "octicon-filter" 16}}</i>
+							<i class="icon gt-df gt-ac gt-jc gt-m-0">{{svg "octicon-filter" 16}}</i>
 							<input name="search" placeholder="{{.locale.Tr "repo.pulls.filter_branch"}}...">
 						</div>
 						<div class="scrolling menu" id="branch-select">
diff --git a/templates/repo/migrate/codebase.tmpl b/templates/repo/migrate/codebase.tmpl
index e20bd70e7..5bfd3adc2 100644
--- a/templates/repo/migrate/codebase.tmpl
+++ b/templates/repo/migrate/codebase.tmpl
@@ -62,18 +62,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser 28 "mini"}}
+								{{avatar $.Context .ContextUser 28 "mini"}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu" title="{{.SignedUser.Name}}">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}">
-									{{avatar .SignedUser 28 "mini"}}
+									{{avatar $.Context .SignedUser 28 "mini"}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 									<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-										{{avatar . 28 "mini"}}
+										{{avatar $.Context . 28 "mini"}}
 										<span class="truncated-item-name">{{.ShortName 40}}</span>
 									</div>
 								{{end}}
diff --git a/templates/repo/migrate/git.tmpl b/templates/repo/migrate/git.tmpl
index 0757948a6..fb6775e38 100644
--- a/templates/repo/migrate/git.tmpl
+++ b/templates/repo/migrate/git.tmpl
@@ -36,18 +36,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser}}
+								{{avatar $.Context .ContextUser}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu" title="{{.SignedUser.Name}}">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}">
-									{{avatar .SignedUser}}
+									{{avatar $.Context .SignedUser}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 									<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-										{{avatar .}}
+										{{avatar $.Context .}}
 										<span class="truncated-item-name">{{.ShortName 40}}</span>
 									</div>
 								{{end}}
diff --git a/templates/repo/migrate/gitbucket.tmpl b/templates/repo/migrate/gitbucket.tmpl
index 020115be6..e9515beeb 100644
--- a/templates/repo/migrate/gitbucket.tmpl
+++ b/templates/repo/migrate/gitbucket.tmpl
@@ -78,18 +78,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser 28 "mini"}}
+								{{avatar $.Context .ContextUser 28 "mini"}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu" title="{{.SignedUser.Name}}">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}">
-									{{avatar .SignedUser 28 "mini"}}
+									{{avatar $.Context .SignedUser 28 "mini"}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 									<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-										{{avatar . 28 "mini"}}
+										{{avatar $.Context . 28 "mini"}}
 										<span class="truncated-item-name">{{.ShortName 40}}</span>
 									</div>
 								{{end}}
diff --git a/templates/repo/migrate/gitea.tmpl b/templates/repo/migrate/gitea.tmpl
index ef28e15ee..ecbf89608 100644
--- a/templates/repo/migrate/gitea.tmpl
+++ b/templates/repo/migrate/gitea.tmpl
@@ -74,18 +74,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser}}
+								{{avatar $.Context .ContextUser}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu" title="{{.SignedUser.Name}}">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}">
-									{{avatar .SignedUser}}
+									{{avatar $.Context .SignedUser}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 								<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-									{{avatar .}}
+									{{avatar $.Context .}}
 									<span class="truncated-item-name">{{.ShortName 40}}</span>
 								</div>
 								{{end}}
diff --git a/templates/repo/migrate/github.tmpl b/templates/repo/migrate/github.tmpl
index b6c39134f..63b5e83a2 100644
--- a/templates/repo/migrate/github.tmpl
+++ b/templates/repo/migrate/github.tmpl
@@ -76,18 +76,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser 28 "mini"}}
+								{{avatar $.Context .ContextUser 28 "mini"}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu" title="{{.SignedUser.Name}}">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}">
-									{{avatar .SignedUser 28 "mini"}}
+									{{avatar $.Context .SignedUser 28 "mini"}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 									<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-										{{avatar . 28 "mini"}}
+										{{avatar $.Context . 28 "mini"}}
 										<span class="truncated-item-name">{{.ShortName 40}}</span>
 									</div>
 								{{end}}
diff --git a/templates/repo/migrate/gitlab.tmpl b/templates/repo/migrate/gitlab.tmpl
index 454194542..946b7da37 100644
--- a/templates/repo/migrate/gitlab.tmpl
+++ b/templates/repo/migrate/gitlab.tmpl
@@ -73,18 +73,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser 28 "mini"}}
+								{{avatar $.Context .ContextUser 28 "mini"}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu" title="{{.SignedUser.Name}}">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}">
-									{{avatar .SignedUser 28 "mini"}}
+									{{avatar $.Context .SignedUser 28 "mini"}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 									<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-										{{avatar . 28 "mini"}}
+										{{avatar $.Context . 28 "mini"}}
 										<span class="truncated-item-name">{{.ShortName 40}}</span>
 									</div>
 								{{end}}
diff --git a/templates/repo/migrate/gogs.tmpl b/templates/repo/migrate/gogs.tmpl
index acd7ec950..85dbce816 100644
--- a/templates/repo/migrate/gogs.tmpl
+++ b/templates/repo/migrate/gogs.tmpl
@@ -76,18 +76,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser}}
+								{{avatar $.Context .ContextUser}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu" title="{{.SignedUser.Name}}">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}">
-									{{avatar .SignedUser}}
+									{{avatar $.Context .SignedUser}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 								<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-									{{avatar .}}
+									{{avatar $.Context .}}
 									<span class="truncated-item-name">{{.ShortName 40}}</span>
 								</div>
 								{{end}}
diff --git a/templates/repo/migrate/migrate.tmpl b/templates/repo/migrate/migrate.tmpl
index e69cb5724..9663b85eb 100644
--- a/templates/repo/migrate/migrate.tmpl
+++ b/templates/repo/migrate/migrate.tmpl
@@ -5,13 +5,13 @@
 			{{template "repo/migrate/helper" .}}
 			<div class="ui three stackable cards">
 				{{range .Services}}
-					<a class="ui card df ac" href="{{AppSubUrl}}/repo/migrate?service_type={{.}}&org={{$.Org}}&mirror={{$.Mirror}}">
+					<a class="ui card gt-df gt-ac" href="{{AppSubUrl}}/repo/migrate?service_type={{.}}&org={{$.Org}}&mirror={{$.Mirror}}">
 						{{svg (Printf "gitea-%s" .Name) 184}}
 						<div class="content">
-							<div class="header tc">
+							<div class="header gt-tc">
 								{{.Title}}
 							</div>
-							<div class="description tc">
+							<div class="description gt-tc">
 								{{(Printf "repo.migrate.%s.description" .Name) | $.locale.Tr}}
 							</div>
 						</div>
diff --git a/templates/repo/migrate/migrating.tmpl b/templates/repo/migrate/migrating.tmpl
index e6d329a1a..a3552610c 100644
--- a/templates/repo/migrate/migrating.tmpl
+++ b/templates/repo/migrate/migrating.tmpl
@@ -12,7 +12,7 @@
 								<img src="{{AssetUrlPrefix}}/img/loading.png"/>
 							</div>
 						</div>
-						<div id="repo_migrating_failed_image" class="sixteen wide center aligned centered column" style="display: none;">
+						<div id="repo_migrating_failed_image" class="sixteen wide center aligned centered column gt-hidden">
 							<div>
 								<img src="{{AssetUrlPrefix}}/img/failed.png"/>
 							</div>
@@ -24,7 +24,7 @@
 								<p>{{.locale.Tr "repo.migrate.migrating" .CloneAddr | Safe}}</p>
 								<p id="repo_migrating_progress_message"></p>
 							</div>
-							<div id="repo_migrating_failed" hidden>
+							<div id="repo_migrating_failed" class="gt-hidden">
 								{{if .CloneAddr}}
 									<p>{{.locale.Tr "repo.migrate.migrating_failed" .CloneAddr | Safe}}</p>
 								{{else}}
diff --git a/templates/repo/migrate/onedev.tmpl b/templates/repo/migrate/onedev.tmpl
index ec8c06cc7..8463782ae 100644
--- a/templates/repo/migrate/onedev.tmpl
+++ b/templates/repo/migrate/onedev.tmpl
@@ -62,18 +62,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser 28 "mini"}}
+								{{avatar $.Context .ContextUser 28 "mini"}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu" title="{{.SignedUser.Name}}">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}">
-									{{avatar .SignedUser 28 "mini"}}
+									{{avatar $.Context .SignedUser 28 "mini"}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 									<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-										{{avatar . 28 "mini"}}
+										{{avatar $.Context . 28 "mini"}}
 										<span class="truncated-item-name">{{.ShortName 40}}</span>
 									</div>
 								{{end}}
diff --git a/templates/repo/migrate/options.tmpl b/templates/repo/migrate/options.tmpl
index 5fdf6c7ab..d39caf01b 100644
--- a/templates/repo/migrate/options.tmpl
+++ b/templates/repo/migrate/options.tmpl
@@ -14,9 +14,9 @@
 		<input id="lfs" name="lfs" type="checkbox" {{if .lfs}} checked{{end}}>
 		<label>{{.locale.Tr "repo.migrate_options_lfs"}}</label>
 	</div>
-	<span id="lfs_settings" style="display:none">(<a id="lfs_settings_show" href="#">{{.locale.Tr "repo.settings.advanced_settings"}}</a>)</span>
+	<span id="lfs_settings" class="gt-hidden">(<a id="lfs_settings_show" href="#">{{.locale.Tr "repo.settings.advanced_settings"}}</a>)</span>
 </div>
-<div id="lfs_endpoint" style="display:none">
+<div id="lfs_endpoint" class="gt-hidden">
 	<span class="help">{{.locale.Tr "repo.migrate_options_lfs_endpoint.description" "https://github.com/git-lfs/git-lfs/blob/main/docs/api/server-discovery.md#server-discovery" | Str2html}}{{if .ContextUser.CanImportLocal}} {{.locale.Tr "repo.migrate_options_lfs_endpoint.description.local"}}{{end}}</span>
 	<div class="inline field {{if .Err_LFSEndpoint}}error{{end}}">
 		<label>{{.locale.Tr "repo.migrate_options_lfs_endpoint.label"}}</label>
diff --git a/templates/repo/projects/list.tmpl b/templates/repo/projects/list.tmpl
index f717934b3..fc4770e5d 100644
--- a/templates/repo/projects/list.tmpl
+++ b/templates/repo/projects/list.tmpl
@@ -14,11 +14,11 @@
 		{{template "base/alert" .}}
 		<div class="ui compact tiny menu">
 			<a class="item{{if not .IsShowClosed}} active{{end}}" href="{{.RepoLink}}/projects?state=open">
-				{{svg "octicon-project" 16 "mr-3"}}
+				{{svg "octicon-project" 16 "gt-mr-3"}}
 				{{JsPrettyNumber .OpenCount}}&nbsp;{{.locale.Tr "repo.issues.open_title"}}
 			</a>
 			<a class="item{{if .IsShowClosed}} active{{end}}" href="{{.RepoLink}}/projects?state=closed">
-				{{svg "octicon-check" 16 "mr-3"}}
+				{{svg "octicon-check" 16 "gt-mr-3"}}
 				{{JsPrettyNumber .ClosedCount}}&nbsp;{{.locale.Tr "repo.issues.closed_title"}}
 			</a>
 		</div>
@@ -47,9 +47,9 @@
 							{{svg "octicon-clock"}} {{$.locale.Tr "repo.milestones.closed" $closedDate|Str2html}}
 						{{end}}
 						<span class="issue-stats">
-							{{svg "octicon-issue-opened" 16 "mr-3"}}
+							{{svg "octicon-issue-opened" 16 "gt-mr-3"}}
 							{{JsPrettyNumber .NumOpenIssues}}&nbsp;{{$.locale.Tr "repo.issues.open_title"}}
-							{{svg "octicon-check" 16 "mr-3"}}
+							{{svg "octicon-check" 16 "gt-mr-3"}}
 							{{JsPrettyNumber .NumClosedIssues}}&nbsp;{{$.locale.Tr "repo.issues.closed_title"}}
 						</span>
 					</div>
diff --git a/templates/repo/projects/new.tmpl b/templates/repo/projects/new.tmpl
index 79f9380dc..c90fa4369 100644
--- a/templates/repo/projects/new.tmpl
+++ b/templates/repo/projects/new.tmpl
@@ -34,17 +34,38 @@
 				</div>
 
 				{{if not .PageIsEditProjects}}
-					<label>{{.locale.Tr "repo.projects.template.desc"}}</label>
+					<div class="field">
+						<label>{{.locale.Tr "repo.projects.template.desc"}}</label>
+						<div class="ui selection dropdown">
+							<input type="hidden" name="board_type" value="{{.type}}">
+							<div class="default text">{{.locale.Tr "repo.projects.template.desc_helper"}}</div>
+							<div class="menu">
+								{{range $element := .BoardTypes}}
+									<div class="item" data-id="{{$element.BoardType}}" data-value="{{$element.BoardType}}">{{$.locale.Tr $element.Translation}}</div>
+								{{end}}
+							</div>
+						</div>
+					</div>
+				{{end}}
+
+				<div class="field">
+					<label>{{.locale.Tr "repo.projects.card_type.desc"}}</label>
 					<div class="ui selection dropdown">
-						<input type="hidden" name="board_type" value="{{.type}}">
-						<div class="default text">{{.locale.Tr "repo.projects.template.desc_helper"}}</div>
+						{{svg "octicon-triangle-down" 14 "dropdown icon"}}
+						{{range $element := .CardTypes}}
+							{{if or (eq $.card_type $element.CardType) (and (not $.card_type) (eq $element.CardType 2))}}
+								<input type="hidden" name="card_type" value="{{$element.CardType}}">
+								<div class="default text">{{$.locale.Tr $element.Translation}}</div>
+							{{end}}
+						{{end}}
 						<div class="menu">
-							{{range $element := .ProjectTypes}}
-								<div class="item" data-id="{{$element.BoardType}}" data-value="{{$element.BoardType}}">{{$.locale.Tr $element.Translation}}</div>
+							{{range $element := .CardTypes}}
+								<div class="item" data-id="{{$element.CardType}}" data-value="{{$element.CardType}}">{{$.locale.Tr $element.Translation}}</div>
 							{{end}}
 						</div>
 					</div>
-				{{end}}
+				</div>
+
 			</div>
 			<div class="ui container">
 				<div class="ui divider"></div>
diff --git a/templates/repo/projects/view.tmpl b/templates/repo/projects/view.tmpl
index 63d2727b6..a4ada8735 100644
--- a/templates/repo/projects/view.tmpl
+++ b/templates/repo/projects/view.tmpl
@@ -52,22 +52,22 @@
 					<div class="ui compact right small menu">
 						<a class="item" href="{{$.RepoLink}}/projects/{{.Project.ID}}/edit" data-id={{$.Project.ID}} data-title={{$.Project.Title}}>
 							{{svg "octicon-pencil"}}
-							<span class="mx-3">{{$.locale.Tr "repo.issues.label_edit"}}</span>
+							<span class="gt-mx-3">{{$.locale.Tr "repo.issues.label_edit"}}</span>
 						</a>
 						{{if .Project.IsClosed}}
 							<a class="item link-action" href data-url="{{$.RepoLink}}/projects/{{.Project.ID}}/open">
 								{{svg "octicon-check"}}
-								<span class="mx-3">{{$.locale.Tr "repo.projects.open"}}</span>
+								<span class="gt-mx-3">{{$.locale.Tr "repo.projects.open"}}</span>
 							</a>
 						{{else}}
 							<a class="item link-action" href data-url="{{$.RepoLink}}/projects/{{.Project.ID}}/close">
 								{{svg "octicon-skip"}}
-								<span class="mx-3">{{$.locale.Tr "repo.projects.close"}}</span>
+								<span class="gt-mx-3">{{$.locale.Tr "repo.projects.close"}}</span>
 							</a>
 						{{end}}
 						<a class="item delete-button" href="#" data-url="{{$.RepoLink}}/projects/{{.Project.ID}}/delete" data-id="{{.Project.ID}}">
 							{{svg "octicon-trash"}}
-							<span class="mx-3">{{$.locale.Tr "repo.issues.label_delete"}}</span>
+							<span class="gt-mx-3">{{$.locale.Tr "repo.issues.label_delete"}}</span>
 						</a>
 					</div>
 				</div>
@@ -81,8 +81,8 @@
 			{{range $board := .Boards}}
 
 			<div class="ui segment board-column" style="background: {{.Color}} !important;" data-id="{{.ID}}" data-sorting="{{.Sorting}}" data-url="{{$.RepoLink}}/projects/{{$.Project.ID}}/{{.ID}}">
-				<div class="board-column-header df ac sb">
-					<div class="ui large label board-label py-2">
+				<div class="board-column-header gt-df gt-ac gt-sb">
+					<div class="ui large label board-label gt-py-2">
 						<div class="ui small circular grey label board-card-cnt">
 							{{.NumIssues}}
 						</div>
@@ -90,7 +90,7 @@
 					</div>
 					{{if and $.CanWriteProjects (not $.Repository.IsArchived) (ne .ID 0)}}
 						<div class="ui dropdown jump item tooltip">
-							<div class="not-mobile px-3" tabindex="-1">
+							<div class="not-mobile gt-px-3" tabindex="-1">
 								{{svg "octicon-kebab-horizontal"}}
 							</div>
 							<div class="menu user-menu" tabindex="-1">
@@ -179,9 +179,16 @@
 
 					<!-- start issue card -->
 					<div class="card board-card" data-issue="{{.ID}}">
-						<div class="content p-0">
+						{{if eq $.Project.CardType 1}}{{/* Images and Text*/}}
+							<div class="card-attachment-images">
+								{{range (index $.issuesAttachmentMap .ID)}}
+									<img src="{{.DownloadURL}}" alt="{{.Name}}" />
+								{{end}}
+							</div>
+						{{end}}
+						<div class="content gt-p-0">
 							<div class="header">
-								<span class="dif ac vm {{if .IsClosed}}red{{else}}green{{end}}">
+								<span class="gt-dif gt-ac gt-vm {{if .IsClosed}}red{{else}}green{{end}}">
 									{{if .IsPull}}
 										{{if .PullRequest.HasMerged}}
 											{{svg "octicon-git-merge" 16 "text purple"}}
@@ -200,11 +207,11 @@
 										{{end}}
 									{{end}}
 								</span>
-								<a class="project-board-title vm" href="{{.Link}}">
+								<a class="project-board-title gt-vm" href="{{.Link}}">
 									{{.Title}}
 								</a>
 							</div>
-							<div class="meta my-2">
+							<div class="meta gt-my-2">
 								<span class="text light grey">
 									#{{.Index}}
 									{{$timeStr := TimeSinceUnix .GetLastEventTimestamp $.locale}}
@@ -218,31 +225,31 @@
 								</span>
 							</div>
 							{{- if .MilestoneID}}
-							<div class="meta my-2">
+							<div class="meta gt-my-2">
 								<a class="milestone" href="{{$.RepoLink}}/milestone/{{.MilestoneID}}">
-									{{svg "octicon-milestone" 16 "mr-2 vm"}}
-									<span class="vm">{{.Milestone.Name}}</span>
+									{{svg "octicon-milestone" 16 "gt-mr-2 gt-vm"}}
+									<span class="gt-vm">{{.Milestone.Name}}</span>
 								</a>
 							</div>
 							{{- end}}
 							{{- range index $.LinkedPRs .ID}}
-							<div class="meta my-2">
+							<div class="meta gt-my-2">
 								<a href="{{$.RepoLink}}/pulls/{{.Index}}">
-									<span class="m-0 {{if .PullRequest.HasMerged}}purple{{else if .IsClosed}}red{{else}}green{{end}}">{{svg "octicon-git-merge" 16 "mr-2 vm"}}</span>
-									<span class="vm">{{.Title}} <span class="text light grey">#{{.Index}}</span></span>
+									<span class="gt-m-0 {{if .PullRequest.HasMerged}}purple{{else if .IsClosed}}red{{else}}green{{end}}">{{svg "octicon-git-merge" 16 "gt-mr-2 gt-vm"}}</span>
+									<span class="gt-vm">{{.Title}} <span class="text light grey">#{{.Index}}</span></span>
 								</a>
 							</div>
 							{{- end}}
 						</div>
 
 						{{if or .Labels .Assignees}}
-						<div class="extra content labels-list p-0 pt-2">
+						<div class="extra content labels-list gt-p-0 gt-pt-2">
 							{{range .Labels}}
-								<a class="ui label" target="_blank" href="{{$.RepoLink}}/issues?labels={{.ID}}" style="color: {{.ForegroundColor}}; background-color: {{.Color}};" title="{{.Description | RenderEmojiPlain}}">{{.Name | RenderEmoji}}</a>
+								<a target="_blank" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{RenderLabel .}}</a>
 							{{end}}
 							<div class="right floated">
 								{{range .Assignees}}
-									<a class="tooltip" target="_blank" href="{{.HomeLink}}" data-content="{{$.locale.Tr "repo.projects.board.assigned_to"}} {{.Name}}">{{avatar . 28 "mini mr-3"}}</a>
+									<a class="tooltip" target="_blank" href="{{.HomeLink}}" data-content="{{$.locale.Tr "repo.projects.board.assigned_to"}} {{.Name}}">{{avatar $.Context . 28 "mini gt-mr-3"}}</a>
 								{{end}}
 							</div>
 						</div>
diff --git a/templates/repo/pulls/files.tmpl b/templates/repo/pulls/files.tmpl
index e5e91bf5c..c3e32325d 100644
--- a/templates/repo/pulls/files.tmpl
+++ b/templates/repo/pulls/files.tmpl
@@ -5,7 +5,7 @@
 
 <div role="main" aria-label="{{.Title}}" class="page-content repository view issue pull files diff">
 	{{template "repo/header" .}}
-	<div class="ui container {{if .IsSplitStyle}}fluid padded{{end}}">
+	<div class="ui container fluid padded">
 		<div class="navbar">
 			{{template "repo/issue/navbar" .}}
 			<div class="ui right">
diff --git a/templates/repo/pulls/fork.tmpl b/templates/repo/pulls/fork.tmpl
index d3e017aa0..930d5afa6 100644
--- a/templates/repo/pulls/fork.tmpl
+++ b/templates/repo/pulls/fork.tmpl
@@ -14,20 +14,20 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser 28 "mini"}}
+								{{avatar $.Context .ContextUser 28 "mini"}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu">
 								{{if .CanForkToUser}}
 									<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}">
-										{{avatar .SignedUser 28 "mini"}}
+										{{avatar $.Context .SignedUser 28 "mini"}}
 										<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 									</div>
 								{{end}}
 								{{range .Orgs}}
 									<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-										{{avatar . 28 "mini"}}
+										{{avatar $.Context . 28 "mini"}}
 										<span class="truncated-item-name">{{.ShortName 40}}</span>
 									</div>
 								{{end}}
diff --git a/templates/repo/release/list.tmpl b/templates/repo/release/list.tmpl
index f38106cfd..66147f816 100644
--- a/templates/repo/release/list.tmpl
+++ b/templates/repo/release/list.tmpl
@@ -12,7 +12,7 @@
 			{{end}}
 		</h2>
 		{{if .EnableFeed}}
-			<a href="{{.RepoLink}}/{{if .PageIsTagList}}tags{{else}}releases{{end}}.rss"><i class="ui grey icon tooltip ml-3" data-content="{{.locale.Tr "rss_feed"}}" data-position="top center">{{svg "octicon-rss" 18}}</i></a>
+			<a href="{{.RepoLink}}/{{if .PageIsTagList}}tags{{else}}releases{{end}}.rss"><i class="ui grey icon tooltip gt-ml-3" data-content="{{.locale.Tr "rss_feed"}}" data-position="top center">{{svg "octicon-rss" 18}}</i></a>
 		{{end}}
 		{{if (and .CanCreateRelease (not .PageIsTagList))}}
 			<a class="ui right small green button" href="{{$.RepoLink}}/releases/new">
@@ -23,8 +23,8 @@
 		<div class="ui divider"></div>
 		{{if gt .ReleasesNum 0}}
 		<h4 class="ui top attached header">
-			<div class="five wide column df ac">
-				{{svg "octicon-tag" 16 "mr-2"}}{{.locale.Tr "repo.release.tags"}}
+			<div class="five wide column gt-df gt-ac">
+				{{svg "octicon-tag" 16 "gt-mr-2"}}{{.locale.Tr "repo.release.tags"}}
 			</div>
 		</h4>
 		<div class="ui attached table segment">
@@ -34,26 +34,26 @@
 					{{range $idx, $release := .Releases}}
 						<tr>
 							<td class="tag">
-								<h3 class="release-tag-name mb-3">
-									<a class="df ac" href="{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}" rel="nofollow">{{.TagName}}</a>
+								<h3 class="release-tag-name gt-mb-3">
+									<a class="gt-df gt-ac" href="{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}" rel="nofollow">{{.TagName}}</a>
 								</h3>
-								<div class="download df ac">
+								<div class="download gt-df gt-ac">
 									{{if $.Permission.CanRead $.UnitTypeCode}}
-										<a class="mr-3 mono muted" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}}</a>
+										<a class="gt-mr-3 gt-mono muted" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "gt-mr-2"}}{{ShortSha .Sha1}}</a>
 										{{if not $.DisableDownloadSourceArchives}}
-											<a class="archive-link mr-3 muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.zip" rel="nofollow">{{svg "octicon-file-zip" 16 "mr-2"}}ZIP</a>
-											<a class="archive-link mr-3 muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip" 16 "mr-2"}}TAR.GZ</a>
+											<a class="archive-link gt-mr-3 muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.zip" rel="nofollow">{{svg "octicon-file-zip" 16 "gt-mr-2"}}ZIP</a>
+											<a class="archive-link gt-mr-3 muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip" 16 "gt-mr-2"}}TAR.GZ</a>
 										{{end}}
 										{{if (and $.CanCreateRelease $release.IsTag)}}
-											<a class="mr-3 muted" href="{{$.RepoLink}}/releases/new?tag={{.TagName}}">{{svg "octicon-tag" 16 "mr-2"}}{{$.locale.Tr "repo.release.new_release"}}</a>
+											<a class="gt-mr-3 muted" href="{{$.RepoLink}}/releases/new?tag={{.TagName}}">{{svg "octicon-tag" 16 "gt-mr-2"}}{{$.locale.Tr "repo.release.new_release"}}</a>
 										{{end}}
 										{{if (and ($.Permission.CanWrite $.UnitTypeCode) $release.IsTag)}}
-											<a class="ui delete-button mr-3 muted" data-url="{{$.RepoLink}}/tags/delete" data-id="{{.ID}}">
-												{{svg "octicon-trash" 16 "mr-2"}}{{$.locale.Tr "repo.release.delete_tag"}}
+											<a class="ui delete-button gt-mr-3 muted" data-url="{{$.RepoLink}}/tags/delete" data-id="{{.ID}}">
+												{{svg "octicon-trash" 16 "gt-mr-2"}}{{$.locale.Tr "repo.release.delete_tag"}}
 											</a>
 										{{end}}
 										{{if (not $release.IsTag)}}
-											<a class="mr-3 muted" href="{{$.RepoLink}}/releases/tag/{{.TagName | PathEscapeSegments}}">{{svg "octicon-tag" 16 "mr-2"}}{{$.locale.Tr "repo.release.detail"}}</a>
+											<a class="gt-mr-3 muted" href="{{$.RepoLink}}/releases/tag/{{.TagName | PathEscapeSegments}}">{{svg "octicon-tag" 16 "gt-mr-2"}}{{$.locale.Tr "repo.release.detail"}}</a>
 										{{end}}
 									{{end}}
 								</div>
@@ -68,14 +68,14 @@
 		<ul id="release-list">
 			{{range $idx, $release := .Releases}}
 				<li class="ui grid">
-					<div class="ui four wide column meta mt-2">
+					<div class="ui four wide column meta gt-mt-2">
 						{{if .IsTag}}
 							{{if .CreatedUnix}}<span class="time">{{TimeSinceUnix .CreatedUnix $.locale}}</span>{{end}}
 						{{else}}
-							<a class="df ac je muted" href="{{if not .Sha1}}#{{else}}{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}{{end}}" rel="nofollow">{{svg "octicon-tag" 16 "mr-2"}}{{.TagName}}</a>
+							<a class="gt-df gt-ac gt-je muted" href="{{if not .Sha1}}#{{else}}{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}{{end}}" rel="nofollow">{{svg "octicon-tag" 16 "gt-mr-2"}}{{.TagName}}</a>
 							{{if .Sha1}}
 								<span class="commit">
-									<a class="mono muted" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}}</a>
+									<a class="gt-mono muted" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "gt-mr-2"}}{{ShortSha .Sha1}}</a>
 								</span>
 								{{template "repo/branch_dropdown" dict "root" $ "release" .}}
 							{{end}}
@@ -83,15 +83,15 @@
 					</div>
 					<div class="ui twelve wide column detail">
 						{{if .IsTag}}
-							<div class="df ac sb fw mb-3">
-								<h4 class="release-list-title df ac">
-									<a class="df ac" href="{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}" rel="nofollow">{{svg "octicon-tag" 24 "mr-3"}}{{.TagName}}</a>
+							<div class="gt-df gt-ac gt-sb gt-fw gt-mb-3">
+								<h4 class="release-list-title gt-df gt-ac">
+									<a class="gt-df gt-ac" href="{{$.RepoLink}}/src/tag/{{.TagName | PathEscapeSegments}}" rel="nofollow">{{svg "octicon-tag" 24 "gt-mr-3"}}{{.TagName}}</a>
 								</h4>
 							</div>
 							<p class="text grey">
 								{{if gt .Publisher.ID 0}}
 								<span class="author">
-									{{avatar .Publisher 20}}
+									{{avatar $.Context .Publisher 20}}
 									<a href="{{.Publisher.HomeLink}}">{{.Publisher.Name}}</a>
 								</span>
 								<span class="released">
@@ -106,7 +106,7 @@
 							</p>
 							<div class="download">
 							{{if $.Permission.CanRead $.UnitTypeCode}}
-								<a class="mono muted" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "mr-2"}}{{ShortSha .Sha1}}</a>
+								<a class="gt-mono muted" href="{{$.RepoLink}}/src/commit/{{.Sha1}}" rel="nofollow">{{svg "octicon-git-commit" 16 "gt-mr-2"}}{{ShortSha .Sha1}}</a>
 								{{if not $.DisableDownloadSourceArchives}}
 									<a class="archive-link muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.zip" rel="nofollow">{{svg "octicon-file-zip"}}&nbsp;ZIP</a>
 									<a class="archive-link muted" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip"}}&nbsp;TAR.GZ</a>
@@ -114,20 +114,20 @@
 							{{end}}
 							</div>
 						{{else}}
-							<div class="df ac sb fw mb-3">
-								<h4 class="release-list-title df ac">
+							<div class="gt-df gt-ac gt-sb gt-fw gt-mb-3">
+								<h4 class="release-list-title gt-df gt-ac">
 									<a href="{{$.RepoLink}}/releases/tag/{{.TagName | PathEscapeSegments}}">{{.Title}}</a>
 									{{if .IsDraft}}
-										<span class="ui yellow label ml-3 mt-1">{{$.locale.Tr "repo.release.draft"}}</span>
+										<span class="ui yellow label gt-ml-3 gt-mt-1">{{$.locale.Tr "repo.release.draft"}}</span>
 									{{else if .IsPrerelease}}
-										<span class="ui orange label ml-3 mt-1">{{$.locale.Tr "repo.release.prerelease"}}</span>
+										<span class="ui orange label gt-ml-3 gt-mt-1">{{$.locale.Tr "repo.release.prerelease"}}</span>
 									{{else if not .IsTag}}
-										<span class="ui green label ml-3 mt-1">{{$.locale.Tr "repo.release.stable"}}</span>
+										<span class="ui green label gt-ml-3 gt-mt-1">{{$.locale.Tr "repo.release.stable"}}</span>
 									{{end}}
 								</h4>
-								<div class="df ac">
+								<div class="gt-df gt-ac">
 									{{if $.CanCreateRelease}}
-										<a class="muted tooltip ml-3 df ac" data-content="{{$.locale.Tr "repo.release.edit"}}" href="{{$.RepoLink}}/releases/edit/{{.TagName | PathEscapeSegments}}" rel="nofollow">
+										<a class="muted tooltip gt-ml-3 gt-df gt-ac" data-content="{{$.locale.Tr "repo.release.edit"}}" href="{{$.RepoLink}}/releases/edit/{{.TagName | PathEscapeSegments}}" rel="nofollow">
 											{{svg "octicon-pencil"}}
 										</a>
 									{{end}}
@@ -136,9 +136,9 @@
 							<p class="text grey">
 								<span class="author">
 								{{if .OriginalAuthor}}
-									{{svg "octicon-mark-github" 16 "mr-2"}}{{.OriginalAuthor}}
+									{{svg "octicon-mark-github" 16 "gt-mr-2"}}{{.OriginalAuthor}}
 								{{else if .Publisher}}
-									{{avatar .Publisher 20}}
+									{{avatar $.Context .Publisher 20}}
 									<a href="{{.Publisher.HomeLink}}">{{.Publisher.GetDisplayName}}</a>
 								{{else}}
 									Ghost
@@ -157,17 +157,17 @@
 							<div class="markup desc">
 								{{Str2html .Note}}
 							</div>
-							<details class="download border-secondary-top mt-4 pt-4" {{if eq $idx 0}}open{{end}}>
-								<summary class="mb-4">
+							<details class="download gt-border-secondary-top gt-mt-4 gt-pt-4" {{if eq $idx 0}}open{{end}}>
+								<summary class="gt-mb-4">
 									{{$.locale.Tr "repo.release.downloads"}}
 								</summary>
 								<ul class="list">
 									{{if and (not $.DisableDownloadSourceArchives) (not .IsDraft) ($.Permission.CanRead $.UnitTypeCode)}}
 										<li>
-											<a class="archive-link" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.zip" rel="nofollow"><strong>{{svg "octicon-file-zip" 16 "mr-2"}}{{$.locale.Tr "repo.release.source_code"}} (ZIP)</strong></a>
+											<a class="archive-link" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.zip" rel="nofollow"><strong>{{svg "octicon-file-zip" 16 "gt-mr-2"}}{{$.locale.Tr "repo.release.source_code"}} (ZIP)</strong></a>
 										</li>
 										<li>
-											<a class="archive-link" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.tar.gz" rel="nofollow"><strong>{{svg "octicon-file-zip" 16 "mr-2"}}{{$.locale.Tr "repo.release.source_code"}} (TAR.GZ)</strong></a>
+											<a class="archive-link" href="{{$.RepoLink}}/archive/{{.TagName | PathEscapeSegments}}.tar.gz" rel="nofollow"><strong>{{svg "octicon-file-zip" 16 "gt-mr-2"}}{{$.locale.Tr "repo.release.source_code"}} (TAR.GZ)</strong></a>
 										</li>
 									{{end}}
 									{{if .Attachments}}
@@ -180,7 +180,7 @@
 													</span>
 												</span>
 												<a target="_blank" rel="noopener noreferrer" href="{{.DownloadURL}}">
-													<strong>{{svg "octicon-package" 16 "mr-2"}}{{.Name}}</strong>
+													<strong>{{svg "octicon-package" 16 "gt-mr-2"}}{{.Name}}</strong>
 												</a>
 											</li>
 										{{end}}
@@ -201,7 +201,7 @@
 {{if (and ($.Permission.CanWrite $.UnitTypeCode) .PageIsTagList)}}
 	<div class="ui small basic delete modal">
 		<div class="ui header">
-			{{svg "octicon-trash" 16 "mr-2"}}
+			{{svg "octicon-trash" 16 "gt-mr-2"}}
 			{{.locale.Tr "repo.release.delete_tag"}}
 		</div>
 		<div class="content">
diff --git a/templates/repo/release/new.tmpl b/templates/repo/release/new.tmpl
index 738b3bd17..37d7ca032 100644
--- a/templates/repo/release/new.tmpl
+++ b/templates/repo/release/new.tmpl
@@ -59,15 +59,15 @@
 				</div>
 				{{range .attachments}}
 					<div class="field" id="attachment-{{.ID}}">
-						<div class="ui right df ac wrap_remove">
+						<div class="ui right gt-df gt-ac wrap_remove">
 							<a class="ui mini compact red button remove-rel-attach" data-id="{{.ID}}" data-uuid="{{.UUID}}">
 								{{$.locale.Tr "remove"}}
 							</a>
 						</div>
-						<div class="df ac">
-							<input name="attachment-edit-{{.UUID}}" class="mr-3 attachment_edit" required value="{{.Name}}"/>
+						<div class="gt-df gt-ac">
+							<input name="attachment-edit-{{.UUID}}" class="gt-mr-3 attachment_edit" required value="{{.Name}}"/>
 							<input name="attachment-del-{{.UUID}}" type="hidden" value="false"/>
-							<span class="ui text grey mr-3">{{.Size | FileSize}}</span>
+							<span class="ui text grey gt-mr-3">{{.Size | FileSize}}</span>
 							<span class="tooltip" data-content="{{$.locale.Tr "repo.release.download_count" (.DownloadCount | PrettyNumber)}}">
 								{{svg "octicon-info"}}
 							</span>
diff --git a/templates/repo/search.tmpl b/templates/repo/search.tmpl
index e4f1d01a0..21f758e4a 100644
--- a/templates/repo/search.tmpl
+++ b/templates/repo/search.tmpl
@@ -9,7 +9,7 @@
 					<div class="ui dropdown selection tooltip{{if .CodeIndexerUnavailable}} disabled{{end}}" data-content="{{.locale.Tr "repo.search.type.tooltip"}}">
 						<input name="t" type="hidden"{{if .CodeIndexerUnavailable}} disabled{{end}} value="{{.queryType}}">{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 						<div class="text">{{.locale.Tr (printf "repo.search.%s" (or .queryType "fuzzy"))}}</div>
-						<div class="menu transition hidden" tabindex="-1" style="display: block !important;">
+						<div class="menu">
 							<div class="item tooltip" data-value="" data-content="{{.locale.Tr "repo.search.fuzzy.tooltip"}}">{{.locale.Tr "repo.search.fuzzy"}}</div>
 							<div class="item tooltip" data-value="match" data-content="{{.locale.Tr "repo.search.match.tooltip"}}">{{.locale.Tr "repo.search.match"}}</div>
 						</div>
@@ -27,10 +27,10 @@
 				{{.locale.Tr "repo.search.results" (.Keyword|Escape) (.RepoLink|Escape) (.RepoName|Escape) | Str2html}}
 			</h3>
 			{{if .SearchResults}}
-				<div class="df ac fw">
+				<div class="gt-df gt-ac gt-fw">
 					{{range $term := .SearchResultLanguages}}
-					<a class="ui text-label df ac mr-1 my-1 {{if eq $.Language $term.Language}}primary {{end}}basic label" href="{{$.SourcePath}}/search?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}{{if ne $.queryType ""}}&t={{$.queryType}}{{end}}">
-						<i class="color-icon mr-3" style="background-color: {{$term.Color}}"></i>
+					<a class="ui text-label gt-df gt-ac gt-mr-1 gt-my-1 {{if eq $.Language $term.Language}}primary {{end}}basic label" href="{{$.SourcePath}}/search?q={{$.Keyword}}{{if ne $.Language $term.Language}}&l={{$term.Language}}{{end}}{{if ne $.queryType ""}}&t={{$.queryType}}{{end}}">
+						<i class="color-icon gt-mr-3" style="background-color: {{$term.Color}}"></i>
 						{{$term.Language}}
 						<div class="detail">{{$term.Count}}</div>
 					</a>
diff --git a/templates/repo/settings/branches.tmpl b/templates/repo/settings/branches.tmpl
index f7127fd79..6e51fc7bb 100644
--- a/templates/repo/settings/branches.tmpl
+++ b/templates/repo/settings/branches.tmpl
@@ -29,7 +29,7 @@
 								{{end}}
 							</select>{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="default text">{{.Repository.DefaultBranch}}</div>
-							<div class="menu transition hidden" tabindex="-1" style="display: block !important;">
+							<div class="menu">
 								{{range .Branches}}
 									<div class="item" data-value="{{.}}">{{.}}</div>
 								{{end}}
@@ -98,7 +98,7 @@
 
 <div class="ui small basic delete modal">
 	<div class="ui header">
-		{{svg "octicon-trash" 16 "mr-2"}}
+		{{svg "octicon-trash" 16 "gt-mr-2"}}
 		{{.locale.Tr "repo.settings.protected_branch_deletion"}}
 	</div>
 	<div class="content">
diff --git a/templates/repo/settings/collaboration.tmpl b/templates/repo/settings/collaboration.tmpl
index 1d0c66036..bee5bc81c 100644
--- a/templates/repo/settings/collaboration.tmpl
+++ b/templates/repo/settings/collaboration.tmpl
@@ -13,7 +13,7 @@
 				<div class="item ui grid">
 					<div class="ui five wide column">
 						<a href="{{.HomeLink}}">
-							{{avatar .}}
+							{{avatar $.Context .}}
 							{{.DisplayName}}
 						</a>
 					</div>
diff --git a/templates/repo/settings/deploy_keys.tmpl b/templates/repo/settings/deploy_keys.tmpl
index ff9628d35..22fddeb4d 100644
--- a/templates/repo/settings/deploy_keys.tmpl
+++ b/templates/repo/settings/deploy_keys.tmpl
@@ -15,7 +15,7 @@
 			</div>
 		</h4>
 		<div class="ui attached segment">
-			<div class="{{if not .HasError}}hide{{end}} mb-4" id="add-deploy-key-panel">
+			<div class="{{if not .HasError}}gt-hidden{{end}} gt-mb-4" id="add-deploy-key-panel">
 				<form class="ui form" action="{{.Link}}" method="post">
 					{{.CsrfTokenHtml}}
 					<div class="field">
@@ -31,7 +31,7 @@
 					</div>
 					<div class="field">
 						<div class="ui checkbox {{if .Err_IsWritable}}error{{end}}">
-							<input id="ssh-key-is-writable" name="is_writable" class="hidden" type="checkbox" value="1">
+							<input id="ssh-key-is-writable" name="is_writable" type="checkbox" value="1">
 							<label for="is_writable">
 								{{.locale.Tr "repo.settings.is_writable"}}
 							</label>
diff --git a/templates/repo/settings/githook_edit.tmpl b/templates/repo/settings/githook_edit.tmpl
index a4f877822..d4df95b29 100644
--- a/templates/repo/settings/githook_edit.tmpl
+++ b/templates/repo/settings/githook_edit.tmpl
@@ -18,7 +18,7 @@
 					</div>
 					<div class="field">
 						<label for="content">{{$.locale.Tr "repo.settings.githook_content"}}</label>
-						<textarea id="content" name="content" class="hide">{{if .IsActive}}{{.Content}}{{else}}{{.Sample}}{{end}}</textarea>
+						<textarea id="content" name="content" class="gt-hidden">{{if .IsActive}}{{.Content}}{{else}}{{.Sample}}{{end}}</textarea>
 						<div class="editor-loading is-loading"></div>
 					</div>
 					<div class="inline field">
diff --git a/templates/repo/settings/githooks.tmpl b/templates/repo/settings/githooks.tmpl
index 81d61fcd1..a72d5ba29 100644
--- a/templates/repo/settings/githooks.tmpl
+++ b/templates/repo/settings/githooks.tmpl
@@ -14,9 +14,9 @@
 				</div>
 				{{range .Hooks}}
 					<div class="item truncated-item-container">
-						<span class="text {{if .IsActive}}green{{else}}grey{{end}} mr-3">{{svg "octicon-dot-fill" 22}}</span>
-						<span class="text truncate f1 mr-3">{{.Name}}</span>
-						<a class="muted ui right p-3" href="{{$.RepoLink}}/settings/hooks/git/{{.Name|PathEscape}}">
+						<span class="text {{if .IsActive}}green{{else}}grey{{end}} gt-mr-3">{{svg "octicon-dot-fill" 22}}</span>
+						<span class="text truncate gt-f1 gt-mr-3">{{.Name}}</span>
+						<a class="muted ui right gt-p-3" href="{{$.RepoLink}}/settings/hooks/git/{{.Name|PathEscape}}">
 							{{svg "octicon-pencil"}}
 						</a>
 					</div>
diff --git a/templates/repo/settings/lfs_file.tmpl b/templates/repo/settings/lfs_file.tmpl
index eb67de20a..450601dc9 100644
--- a/templates/repo/settings/lfs_file.tmpl
+++ b/templates/repo/settings/lfs_file.tmpl
@@ -9,7 +9,7 @@
 				<a href="{{.LFSFilesLink}}">{{.locale.Tr "repo.settings.lfs"}}</a> / <span class="truncate sha">{{.LFSFile.Oid}}</span>
 				<div class="ui right">
 					{{if .EscapeStatus.Escaped}}
-						<a class="ui mini basic button unescape-button" style="display: none;">{{.locale.Tr "repo.unescape_control_characters"}}</a>
+						<a class="ui mini basic button unescape-button gt-hidden">{{.locale.Tr "repo.unescape_control_characters"}}</a>
 						<a class="ui mini basic button escape-button">{{.locale.Tr "repo.escape_control_characters"}}</a>
 					{{end}}
 					<a class="ui primary show-panel button" href="{{.LFSFilesLink}}/find?oid={{.LFSFile.Oid}}&size={{.LFSFile.Size}}">{{$.locale.Tr "repo.settings.lfs_findcommits"}}</a>
@@ -35,7 +35,7 @@
 									<strong>{{.locale.Tr "repo.audio_not_supported_in_browser"}}</strong>
 								</audio>
 							{{else if .IsPDFFile}}
-								<iframe width="100%" height="600px" src="{{AppSubUrl}}/vendor/plugins/pdfjs/web/viewer.html?file={{$.RawFileLink}}"></iframe>
+								<iframe width="100%" height="600px" src="{{AssetUrlPrefix}}/vendor/plugins/pdfjs/web/viewer.html?file={{$.RawFileLink}}"></iframe>
 							{{else}}
 								<a href="{{$.RawFileLink}}" rel="nofollow" class="btn btn-gray btn-radius">{{.locale.Tr "repo.file_view_raw"}}</a>
 							{{end}}
diff --git a/templates/repo/settings/lfs_locks.tmpl b/templates/repo/settings/lfs_locks.tmpl
index 73bfe08ad..ff9648ac1 100644
--- a/templates/repo/settings/lfs_locks.tmpl
+++ b/templates/repo/settings/lfs_locks.tmpl
@@ -35,7 +35,7 @@
 							</td>
 							<td>
 								<a href="{{$.Owner.HomeLink}}">
-									{{avatar $.Owner}}
+									{{avatar $.Context $.Owner}}
 									{{$.Owner.DisplayName}}
 								</a>
 							</td>
diff --git a/templates/repo/settings/options.tmpl b/templates/repo/settings/options.tmpl
index cc298ddd8..030c77b88 100644
--- a/templates/repo/settings/options.tmpl
+++ b/templates/repo/settings/options.tmpl
@@ -126,10 +126,10 @@
 										<p class="help">{{.locale.Tr "repo.mirror_address_desc"}}</p>
 									</div>
 									<details class="ui optional field" {{if or .Err_Auth $address.Username}}open{{end}}>
-										<summary class="p-2">
+										<summary class="gt-p-2">
 											{{.locale.Tr "repo.need_auth"}}
 										</summary>
-										<div class="p-2">
+										<div class="gt-p-2">
 											<div class="inline field {{if .Err_Auth}}error{{end}}">
 												<label for="mirror_username">{{.locale.Tr "username"}}</label>
 												<input id="mirror_username" name="mirror_username" value="{{$address.Username}}" {{if not .mirror_username}}data-need-clear="true"{{end}}>
@@ -205,10 +205,10 @@
 											<p class="help">{{.locale.Tr "repo.mirror_address_desc"}}</p>
 										</div>
 										<details class="ui optional field" {{if or .Err_PushMirrorAuth .push_mirror_username}}open{{end}}>
-											<summary class="p-2">
+											<summary class="gt-p-2">
 												{{.locale.Tr "repo.need_auth"}}
 											</summary>
-											<div class="p-2">
+											<div class="gt-p-2">
 												<div class="inline field {{if .Err_PushMirrorAuth}}error{{end}}">
 													<label for="push_mirror_username">{{.locale.Tr "username"}}</label>
 													<input id="push_mirror_username" name="push_mirror_username" value="{{.push_mirror_username}}">
@@ -281,7 +281,7 @@
 						{{else}}
 						<div class="ui radio checkbox">
 						{{end}}
-							<input class="hidden enable-system-radio" tabindex="0" name="enable_external_wiki" type="radio" value="false" data-target="#external_wiki_box" {{if not (.Repository.UnitEnabled $.Context $.UnitTypeExternalWiki)}}checked{{end}}/>
+							<input class="enable-system-radio" tabindex="0" name="enable_external_wiki" type="radio" value="false" data-target="#external_wiki_box" {{if not (.Repository.UnitEnabled $.Context $.UnitTypeExternalWiki)}}checked{{end}}/>
 							<label>{{.locale.Tr "repo.settings.use_internal_wiki"}}</label>
 						</div>
 					</div>
@@ -291,7 +291,7 @@
 						{{else}}
 						<div class="ui radio checkbox">
 						{{end}}
-							<input class="hidden enable-system-radio" tabindex="0" name="enable_external_wiki" type="radio" value="true" data-target="#external_wiki_box" {{if .Repository.UnitEnabled $.Context $.UnitTypeExternalWiki}}checked{{end}}/>
+							<input class="enable-system-radio" tabindex="0" name="enable_external_wiki" type="radio" value="true" data-target="#external_wiki_box" {{if .Repository.UnitEnabled $.Context $.UnitTypeExternalWiki}}checked{{end}}/>
 							<label>{{.locale.Tr "repo.settings.use_external_wiki"}}</label>
 						</div>
 					</div>
@@ -323,7 +323,7 @@
 						{{else}}
 						<div class="ui radio checkbox">
 						{{end}}
-							<input class="hidden enable-system-radio" tabindex="0" name="enable_external_tracker" type="radio" value="false" data-context="#internal_issue_box" data-target="#external_issue_box" {{if not (.Repository.UnitEnabled $.Context $.UnitTypeExternalTracker)}}checked{{end}}/>
+							<input class="enable-system-radio" tabindex="0" name="enable_external_tracker" type="radio" value="false" data-context="#internal_issue_box" data-target="#external_issue_box" {{if not (.Repository.UnitEnabled $.Context $.UnitTypeExternalTracker)}}checked{{end}}/>
 							<label>{{.locale.Tr "repo.settings.use_internal_issue_tracker"}}</label>
 						</div>
 					</div>
@@ -359,7 +359,7 @@
 						{{else}}
 						<div class="ui radio checkbox">
 						{{end}}
-							<input class="hidden enable-system-radio" tabindex="0" name="enable_external_tracker" type="radio" value="true" data-context="#internal_issue_box" data-target="#external_issue_box" {{if .Repository.UnitEnabled $.Context $.UnitTypeExternalTracker}}checked{{end}}/>
+							<input class="enable-system-radio" tabindex="0" name="enable_external_tracker" type="radio" value="true" data-context="#internal_issue_box" data-target="#external_issue_box" {{if .Repository.UnitEnabled $.Context $.UnitTypeExternalTracker}}checked{{end}}/>
 							<label>{{.locale.Tr "repo.settings.use_external_issue_tracker"}}</label>
 						</div>
 					</div>
@@ -478,59 +478,41 @@
 					</div>
 					<div class="field{{if not $pullRequestEnabled}} disabled{{end}}" id="pull_box">
 						<div class="field">
-							<div class="ui checkbox">
-								<input name="pulls_ignore_whitespace" type="checkbox" {{if and $pullRequestEnabled ($prUnit.PullRequestsConfig.IgnoreWhitespaceConflicts)}}checked{{end}}>
-								<label>{{.locale.Tr "repo.settings.pulls.ignore_whitespace"}}</label>
-							</div>
+							<p>
+								{{.locale.Tr "repo.settings.merge_style_desc"}}
+							</p>
 						</div>
 						<div class="field">
 							<div class="ui checkbox">
 								<input name="pulls_allow_merge" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.AllowMerge)}}checked{{end}}>
-								<label>{{.locale.Tr "repo.settings.pulls.allow_merge_commits"}}</label>
+								<label>{{.locale.Tr "repo.pulls.merge_pull_request"}}</label>
 							</div>
 						</div>
 						<div class="field">
 							<div class="ui checkbox">
 								<input name="pulls_allow_rebase" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.AllowRebase)}}checked{{end}}>
-								<label>{{.locale.Tr "repo.settings.pulls.allow_rebase_merge"}}</label>
+								<label>{{.locale.Tr "repo.pulls.rebase_merge_pull_request"}}</label>
 							</div>
 						</div>
 						<div class="field">
 							<div class="ui checkbox">
 								<input name="pulls_allow_rebase_merge" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.AllowRebaseMerge)}}checked{{end}}>
-								<label>{{.locale.Tr "repo.settings.pulls.allow_rebase_merge_commit"}}</label>
+								<label>{{.locale.Tr "repo.pulls.rebase_merge_commit_pull_request"}}</label>
 							</div>
 						</div>
 						<div class="field">
 							<div class="ui checkbox">
 								<input name="pulls_allow_squash" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.AllowSquash)}}checked{{end}}>
-								<label>{{.locale.Tr "repo.settings.pulls.allow_squash_commits"}}</label>
+								<label>{{.locale.Tr "repo.pulls.squash_merge_pull_request"}}</label>
 							</div>
 						</div>
 						<div class="field">
 							<div class="ui checkbox">
 								<input name="pulls_allow_manual_merge" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.AllowManualMerge)}}checked{{end}}>
-								<label>{{.locale.Tr "repo.settings.pulls.allow_manual_merge"}}</label>
-							</div>
-						</div>
-						<div class="field">
-							<div class="ui checkbox">
-								<input name="enable_autodetect_manual_merge" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.AutodetectManualMerge)}}checked{{end}}>
-								<label>{{.locale.Tr "repo.settings.pulls.enable_autodetect_manual_merge"}}</label>
-							</div>
-						</div>
-						<div class="field">
-							<div class="ui checkbox">
-								<input name="pulls_allow_rebase_update" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.AllowRebaseUpdate)}}checked{{end}}>
-								<label>{{.locale.Tr "repo.settings.pulls.allow_rebase_update"}}</label>
-							</div>
-						</div>
-						<div class="field">
-							<div class="ui checkbox">
-								<input name="default_delete_branch_after_merge" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge)}}checked{{end}}>
-								<label>{{.locale.Tr "repo.settings.pulls.default_delete_branch_after_merge"}}</label>
+								<label>{{.locale.Tr "repo.pulls.merge_manually"}}</label>
 							</div>
 						</div>
+
 						<div class="field">
 							<p>
 								{{.locale.Tr "repo.settings.default_merge_style_desc"}}
@@ -556,7 +538,7 @@
 										{{.locale.Tr "repo.pulls.squash_merge_pull_request"}}
 									{{end}}
 								</div>
-								<div class="menu transition hidden" tabindex="-1" style="display: block !important;">
+								<div class="menu">
 									<div class="item" data-value="merge">{{.locale.Tr "repo.pulls.merge_pull_request"}}</div>
 									<div class="item" data-value="rebase">{{.locale.Tr "repo.pulls.rebase_merge_pull_request"}}</div>
 									<div class="item" data-value="rebase-merge">{{.locale.Tr "repo.pulls.rebase_merge_commit_pull_request"}}</div>
@@ -564,6 +546,36 @@
 								</div>
 							</div>
 						</div>
+						<div class="field">
+							<div class="ui checkbox">
+								<input name="default_allow_maintainer_edit" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.DefaultAllowMaintainerEdit)}}checked{{end}}>
+								<label>{{.locale.Tr "repo.settings.pulls.default_allow_edits_from_maintainers"}}</label>
+							</div>
+						</div>
+						<div class="field">
+							<div class="ui checkbox">
+								<input name="pulls_allow_rebase_update" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.AllowRebaseUpdate)}}checked{{end}}>
+								<label>{{.locale.Tr "repo.settings.pulls.allow_rebase_update"}}</label>
+							</div>
+						</div>
+						<div class="field">
+							<div class="ui checkbox">
+								<input name="default_delete_branch_after_merge" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge)}}checked{{end}}>
+								<label>{{.locale.Tr "repo.settings.pulls.default_delete_branch_after_merge"}}</label>
+							</div>
+						</div>
+						<div class="field">
+							<div class="ui checkbox">
+								<input name="enable_autodetect_manual_merge" type="checkbox" {{if or (not $pullRequestEnabled) ($prUnit.PullRequestsConfig.AutodetectManualMerge)}}checked{{end}}>
+								<label>{{.locale.Tr "repo.settings.pulls.enable_autodetect_manual_merge"}}</label>
+							</div>
+						</div>
+						<div class="field">
+							<div class="ui checkbox">
+								<input name="pulls_ignore_whitespace" type="checkbox" {{if and $pullRequestEnabled ($prUnit.PullRequestsConfig.IgnoreWhitespaceConflicts)}}checked{{end}}>
+								<label>{{.locale.Tr "repo.settings.pulls.ignore_whitespace"}}</label>
+							</div>
+						</div>
 					</div>
 				{{end}}
 
diff --git a/templates/repo/settings/protected_branch.tmpl b/templates/repo/settings/protected_branch.tmpl
index 030b9d025..88350c599 100644
--- a/templates/repo/settings/protected_branch.tmpl
+++ b/templates/repo/settings/protected_branch.tmpl
@@ -49,7 +49,7 @@
 								<div class="menu">
 									{{range .Users}}
 										<div class="item" data-value="{{.ID}}">
-											{{avatar . 28 "mini"}}
+											{{avatar $.Context . 28 "mini"}}
 											{{.GetDisplayName}}
 										</div>
 									{{end}}
@@ -101,7 +101,7 @@
 								<div class="menu">
 								{{range .Users}}
 									<div class="item" data-value="{{.ID}}">
-										{{avatar . 28 "mini"}}
+										{{avatar $.Context . 28 "mini"}}
 									{{.GetDisplayName}}
 									</div>
 								{{end}}
@@ -181,7 +181,7 @@
 								<div class="menu">
 								{{range .Users}}
 									<div class="item" data-value="{{.ID}}">
-										{{avatar . 28 "mini"}}
+										{{avatar $.Context . 28 "mini"}}
 									{{.GetDisplayName}}
 									</div>
 								{{end}}
diff --git a/templates/repo/settings/tags.tmpl b/templates/repo/settings/tags.tmpl
index 1b2d6f7c8..7b318955e 100644
--- a/templates/repo/settings/tags.tmpl
+++ b/templates/repo/settings/tags.tmpl
@@ -36,7 +36,7 @@
 										<div class="menu">
 											{{range .Users}}
 												<div class="item" data-value="{{.ID}}">
-													{{avatar . 28 "mini"}}
+													{{avatar $.Context . 28 "mini"}}
 													{{.GetDisplayName}}
 												</div>
 											{{end}}
@@ -94,7 +94,7 @@
 												{{$userIDs := .AllowlistUserIDs}}
 												{{range $.Users}}
 													{{if contain $userIDs .ID}}
-														<a class="ui basic label" href="{{.HomeLink}}">{{avatar . 26}} {{.GetDisplayName}}</a>
+														<a class="ui basic label" href="{{.HomeLink}}">{{avatar $.Context . 26}} {{.GetDisplayName}}</a>
 													{{end}}
 												{{end}}
 												{{if $.Owner.IsOrganization}}
@@ -111,7 +111,7 @@
 										</td>
 										<td class="right aligned">
 											<a class="ui tiny primary button" href="{{$.RepoLink}}/settings/tags/{{.ID}}">{{$.locale.Tr "edit"}}</a>
-											<form class="dib" action="{{$.RepoLink}}/settings/tags/delete" method="post">
+											<form class="gt-dib" action="{{$.RepoLink}}/settings/tags/delete" method="post">
 												{{$.CsrfTokenHtml}}
 												<input type="hidden" name="id" value="{{.ID}}" />
 												<button class="ui tiny red button">{{$.locale.Tr "remove"}}</button>
diff --git a/templates/repo/settings/webhook/base_list.tmpl b/templates/repo/settings/webhook/base_list.tmpl
index d082f0b00..61c579951 100644
--- a/templates/repo/settings/webhook/base_list.tmpl
+++ b/templates/repo/settings/webhook/base_list.tmpl
@@ -48,10 +48,10 @@
 		</div>
 		{{range .Webhooks}}
 			<div class="item truncated-item-container">
-				<span class="text {{if eq .LastStatus 1}}green{{else if eq .LastStatus 2}}red{{else}}grey{{end}} mr-3">{{svg "octicon-dot-fill" 22}}</span>
-				<a class="text truncate f1 mr-3" title="{{.URL}}" href="{{$.BaseLink}}/{{.ID}}">{{.URL}}</a>
-				<a class="muted p-3" href="{{$.BaseLink}}/{{.ID}}">{{svg "octicon-pencil"}}</a></span>
-				<a class="delete-button p-3" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}}</a>
+				<span class="text {{if eq .LastStatus 1}}green{{else if eq .LastStatus 2}}red{{else}}grey{{end}} gt-mr-3">{{svg "octicon-dot-fill" 22}}</span>
+				<a class="text truncate gt-f1 gt-mr-3" title="{{.URL}}" href="{{$.BaseLink}}/{{.ID}}">{{.URL}}</a>
+				<a class="muted gt-p-3" href="{{$.BaseLink}}/{{.ID}}">{{svg "octicon-pencil"}}</a></span>
+				<a class="delete-button gt-p-3" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}}</a>
 			</div>
 		{{end}}
 	</div>
diff --git a/templates/repo/settings/webhook/history.tmpl b/templates/repo/settings/webhook/history.tmpl
index 767d66114..bf7fe05de 100644
--- a/templates/repo/settings/webhook/history.tmpl
+++ b/templates/repo/settings/webhook/history.tmpl
@@ -25,7 +25,7 @@
 							</span>
 						</div>
 					</div>
-					<div class="info hide" id="info-{{.ID}}">
+					<div class="info gt-hidden" id="info-{{.ID}}">
 						<div class="ui top attached tabular menu">
 							<a class="item active" data-tab="request-{{.ID}}">{{$.locale.Tr "repo.settings.webhook.request"}}</a>
 							<a class="item" data-tab="response-{{.ID}}">
diff --git a/templates/repo/settings/webhook/settings.tmpl b/templates/repo/settings/webhook/settings.tmpl
index 42bc144b6..57745c040 100644
--- a/templates/repo/settings/webhook/settings.tmpl
+++ b/templates/repo/settings/webhook/settings.tmpl
@@ -4,25 +4,25 @@
 	<div class="grouped event type fields">
 		<div class="field">
 			<div class="ui radio non-events checkbox">
-				<input class="hidden" name="events" type="radio" value="push_only" {{if or $isNew .Webhook.PushOnly}}checked{{end}}>
+				<input name="events" type="radio" value="push_only" {{if or $isNew .Webhook.PushOnly}}checked{{end}}>
 				<label>{{.locale.Tr "repo.settings.event_push_only" | Str2html}}</label>
 			</div>
 		</div>
 		<div class="field">
 			<div class="ui radio non-events checkbox">
-				<input class="hidden" name="events" type="radio" value="send_everything" {{if .Webhook.SendEverything}}checked{{end}}>
+				<input name="events" type="radio" value="send_everything" {{if .Webhook.SendEverything}}checked{{end}}>
 				<label>{{.locale.Tr "repo.settings.event_send_everything" | Str2html}}</label>
 			</div>
 		</div>
 		<div class="field">
 			<div class="ui radio events checkbox">
-				<input class="hidden" name="events" type="radio" value="choose_events" {{if .Webhook.ChooseEvents}}checked{{end}}>
+				<input name="events" type="radio" value="choose_events" {{if .Webhook.ChooseEvents}}checked{{end}}>
 				<label>{{.locale.Tr "repo.settings.event_choose" | Str2html}}</label>
 			</div>
 		</div>
 	</div>
 
-	<div class="events fields ui grid" {{if not .Webhook.ChooseEvents}}style="display:none"{{end}}>
+	<div class="events fields ui grid {{if not .Webhook.ChooseEvents}}gt-hidden{{end}}">
 		<!-- Repository Events -->
 		<div class="fourteen wide column">
 			<label>{{.locale.Tr "repo.settings.event_header_repository"}}</label>
@@ -31,7 +31,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="create" type="checkbox" tabindex="0" {{if .Webhook.Create}}checked{{end}}>
+					<input name="create" type="checkbox" tabindex="0" {{if .Webhook.Create}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_create"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_create_desc"}}</span>
 				</div>
@@ -41,7 +41,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="delete" type="checkbox" tabindex="0" {{if .Webhook.Delete}}checked{{end}}>
+					<input name="delete" type="checkbox" tabindex="0" {{if .Webhook.Delete}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_delete"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_delete_desc"}}</span>
 				</div>
@@ -51,7 +51,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="fork" type="checkbox" tabindex="0" {{if .Webhook.Fork}}checked{{end}}>
+					<input name="fork" type="checkbox" tabindex="0" {{if .Webhook.Fork}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_fork"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_fork_desc"}}</span>
 				</div>
@@ -61,7 +61,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="push" type="checkbox" tabindex="0" {{if .Webhook.Push}}checked{{end}}>
+					<input name="push" type="checkbox" tabindex="0" {{if .Webhook.Push}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_push"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_push_desc"}}</span>
 				</div>
@@ -71,7 +71,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="repository" type="checkbox" tabindex="0" {{if .Webhook.Repository}}checked{{end}}>
+					<input name="repository" type="checkbox" tabindex="0" {{if .Webhook.Repository}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_repository"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_repository_desc"}}</span>
 				</div>
@@ -81,7 +81,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="release" type="checkbox" tabindex="0" {{if .Webhook.Release}}checked{{end}}>
+					<input name="release" type="checkbox" tabindex="0" {{if .Webhook.Release}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_release"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_release_desc"}}</span>
 				</div>
@@ -91,7 +91,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="package" type="checkbox" tabindex="0" {{if .Webhook.Package}}checked{{end}}>
+					<input name="package" type="checkbox" tabindex="0" {{if .Webhook.Package}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_package"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_package_desc"}}</span>
 				</div>
@@ -102,7 +102,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="wiki" type="checkbox" tabindex="0" {{if .Webhook.Wiki}}checked{{end}}>
+					<input name="wiki" type="checkbox" tabindex="0" {{if .Webhook.Wiki}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_wiki"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_wiki_desc"}}</span>
 				</div>
@@ -117,7 +117,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="issues" type="checkbox" tabindex="0" {{if .Webhook.Issues}}checked{{end}}>
+					<input name="issues" type="checkbox" tabindex="0" {{if .Webhook.Issues}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_issues"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_issues_desc"}}</span>
 				</div>
@@ -127,7 +127,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="issue_assign" type="checkbox" tabindex="0" {{if .Webhook.IssueAssign}}checked{{end}}>
+					<input name="issue_assign" type="checkbox" tabindex="0" {{if .Webhook.IssueAssign}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_issue_assign"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_issue_assign_desc"}}</span>
 				</div>
@@ -137,7 +137,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="issue_label" type="checkbox" tabindex="0" {{if .Webhook.IssueLabel}}checked{{end}}>
+					<input name="issue_label" type="checkbox" tabindex="0" {{if .Webhook.IssueLabel}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_issue_label"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_issue_label_desc"}}</span>
 				</div>
@@ -147,7 +147,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="issue_milestone" type="checkbox" tabindex="0" {{if .Webhook.IssueMilestone}}checked{{end}}>
+					<input name="issue_milestone" type="checkbox" tabindex="0" {{if .Webhook.IssueMilestone}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_issue_milestone"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_issue_milestone_desc"}}</span>
 				</div>
@@ -157,7 +157,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="issue_comment" type="checkbox" tabindex="0" {{if .Webhook.IssueComment}}checked{{end}}>
+					<input name="issue_comment" type="checkbox" tabindex="0" {{if .Webhook.IssueComment}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_issue_comment"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_issue_comment_desc"}}</span>
 				</div>
@@ -172,7 +172,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="pull_request" type="checkbox" tabindex="0" {{if .Webhook.PullRequest}}checked{{end}}>
+					<input name="pull_request" type="checkbox" tabindex="0" {{if .Webhook.PullRequest}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_pull_request"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_pull_request_desc"}}</span>
 				</div>
@@ -182,7 +182,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="pull_request_assign" type="checkbox" tabindex="0" {{if .Webhook.PullRequestAssign}}checked{{end}}>
+					<input name="pull_request_assign" type="checkbox" tabindex="0" {{if .Webhook.PullRequestAssign}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_pull_request_assign"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_pull_request_assign_desc"}}</span>
 				</div>
@@ -192,7 +192,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="pull_request_label" type="checkbox" tabindex="0" {{if .Webhook.PullRequestLabel}}checked{{end}}>
+					<input name="pull_request_label" type="checkbox" tabindex="0" {{if .Webhook.PullRequestLabel}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_pull_request_label"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_pull_request_label_desc"}}</span>
 				</div>
@@ -202,7 +202,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="pull_request_milestone" type="checkbox" tabindex="0" {{if .Webhook.PullRequestMilestone}}checked{{end}}>
+					<input name="pull_request_milestone" type="checkbox" tabindex="0" {{if .Webhook.PullRequestMilestone}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_pull_request_milestone"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_pull_request_milestone_desc"}}</span>
 				</div>
@@ -212,7 +212,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="pull_request_comment" type="checkbox" tabindex="0" {{if .Webhook.PullRequestComment}}checked{{end}}>
+					<input name="pull_request_comment" type="checkbox" tabindex="0" {{if .Webhook.PullRequestComment}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_pull_request_comment"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_pull_request_comment_desc"}}</span>
 				</div>
@@ -222,7 +222,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="pull_request_review" type="checkbox" tabindex="0" {{if .Webhook.PullRequestReview}}checked{{end}}>
+					<input name="pull_request_review" type="checkbox" tabindex="0" {{if .Webhook.PullRequestReview}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_pull_request_review"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_pull_request_review_desc"}}</span>
 				</div>
@@ -232,7 +232,7 @@
 		<div class="seven wide column">
 			<div class="field">
 				<div class="ui checkbox">
-					<input class="hidden" name="pull_request_sync" type="checkbox" tabindex="0" {{if .Webhook.PullRequestSync}}checked{{end}}>
+					<input name="pull_request_sync" type="checkbox" tabindex="0" {{if .Webhook.PullRequestSync}}checked{{end}}>
 					<label>{{.locale.Tr "repo.settings.event_pull_request_sync"}}</label>
 					<span class="help">{{.locale.Tr "repo.settings.event_pull_request_sync_desc"}}</span>
 				</div>
@@ -261,7 +261,7 @@
 
 <div class="inline field">
 	<div class="ui checkbox">
-		<input class="hidden" name="active" type="checkbox" tabindex="0" {{if or $isNew .Webhook.IsActive}}checked{{end}}>
+		<input name="active" type="checkbox" tabindex="0" {{if or $isNew .Webhook.IsActive}}checked{{end}}>
 		<label>{{.locale.Tr "repo.settings.active"}}</label>
 		<span class="help">{{.locale.Tr "repo.settings.active_helper"}}</span>
 	</div>
diff --git a/templates/repo/shabox_badge.tmpl b/templates/repo/shabox_badge.tmpl
index 1965935c7..2418d95c6 100644
--- a/templates/repo/shabox_badge.tmpl
+++ b/templates/repo/shabox_badge.tmpl
@@ -3,10 +3,10 @@
 		<div title="{{if eq .verification.TrustStatus "trusted"}}{{else if eq .verification.TrustStatus "untrusted"}}{{$.root.locale.Tr "repo.commits.signed_by_untrusted_user"}}: {{else}}{{$.root.locale.Tr "repo.commits.signed_by_untrusted_user_unmatched"}}: {{end}}{{.verification.Reason}}">
 		{{if ne .verification.SigningUser.ID 0}}
 			{{svg "gitea-lock"}}
-			{{avatar .verification.SigningUser 28 "signature"}}
+			{{avatar $.root.Context .verification.SigningUser 28 "signature"}}
 		{{else}}
 			<span title="{{$.root.locale.Tr "gpg.default_key"}}">{{svg "gitea-lock-cog"}}</span>
-			{{avatarByEmail .verification.SigningEmail "" 28 "signature"}}
+			{{avatarByEmail $.root.Context .verification.SigningEmail "" 28 "signature"}}
 		{{end}}
 		</div>
 	{{else}}
diff --git a/templates/repo/sub_menu.tmpl b/templates/repo/sub_menu.tmpl
index e74823e36..5c1688d01 100644
--- a/templates/repo/sub_menu.tmpl
+++ b/templates/repo/sub_menu.tmpl
@@ -1,5 +1,5 @@
 {{if and (not .HideRepoInfo) (not .IsBlame)}}
-<div class="ui segments repository-summary{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo) .LanguageStats}} repository-summary-language-stats{{end}} mt-2 mb-0">
+<div class="ui segments repository-summary{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo) .LanguageStats}} repository-summary-language-stats{{end}} gt-mt-2 gt-mb-0">
 	<div class="ui segment sub-menu repository-menu">
 		<div class="ui two horizontal center link list">
 			{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo)}}
@@ -21,12 +21,12 @@
 		</div>
 	</div>
 	{{if and (.Permission.CanRead $.UnitTypeCode) (not .IsEmptyRepo) .LanguageStats}}
-	<div class="ui segment sub-menu language-stats-details" style="display: none">
+	<div class="ui segment sub-menu language-stats-details gt-hidden">
 		<div class="ui horizontal center link list">
 			{{range .LanguageStats}}
-			<div class="item df ac jc">
-				<i class="color-icon mr-3" style="background-color: {{.Color}}"></i>
-				<span class="bold mr-3">
+			<div class="item gt-df gt-ac gt-jc">
+				<i class="color-icon gt-mr-3" style="background-color: {{.Color}}"></i>
+				<span class="gt-bold gt-mr-3">
 					{{if eq .Language "other"}}
 						{{$.locale.Tr "repo.language_other"}}
 					{{else}}
diff --git a/templates/repo/unicode_escape_prompt.tmpl b/templates/repo/unicode_escape_prompt.tmpl
index ab3452efa..d55bd0150 100644
--- a/templates/repo/unicode_escape_prompt.tmpl
+++ b/templates/repo/unicode_escape_prompt.tmpl
@@ -1,6 +1,6 @@
 {{if .EscapeStatus}}
 	{{if .EscapeStatus.HasInvisible}}
-		<div class="ui error message unicode-escape-prompt tl">
+		<div class="ui error message unicode-escape-prompt gt-tl">
 			<span class="close icon hide-panel button" data-panel-closest=".message">{{svg "octicon-x" 16 "close inside"}}</span>
 			<div class="header">
 				{{$.root.locale.Tr "repo.invisible_runes_header"}}
@@ -11,7 +11,7 @@
 			{{end}}
 		</div>
 	{{else if .EscapeStatus.HasAmbiguous}}
-		<div class="ui warning message unicode-escape-prompt tl">
+		<div class="ui warning message unicode-escape-prompt gt-tl">
 			<span class="close icon hide-panel button" data-panel-closest=".message">{{svg "octicon-x" 16 "close inside"}}</span>
 			<div class="header">
 				{{$.root.locale.Tr "repo.ambiguous_runes_header"}}
diff --git a/templates/repo/user_cards.tmpl b/templates/repo/user_cards.tmpl
index efc853082..b7bc3060b 100644
--- a/templates/repo/user_cards.tmpl
+++ b/templates/repo/user_cards.tmpl
@@ -8,7 +8,7 @@
 		{{range .Cards}}
 			<li class="item ui segment">
 				<a href="{{.HomeLink}}">
-					{{avatar .}}
+					{{avatar $.Context .}}
 				</a>
 				<h3 class="name"><a href="{{.HomeLink}}">{{.DisplayName}}</a></h3>
 
diff --git a/templates/repo/view_file.tmpl b/templates/repo/view_file.tmpl
index e92aeb070..2e0f4d65f 100644
--- a/templates/repo/view_file.tmpl
+++ b/templates/repo/view_file.tmpl
@@ -6,16 +6,16 @@
 			</div>
 		</div>
 	{{end}}
-	<h4 class="file-header ui top attached header df ac sb fw">
-		<div class="file-header-left df ac py-3 pr-4">
+	<h4 class="file-header ui top attached header gt-df gt-ac gt-sb gt-fw">
+		<div class="file-header-left gt-df gt-ac gt-py-3 gt-pr-4">
 			{{if .ReadmeInList}}
-				{{svg "octicon-book" 16 "mr-3"}}
+				{{svg "octicon-book" 16 "gt-mr-3"}}
 				<strong>{{.FileName}}</strong>
 			{{else}}
 				{{template "repo/file_info" .}}
 			{{end}}
 		</div>
-		<div class="file-header-right file-actions df ac fw">
+		<div class="file-header-right file-actions gt-df gt-ac gt-fw">
 			{{if .HasSourceRenderedToggle}}
 				<div class="ui compact icon buttons two-toggle-buttons">
 					<a href="{{$.Link}}?display=source" class="ui mini basic button tooltip {{if .IsDisplayingSource}}active{{end}}" data-content="{{.locale.Tr "repo.file_view_source"}}" data-position="bottom center">{{svg "octicon-code" 15}}</a>
@@ -23,7 +23,7 @@
 				</div>
 			{{end}}
 			{{if not .ReadmeInList}}
-				<div class="ui buttons mr-2">
+				<div class="ui buttons gt-mr-2">
 					<a class="ui mini basic button" href="{{$.RawFileLink}}">{{.locale.Tr "repo.file_raw"}}</a>
 					{{if not .IsViewCommit}}
 						<a class="ui mini basic button" href="{{.RepoLink}}/src/commit/{{PathEscape .CommitID}}/{{PathEscapeSegments .TreePath}}">{{.locale.Tr "repo.file_permalink"}}</a>
@@ -33,7 +33,7 @@
 					{{end}}
 					<a class="ui mini basic button" href="{{.RepoLink}}/commits/{{.BranchNameSubURL}}/{{PathEscapeSegments .TreePath}}">{{.locale.Tr "repo.file_history"}}</a>
 					{{if .EscapeStatus.Escaped}}
-						<a class="ui mini basic button unescape-button" style="display: none;">{{.locale.Tr "repo.unescape_control_characters"}}</a>
+						<a class="ui mini basic button unescape-button gt-hidden">{{.locale.Tr "repo.unescape_control_characters"}}</a>
 						<a class="ui mini basic button escape-button">{{.locale.Tr "repo.escape_control_characters"}}</a>
 					{{end}}
 				</div>
@@ -52,8 +52,8 @@
 					{{end}}
 				{{end}}
 			{{else if .EscapeStatus.Escaped}}
-				<a class="ui mini basic button unescape-button mr-2" style="display: none;">{{.locale.Tr "repo.unescape_control_characters"}}</a>
-				<a class="ui mini basic button escape-button mr-2">{{.locale.Tr "repo.escape_control_characters"}}</a>
+				<a class="ui mini basic button unescape-button gt-mr-2 gt-hidden">{{.locale.Tr "repo.unescape_control_characters"}}</a>
+				<a class="ui mini basic button escape-button gt-mr-2">{{.locale.Tr "repo.escape_control_characters"}}</a>
 			{{end}}
 		</div>
 	</h4>
diff --git a/templates/repo/view_list.tmpl b/templates/repo/view_list.tmpl
index b923a9e6c..6fcf60dae 100644
--- a/templates/repo/view_list.tmpl
+++ b/templates/repo/view_list.tmpl
@@ -1,4 +1,4 @@
-<table id="repo-files-table" class="ui single line table mt-0" data-last-commit-loader-url="{{.LastCommitLoaderURL}}">
+<table id="repo-files-table" class="ui single line table gt-mt-0" data-last-commit-loader-url="{{.LastCommitLoaderURL}}">
 	<thead>
 		<tr class="commit-list">
 			<th colspan="2" {{if not .LatestCommit}}class="notready"{{end}}>
@@ -6,7 +6,7 @@
 					<div class="ui active tiny slow centered inline">…</div>
 				{{else}}
 					{{if .LatestCommitUser}}
-						{{avatar .LatestCommitUser 24}}
+						{{avatar $.Context .LatestCommitUser 24}}
 						{{if .LatestCommitUser.FullName}}
 							<a class="muted" href="{{.LatestCommitUser.HomeLink}}"><strong>{{.LatestCommitUser.FullName}}</strong></a>
 						{{else}}
@@ -14,7 +14,7 @@
 						{{end}}
 					{{else}}
 						{{if .LatestCommit.Author}}
-							{{avatarByEmail .LatestCommit.Author.Email .LatestCommit.Author.Name 24}}
+							{{avatarByEmail $.Context .LatestCommit.Author.Email .LatestCommit.Author.Name 24}}
 							<strong>{{.LatestCommit.Author.Name}}</strong>
 						{{end}}
 					{{end}}
@@ -29,7 +29,7 @@
 					<span class="grey commit-summary" title="{{.LatestCommit.Summary}}"><span class="message-wrapper">{{RenderCommitMessageLinkSubject $.Context .LatestCommit.Message $.RepoLink $commitLink $.Repository.ComposeMetas}}</span>
 						{{if IsMultilineCommitMessage .LatestCommit.Message}}
 							<button class="ui button ellipsis-button" aria-expanded="false">...</button>
-							<pre class="commit-body" style="display: none;">{{RenderCommitBody $.Context .LatestCommit.Message $.RepoLink $.Repository.ComposeMetas}}</pre>
+							<pre class="commit-body gt-hidden">{{RenderCommitBody $.Context .LatestCommit.Message $.RepoLink $.Repository.ComposeMetas}}</pre>
 						{{end}}
 					</span>
 				{{end}}
@@ -52,7 +52,7 @@
 					<span class="truncate">
 						{{if $entry.IsSubModule}}
 							{{svg "octicon-file-submodule"}}
-							{{$refURL := $subModuleFile.RefURL AppUrl $.Repository.FullName $.SSHDomain}}
+							{{$refURL := $subModuleFile.RefURL AppUrl $.Repository.FullName $.SSHDomain}} {{/* FIXME: the usage of AppUrl seems incorrect, it would be fixed in the future, use AppSubUrl instead */}}
 							{{if $refURL}}
 								<a class="muted" href="{{$refURL}}">{{$entry.Name}}</a><span class="at">@</span><a href="{{$refURL}}/commit/{{PathEscape $subModuleFile.RefID}}">{{ShortSha $subModuleFile.RefID}}</a>
 							{{else}}
diff --git a/templates/repo/wiki/pages.tmpl b/templates/repo/wiki/pages.tmpl
index ea5b9709c..9d3a3e806 100644
--- a/templates/repo/wiki/pages.tmpl
+++ b/templates/repo/wiki/pages.tmpl
@@ -2,7 +2,7 @@
 <div role="main" aria-label="{{.Title}}" class="page-content repository wiki pages">
 	{{template "repo/header" .}}
 	<div class="ui container">
-		<h2 class="ui header df ac sb">
+		<h2 class="ui header gt-df gt-ac gt-sb">
 			<div>
 				{{.locale.Tr "repo.wiki.pages"}}
 			</div>
diff --git a/templates/repo/wiki/revision.tmpl b/templates/repo/wiki/revision.tmpl
index c5256ab53..4e66be2f3 100644
--- a/templates/repo/wiki/revision.tmpl
+++ b/templates/repo/wiki/revision.tmpl
@@ -4,7 +4,7 @@
 	{{$title := .title}}
 	<div class="ui container">
 		<div class="ui stackable grid">
-			<div class="ui eight wide column text right df ac je">
+			<div class="ui eight wide column text right gt-df gt-ac gt-je">
 				<div class="ui action small input" id="clone-panel">
 					{{template "repo/clone_buttons" .}}
 					{{template "repo/clone_script" .}}
@@ -13,7 +13,7 @@
 			<div class="ui header eight wide column">
 				<a class="file-revisions-btn ui basic button" title="{{.locale.Tr "repo.wiki.back_to_wiki"}}" href="{{.RepoLink}}/wiki/{{.PageURL}}" ><span>{{.revision}}</span> {{svg "octicon-home"}}</a>
 				{{$title}}
-				<div class="ui sub header word-break">
+				<div class="ui sub header gt-word-break">
 					{{$timeSince := TimeSince .Author.When $.locale}}
 					{{.locale.Tr "repo.wiki.last_commit_info" .Author.Name $timeSince | Safe}}
 				</div>
diff --git a/templates/repo/wiki/view.tmpl b/templates/repo/wiki/view.tmpl
index b5e65dffc..15553cedd 100644
--- a/templates/repo/wiki/view.tmpl
+++ b/templates/repo/wiki/view.tmpl
@@ -3,8 +3,8 @@
 	{{template "repo/header" .}}
 	{{$title := .title}}
 	<div class="ui container">
-		<div class="repo-button-row df ac sb fw">
-			<div class="df ac">
+		<div class="repo-button-row gt-df gt-ac gt-sb gt-fw">
+			<div class="gt-df gt-ac">
 				<div class="choose page">
 					<div class="ui floating filter dropdown" data-no-results="{{.locale.Tr "repo.pulls.no_results"}}">
 						<div class="ui basic small button">
@@ -16,7 +16,7 @@
 						</div>
 						<div class="menu">
 							<div class="ui icon search input">
-								<i class="icon df ac jc m-0">{{svg "octicon-filter" 16}}</i>
+								<i class="icon gt-df gt-ac gt-jc gt-m-0">{{svg "octicon-filter" 16}}</i>
 								<input name="search" placeholder="{{.locale.Tr "repo.wiki.filter_page"}}...">
 							</div>
 							<div class="scrolling menu">
@@ -28,7 +28,7 @@
 					</div>
 				</div>
 			</div>
-			<div class="df ac">
+			<div class="gt-df gt-ac">
 				<div class="ui action small input" id="clone-panel">
 					{{template "repo/clone_buttons" .}}
 					{{template "repo/clone_script" .}}
@@ -47,7 +47,7 @@
 				</div>
 				<div class="eight wide right aligned column">
 					{{if .EscapeStatus.Escaped}}
-						<a class="ui small button unescape-button" style="display: none;">{{.locale.Tr "repo.unescape_control_characters"}}</a>
+						<a class="ui small button unescape-button gt-hidden">{{.locale.Tr "repo.unescape_control_characters"}}</a>
 						<a class="ui small button escape-button">{{.locale.Tr "repo.escape_control_characters"}}</a>
 					{{end}}
 					{{if and .CanWriteWiki (not .Repository.IsMirror)}}
diff --git a/templates/shared/actions/runner_edit.tmpl b/templates/shared/actions/runner_edit.tmpl
index 5cb65eb0e..8ef8387ba 100644
--- a/templates/shared/actions/runner_edit.tmpl
+++ b/templates/shared/actions/runner_edit.tmpl
@@ -8,15 +8,15 @@
 			{{template "base/disable_form_autofill"}}
 			{{.CsrfTokenHtml}}
 			<div class="runner-basic-info">
-				<div class="field dib disabled">
+				<div class="field gt-dib gt-mr-4 disabled">
 					<label>{{.locale.Tr "actions.runners.status"}}</label>
 					<span class="runner-status-{{if .Runner.IsOnline}}online{{else}}offline{{end}}">{{.Runner.StatusLocaleName $.locale}}</span>
 				</div>
-				<div class="field dib disabled">
+				<div class="field gt-dib gt-mr-4 disabled">
 					<label>{{.locale.Tr "actions.runners.last_online"}}</label>
 					<span>{{TimeSinceUnix .Runner.LastOnline $.locale}}</span>
 				</div>
-				<div class="field dib disabled">
+				<div class="field gt-dib gt-mr-4 disabled">
 					<label>{{.locale.Tr "actions.runners.agent_labels"}}</label>
 					<span>
 						{{range .Runner.AgentLabels}}
@@ -24,7 +24,7 @@
 						{{end}}
 					</span>
 				</div>
-				<div class="field dib disabled">
+				<div class="field gt-dib gt-mr-4 disabled">
 					<label>{{.locale.Tr "actions.runners.owner_type"}}</label>
 					<span>{{.Runner.OwnType}}</span>
 				</div>
diff --git a/templates/shared/issuelist.tmpl b/templates/shared/issuelist.tmpl
index 9e3f60545..a43047c79 100644
--- a/templates/shared/issuelist.tmpl
+++ b/templates/shared/issuelist.tmpl
@@ -1,8 +1,8 @@
 <div class="issue list">
 	{{$approvalCounts := .ApprovalCounts}}
 	{{range .Issues}}
-		<li class="item df py-3">
-			<div class="issue-item-left df">
+		<li class="item gt-df gt-py-3">
+			<div class="issue-item-left gt-df">
 				{{if $.CanWriteIssuesOrPulls}}
 					<div class="ui checkbox issue-checkbox">
 						<input type="checkbox" data-issue-id={{.ID}} title="{{$.locale.Tr "repo.issues.action_check"}} «{{.Title}}»">
@@ -32,22 +32,22 @@
 					{{end}}
 				</div>
 			</div>
-			<div class="issue-item-main f1 fc df">
+			<div class="issue-item-main gt-f1 gt-fc gt-df">
 				<div class="issue-item-top-row">
-					<a class="title tdn issue-title" href="{{if .Link}}{{.Link}}{{else}}{{$.Link}}/{{.Index}}{{end}}">{{RenderEmoji .Title | RenderCodeBlock}}</a>
+					<a class="title gt-tdn issue-title" href="{{if .Link}}{{.Link}}{{else}}{{$.Link}}/{{.Index}}{{end}}">{{RenderEmoji .Title | RenderCodeBlock}}</a>
 					{{if .IsPull}}
 						{{if (index $.CommitStatuses .PullRequest.ID)}}
 							{{template "repo/commit_statuses" dict "Status" (index $.CommitLastStatus .PullRequest.ID) "Statuses" (index $.CommitStatuses .PullRequest.ID) "root" $}}
 						{{end}}
 					{{end}}
-					<span class="labels-list ml-2">
+					<span class="labels-list gt-ml-2">
 						{{range .Labels}}
-							<a class="ui label" href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&state={{$.State}}&labels={{.ID}}{{if ne $.listType "milestone"}}&milestone={{$.MilestoneID}}{{end}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}" style="color: {{.ForegroundColor}}; background-color: {{.Color}}" title="{{.Description | RenderEmojiPlain}}">{{.Name | RenderEmoji}}</a>
+							<a href="{{$.Link}}?q={{$.Keyword}}&type={{$.ViewType}}&state={{$.State}}&labels={{.ID}}{{if ne $.listType "milestone"}}&milestone={{$.MilestoneID}}{{end}}&assignee={{$.AssigneeID}}&poster={{$.PosterID}}">{{RenderLabel .}}</a>
 						{{end}}
 					</span>
 				</div>
-				<div class="desc issue-item-bottom-row df ac fw my-1">
-					<a class="index ml-0 mr-2" href="{{if .Link}}{{.Link}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
+				<div class="desc issue-item-bottom-row gt-df gt-ac gt-fw gt-my-1">
+					<a class="index gt-ml-0 gt-mr-2" href="{{if .Link}}{{.Link}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
 						{{if eq $.listType "dashboard"}}
 							{{.Repo.FullName}}#{{.Index}}
 						{{else}}
@@ -63,14 +63,14 @@
 						{{$.locale.Tr .GetLastEventLabelFake $timeStr (.Poster.GetDisplayName | Escape) | Safe}}
 					{{end}}
 					{{if .IsPull}}
-						<div class="branches df ac">
+						<div class="branches gt-df gt-ac">
 							<div class="branch">
 								<a href="{{.PullRequest.BaseRepo.Link}}/src/branch/{{PathEscapeSegments .PullRequest.BaseBranch}}">
 									{{/* inline to remove the spaces between spans */}}
 									{{if ne .RepoID .PullRequest.BaseRepoID}}<span class="truncated-name">{{.PullRequest.BaseRepo.OwnerName}}</span>:{{end}}<span class="truncated-name">{{.PullRequest.BaseBranch}}</span>
 								</a>
 							</div>
-							{{svg "gitea-double-chevron-left" 12 "mx-1"}}
+							{{svg "gitea-double-chevron-left" 12 "gt-mx-1"}}
 							{{if .PullRequest.HeadRepo}}
 							<div class="branch">
 								<a href="{{.PullRequest.HeadRepo.Link}}/src/branch/{{PathEscapeSegments .PullRequest.HeadBranch}}">
@@ -83,31 +83,31 @@
 					{{end}}
 					{{if and .Milestone (ne $.listType "milestone")}}
 						<a class="milestone" {{if $.RepoLink}}href="{{$.RepoLink}}/milestone/{{.Milestone.ID}}"{{else}}href="{{.Repo.Link}}/milestone/{{.Milestone.ID}}"{{end}}>
-							{{svg "octicon-milestone" 14 "mr-2"}}{{.Milestone.Name}}
+							{{svg "octicon-milestone" 14 "gt-mr-2"}}{{.Milestone.Name}}
 						</a>
 					{{end}}
 					{{if .Project}}
 						<a class="project" {{if $.RepoLink}}href="{{$.RepoLink}}/projects/{{.Project.ID}}"{{else}}href="{{.Repo.Link}}/projects/{{.Project.ID}}"{{end}}>
-							{{svg "octicon-project" 14 "mr-2"}}{{.Project.Title}}
+							{{svg "octicon-project" 14 "gt-mr-2"}}{{.Project.Title}}
 						</a>
 					{{end}}
 					{{if .Ref}}
 						<a class="ref" {{if $.RepoLink}}href="{{index $.IssueRefURLs .ID}}"{{else}}href="{{.Repo.Link}}{{index $.IssueRefURLs .ID}}"{{end}}>
-							{{svg "octicon-git-branch" 14 "mr-2"}}{{index $.IssueRefEndNames .ID}}
+							{{svg "octicon-git-branch" 14 "gt-mr-2"}}{{index $.IssueRefEndNames .ID}}
 						</a>
 					{{end}}
 					{{$tasks := .GetTasks}}
 					{{if gt $tasks 0}}
 						{{$tasksDone := .GetTasksDone}}
 						<span class="checklist">
-							{{svg "octicon-checklist" 14 "mr-2"}}{{$tasksDone}} / {{$tasks}}
+							{{svg "octicon-checklist" 14 "gt-mr-2"}}{{$tasksDone}} / {{$tasks}}
 							<progress value="{{$tasksDone}}" max="{{$tasks}}"></progress>
 						</span>
 					{{end}}
 					{{if ne .DeadlineUnix 0}}
 						<span class="due-date tooltip" data-content="{{$.locale.Tr "repo.issues.due_date"}}" data-position="right center">
 							<span{{if .IsOverdue}} class="overdue"{{end}}>
-								{{svg "octicon-calendar" 14 "mr-2"}}
+								{{svg "octicon-calendar" 14 "gt-mr-2"}}
 								<time data-format="short-date" datetime="{{.DeadlineUnix.FormatLong}}">{{.DeadlineUnix.FormatShort}}</time>
 							</span>
 						</span>
@@ -117,25 +117,25 @@
 						{{$rejectOfficial := call $approvalCounts .ID "reject"}}
 						{{$waitingOfficial := call $approvalCounts .ID "waiting"}}
 						{{if gt $approveOfficial 0}}
-							<span class="approvals df ac green">
-								{{svg "octicon-check" 14 "mr-1"}}
+							<span class="approvals gt-df gt-ac green">
+								{{svg "octicon-check" 14 "gt-mr-1"}}
 								{{$.locale.TrN $approveOfficial "repo.pulls.approve_count_1" "repo.pulls.approve_count_n" $approveOfficial}}
 							</span>
 						{{end}}
 						{{if gt $rejectOfficial 0}}
-							<span class="rejects df ac red">
-								{{svg "octicon-diff" 14 "mr-2"}}
+							<span class="rejects gt-df gt-ac red">
+								{{svg "octicon-diff" 14 "gt-mr-2"}}
 								{{$.locale.TrN $rejectOfficial "repo.pulls.reject_count_1" "repo.pulls.reject_count_n" $rejectOfficial}}
 							</span>
 						{{end}}
 						{{if gt $waitingOfficial 0}}
-							<span class="waiting df ac">
-								{{svg "octicon-eye" 14 "mr-2"}}
+							<span class="waiting gt-df gt-ac">
+								{{svg "octicon-eye" 14 "gt-mr-2"}}
 								{{$.locale.TrN $waitingOfficial "repo.pulls.waiting_count_1" "repo.pulls.waiting_count_n" $waitingOfficial}}
 							</span>
 						{{end}}
 						{{if and (not .PullRequest.HasMerged) (gt (len .PullRequest.ConflictedFiles) 0)}}
-							<span class="conflicting df ac">
+							<span class="conflicting gt-df gt-ac">
 								{{svg "octicon-x" 14}}
 								{{$.locale.TrN (len .PullRequest.ConflictedFiles) "repo.pulls.num_conflicting_files_1" "repo.pulls.num_conflicting_files_n" (len .PullRequest.ConflictedFiles)}}
 							</span>
@@ -143,24 +143,24 @@
 					{{end}}
 				</div>
 			</div>
-			<div class="issue-item-icons-right df p-2">
+			<div class="issue-item-icons-right gt-df gt-p-2">
 				<div class="issue-item-icon-right text grey">
 					{{if .TotalTrackedTime}}
-						{{svg "octicon-clock" 16 "mr-2"}}
+						{{svg "octicon-clock" 16 "gt-mr-2"}}
 						{{.TotalTrackedTime | Sec2Time}}
 					{{end}}
 				</div>
 				<div class="issue-item-icon-right text grey">
 					{{range .Assignees}}
-						<a class="ui assignee tooltip tdn" href="{{.HomeLink}}" data-content="{{.GetDisplayName}}" data-position="left center">
-							{{avatar .}}
+						<a class="ui assignee tooltip gt-tdn" href="{{.HomeLink}}" data-content="{{.GetDisplayName}}" data-position="left center">
+							{{avatar $.Context .}}
 						</a>
 					{{end}}
 				</div>
 				<div class="issue-item-icon-right text grey">
 					{{if .NumComments}}
-						<a class="tdn muted" href="{{if .Link}}{{.Link}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
-							{{svg "octicon-comment" 16 "mr-2"}}{{.NumComments}}
+						<a class="gt-tdn muted" href="{{if .Link}}{{.Link}}{{else}}{{$.Link}}/{{.Index}}{{end}}">
+							{{svg "octicon-comment" 16 "gt-mr-2"}}{{.NumComments}}
 						</a>
 					{{end}}
 				</div>
diff --git a/templates/shared/searchbottom.tmpl b/templates/shared/searchbottom.tmpl
index 9a008cc31..cce82721c 100644
--- a/templates/shared/searchbottom.tmpl
+++ b/templates/shared/searchbottom.tmpl
@@ -1,10 +1,10 @@
-<div class="ui bottom attached table segment df ac sb">
-		<div class="df ac ml-4">
+<div class="ui bottom attached table segment gt-df gt-ac gt-sb">
+		<div class="gt-df gt-ac gt-ml-4">
 			{{if .result.Language}}
-					<i class="color-icon mr-3" style="background-color: {{.result.Color}}"></i>{{.result.Language}}
+					<i class="color-icon gt-mr-3" style="background-color: {{.result.Color}}"></i>{{.result.Language}}
 			{{end}}
 		</div>
-		<div class="mr-4">
+		<div class="gt-mr-4">
 			{{if not .result.UpdatedUnix.IsZero}}
 					<span class="ui grey text">{{.root.locale.Tr "explore.code_last_indexed_at" (TimeSinceUnix .result.UpdatedUnix .root.locale) | Safe}}</span>
 			{{end}}
diff --git a/templates/shared/secrets/add_list.tmpl b/templates/shared/secrets/add_list.tmpl
index 94bc8a169..9105b7ad9 100644
--- a/templates/shared/secrets/add_list.tmpl
+++ b/templates/shared/secrets/add_list.tmpl
@@ -5,7 +5,7 @@
 	</div>
 </h4>
 <div class="ui attached segment">
-	<div class="{{if not .HasError}}hide {{end}}mb-4" id="add-secret-panel">
+	<div class="{{if not .HasError}}gt-hidden {{end}}gt-mb-4" id="add-secret-panel">
 		<form class="ui form" action="{{.Link}}" method="post">
 			{{.CsrfTokenHtml}}
 			<div class="field">
@@ -58,7 +58,7 @@
 </div>
 <div class="ui small basic delete modal">
 	<div class="ui header">
-		{{svg "octicon-trash" 16 "mr-2"}}
+		{{svg "octicon-trash" 16 "gt-mr-2"}}
 		{{.locale.Tr "secrets.deletion"}}
 	</div>
 	<div class="content">
diff --git a/templates/shared/user/authorlink.tmpl b/templates/shared/user/authorlink.tmpl
index 4a6672181..4e45fdfd0 100644
--- a/templates/shared/user/authorlink.tmpl
+++ b/templates/shared/user/authorlink.tmpl
@@ -1 +1 @@
-<a class="author text black bold muted"{{if gt .ID 0}} href="{{.HomeLink}}"{{end}}>{{.GetDisplayName}}</a>
+<a class="author text black gt-bold muted"{{if gt .ID 0}} href="{{.HomeLink}}"{{end}}>{{.GetDisplayName}}</a>
diff --git a/templates/shared/user/avatarlink.tmpl b/templates/shared/user/avatarlink.tmpl
index 90f5d9670..c99f0aacb 100644
--- a/templates/shared/user/avatarlink.tmpl
+++ b/templates/shared/user/avatarlink.tmpl
@@ -1 +1 @@
-<a class="avatar"{{if gt .ID 0}} href="{{.HomeLink}}"{{end}}>{{avatar .}}</a>
+<a class="avatar"{{if gt .user.ID 0}} href="{{.user.HomeLink}}"{{end}}>{{avatar $.Context .user}}</a>
diff --git a/templates/status/404.tmpl b/templates/status/404.tmpl
index fcef783f6..c561e0ad8 100644
--- a/templates/status/404.tmpl
+++ b/templates/status/404.tmpl
@@ -1,5 +1,5 @@
 {{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content ui container center full-screen-width {{if .IsRepo}}repository{{end}}">
+<div role="main" aria-label="{{.Title}}" class="page-content ui container center gt-full-screen-width {{if .IsRepo}}repository{{end}}">
 	{{if .IsRepo}}{{template "repo/header" .}}{{end}}
 	<div class="ui container center">
 		<p style="margin-top: 100px"><img src="{{AssetUrlPrefix}}/img/404.png" alt="404"/></p>
diff --git a/templates/status/500.tmpl b/templates/status/500.tmpl
index 89dfeac3f..8c4f27834 100644
--- a/templates/status/500.tmpl
+++ b/templates/status/500.tmpl
@@ -1,5 +1,5 @@
 {{template "base/head" .}}
-<div role="main" aria-label="{{.Title}}" class="page-content ui container full-screen-width center">
+<div role="main" aria-label="{{.Title}}" class="page-content ui container gt-full-screen-width center">
 	<p style="margin-top: 100px"><img src="{{AssetUrlPrefix}}/img/500.png" alt="500"/></p>
 	<div class="ui divider"></div>
 	<br>
diff --git a/templates/swagger/ui.tmpl b/templates/swagger/ui.tmpl
index d4d0889f9..57b560bc1 100644
--- a/templates/swagger/ui.tmpl
+++ b/templates/swagger/ui.tmpl
@@ -6,8 +6,8 @@
 		<link href="{{AssetUrlPrefix}}/css/swagger.css?v={{AssetVersion}}" rel="stylesheet">
 	</head>
 	<body>
-		<a class="swagger-back-link" href="{{AppUrl}}">{{svg "octicon-reply"}}{{.locale.Tr "return_to_gitea"}}</a>
-		<div id="swagger-ui" data-source="{{AppUrl}}swagger.{{.APIJSONVersion}}.json"></div>
+		<a class="swagger-back-link" href="{{AppSubUrl}}/">{{svg "octicon-reply"}}{{.locale.Tr "return_to_gitea"}}</a>
+		<div id="swagger-ui" data-source="{{AppSubUrl}}/swagger.{{.APIJSONVersion}}.json"></div>
 		<script src="{{AssetUrlPrefix}}/js/swagger.js?v={{AssetVersion}}"></script>
 	</body>
 </html>
diff --git a/templates/swagger/v1_json.tmpl b/templates/swagger/v1_json.tmpl
index 6f81230af..dbdec9d33 100644
--- a/templates/swagger/v1_json.tmpl
+++ b/templates/swagger/v1_json.tmpl
@@ -15647,6 +15647,11 @@
           "type": "string",
           "x-go-name": "Description"
         },
+        "exclusive": {
+          "type": "boolean",
+          "x-go-name": "Exclusive",
+          "example": false
+        },
         "name": {
           "type": "string",
           "x-go-name": "Name"
@@ -16108,6 +16113,12 @@
         "password"
       ],
       "properties": {
+        "created_at": {
+          "description": "For explicitly setting the user creation timestamp. Useful when users are\nmigrated from other systems. When omitted, the user's creation timestamp\nwill be set to \"now\".",
+          "type": "string",
+          "format": "date-time",
+          "x-go-name": "Created"
+        },
         "email": {
           "type": "string",
           "format": "email",
@@ -16576,12 +16587,18 @@
       "properties": {
         "color": {
           "type": "string",
-          "x-go-name": "Color"
+          "x-go-name": "Color",
+          "example": "#00aabb"
         },
         "description": {
           "type": "string",
           "x-go-name": "Description"
         },
+        "exclusive": {
+          "type": "boolean",
+          "x-go-name": "Exclusive",
+          "example": false
+        },
         "name": {
           "type": "string",
           "x-go-name": "Name"
@@ -16796,6 +16813,11 @@
           "type": "boolean",
           "x-go-name": "AutodetectManualMerge"
         },
+        "default_allow_maintainer_edit": {
+          "description": "set to `true` to allow edits from maintainers by default",
+          "type": "boolean",
+          "x-go-name": "DefaultAllowMaintainerEdit"
+        },
         "default_branch": {
           "description": "sets the default branch for this repository.",
           "type": "string",
@@ -17903,6 +17925,11 @@
           "type": "string",
           "x-go-name": "Description"
         },
+        "exclusive": {
+          "type": "boolean",
+          "x-go-name": "Exclusive",
+          "example": false
+        },
         "id": {
           "type": "integer",
           "format": "int64",
@@ -19314,6 +19341,10 @@
           "format": "date-time",
           "x-go-name": "Created"
         },
+        "default_allow_maintainer_edit": {
+          "type": "boolean",
+          "x-go-name": "DefaultAllowMaintainerEdit"
+        },
         "default_branch": {
           "type": "string",
           "x-go-name": "DefaultBranch"
diff --git a/templates/user/auth/captcha.tmpl b/templates/user/auth/captcha.tmpl
index a794c8f54..62a3779e5 100644
--- a/templates/user/auth/captcha.tmpl
+++ b/templates/user/auth/captcha.tmpl
@@ -16,13 +16,13 @@
 		<div id="captcha" data-captcha-type="h-captcha" class="h-captcha-style" data-sitekey="{{.HcaptchaSitekey}}"></div>
 	</div>
 {{else if eq .CaptchaType "mcaptcha"}}
-	<div class="inline field df ac db-small captcha-field">
+	<div class="inline field gt-df gt-ac gt-db-small captcha-field">
 		<span>{{.locale.Tr "captcha"}}</span>
-		<div class="border-secondary w-100-small" id="mcaptcha__widget-container" style="width: 50%; height: 5em"></div>
+		<div class="gt-border-secondary gt-w-100-small" id="mcaptcha__widget-container" style="width: 50%; height: 5em"></div>
 		<div id="captcha" data-captcha-type="m-captcha" class="m-captcha" data-sitekey="{{.McaptchaSitekey}}" data-instance-url="{{.McaptchaURL}}"></div>
 	</div>
 {{else if eq .CaptchaType "cfturnstile"}}
-	<div class="inline field captcha-field tc">
+	<div class="inline field captcha-field gt-tc">
 		<div id="captcha" data-captcha-type="cf-turnstile" data-sitekey="{{.CfTurnstileSitekey}}"></div>
 	</div>
 {{end}}{{end}}
diff --git a/templates/user/auth/webauthn_error.tmpl b/templates/user/auth/webauthn_error.tmpl
index c3cae710f..447d289a2 100644
--- a/templates/user/auth/webauthn_error.tmpl
+++ b/templates/user/auth/webauthn_error.tmpl
@@ -5,18 +5,18 @@
 			<div class="header">
 			{{.locale.Tr "webauthn_error"}}
 			</div>
-			<div class="hide" data-webauthn-error-msg="browser"><p>{{.locale.Tr "webauthn_unsupported_browser"}}</div>
-			<div class="hide" data-webauthn-error-msg="unknown"><p>{{.locale.Tr "webauthn_error_unknown"}}</div>
-			<div class="hide" data-webauthn-error-msg="insecure"><p>{{.locale.Tr "webauthn_error_insecure"}}</div>
-			<div class="hide" data-webauthn-error-msg="unable-to-process"><p>{{.locale.Tr "webauthn_error_unable_to_process"}}</div>
-			<div class="hide" data-webauthn-error-msg="duplicated"><p>{{.locale.Tr "webauthn_error_duplicated"}}</div>
-			<div class="hide" data-webauthn-error-msg="empty"><p>{{.locale.Tr "webauthn_error_empty"}}</div>
-			<div class="hide" data-webauthn-error-msg="timeout"><p>{{.locale.Tr "webauthn_error_timeout"}}</div>
-			<div class="hide" data-webauthn-error-msg="general"></div>
+			<div class="gt-hidden" data-webauthn-error-msg="browser"><p>{{.locale.Tr "webauthn_unsupported_browser"}}</div>
+			<div class="gt-hidden" data-webauthn-error-msg="unknown"><p>{{.locale.Tr "webauthn_error_unknown"}}</div>
+			<div class="gt-hidden" data-webauthn-error-msg="insecure"><p>{{.locale.Tr "webauthn_error_insecure"}}</div>
+			<div class="gt-hidden" data-webauthn-error-msg="unable-to-process"><p>{{.locale.Tr "webauthn_error_unable_to_process"}}</div>
+			<div class="gt-hidden" data-webauthn-error-msg="duplicated"><p>{{.locale.Tr "webauthn_error_duplicated"}}</div>
+			<div class="gt-hidden" data-webauthn-error-msg="empty"><p>{{.locale.Tr "webauthn_error_empty"}}</div>
+			<div class="gt-hidden" data-webauthn-error-msg="timeout"><p>{{.locale.Tr "webauthn_error_timeout"}}</div>
+			<div class="gt-hidden" data-webauthn-error-msg="general"></div>
 		</div>
 	</div>
 	<div class="actions">
-		<button onclick="window.location.reload()" class="success ui button hide webauthn_error_timeout">{{.locale.Tr "webauthn_reload"}}</button>
+		<button onclick="window.location.reload()" class="success ui button gt-hidden webauthn_error_timeout">{{.locale.Tr "webauthn_reload"}}</button>
 		<div class="ui cancel button">{{.locale.Tr "cancel"}}</div>
 	</div>
 </div>
diff --git a/templates/user/dashboard/feeds.tmpl b/templates/user/dashboard/feeds.tmpl
index 94bbbc470..3f156249f 100644
--- a/templates/user/dashboard/feeds.tmpl
+++ b/templates/user/dashboard/feeds.tmpl
@@ -1,7 +1,7 @@
 {{range .Feeds}}
 	<div class="news">
 		<div class="ui left">
-			{{avatarByAction .}}
+			{{avatarByAction $.Context .}}
 		</div>
 		<div class="ui grid">
 			<div class="ui fourteen wide column">
@@ -88,8 +88,8 @@
 								{{range $push.Commits}}
 									{{$commitLink := printf "%s/commit/%s" $repoLink .Sha1}}
 									<li>
-										{{avatarHTML ($push.AvatarLink .AuthorEmail) 16 "mr-2" .AuthorName}}
-										<a class="commit-id mr-2" href="{{$commitLink}}">{{ShortSha .Sha1}}</a>
+										{{avatarHTML ($push.AvatarLink $.Context .AuthorEmail) 16 "gt-mr-2" .AuthorName}}
+										<a class="commit-id gt-mr-2" href="{{$commitLink}}">{{ShortSha .Sha1}}</a>
 										<span class="text truncate light grey">
 											{{RenderCommitMessage $.Context .Message $repoLink $.ComposeMetas}}
 										</span>
diff --git a/templates/user/dashboard/issues.tmpl b/templates/user/dashboard/issues.tmpl
index ab7a403fa..049b6a168 100644
--- a/templates/user/dashboard/issues.tmpl
+++ b/templates/user/dashboard/issues.tmpl
@@ -60,11 +60,11 @@
 					<div class="column">
 						<div class="ui compact tiny menu">
 							<a class="item{{if not .IsShowClosed}} active{{end}}" href="{{.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=open&q={{$.Keyword}}">
-								{{svg "octicon-issue-opened" 16 "mr-3"}}
+								{{svg "octicon-issue-opened" 16 "gt-mr-3"}}
 								{{JsPrettyNumber .IssueStats.OpenCount}}&nbsp;{{.locale.Tr "repo.issues.open_title"}}
 							</a>
 							<a class="item{{if .IsShowClosed}} active{{end}}" href="{{.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=closed&q={{$.Keyword}}">
-								{{svg "octicon-issue-closed" 16 "mr-3"}}
+								{{svg "octicon-issue-closed" 16 "gt-mr-3"}}
 								{{JsPrettyNumber .IssueStats.ClosedCount}}&nbsp;{{.locale.Tr "repo.issues.closed_title"}}
 							</a>
 						</div>
@@ -81,7 +81,7 @@
 							</div>
 						</form>
 					</div>
-					<div class="column right aligned df ac je">
+					<div class="column right aligned gt-df gt-ac gt-je">
 						<!-- Sort -->
 						<div class="ui dropdown type jump item">
 							<span class="text">
@@ -89,10 +89,10 @@
 								{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							</span>
 							<div class="menu">
-								<a class="{{if or (eq .SortType "latest") (not .SortType)}}active {{end}}item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=latest&state={{$.State}}&q={{$.Keyword}}">{{.locale.Tr "repo.issues.filter_sort.latest"}}</a>
-								<a class="{{if eq .SortType "oldest"}}active {{end}}item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=oldest&state={{$.State}}&q={{$.Keyword}}">{{.locale.Tr "repo.issues.filter_sort.oldest"}}</a>
 								<a class="{{if eq .SortType "recentupdate"}}active {{end}}item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=recentupdate&state={{$.State}}&q={{$.Keyword}}">{{.locale.Tr "repo.issues.filter_sort.recentupdate"}}</a>
 								<a class="{{if eq .SortType "leastupdate"}}active {{end}}item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=leastupdate&state={{$.State}}&q={{$.Keyword}}">{{.locale.Tr "repo.issues.filter_sort.leastupdate"}}</a>
+								<a class="{{if or (eq .SortType "latest") (not .SortType)}}active {{end}}item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=latest&state={{$.State}}&q={{$.Keyword}}">{{.locale.Tr "repo.issues.filter_sort.latest"}}</a>
+								<a class="{{if eq .SortType "oldest"}}active {{end}}item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=oldest&state={{$.State}}&q={{$.Keyword}}">{{.locale.Tr "repo.issues.filter_sort.oldest"}}</a>
 								<a class="{{if eq .SortType "mostcomment"}}active {{end}}item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=mostcomment&state={{$.State}}&q={{$.Keyword}}">{{.locale.Tr "repo.issues.filter_sort.mostcomment"}}</a>
 								<a class="{{if eq .SortType "leastcomment"}}active {{end}}item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=leastcomment&state={{$.State}}&q={{$.Keyword}}">{{.locale.Tr "repo.issues.filter_sort.leastcomment"}}</a>
 								<a class="{{if eq .SortType "nearduedate"}}active {{end}}item" href="{{$.Link}}?type={{$.ViewType}}&repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort=nearduedate&state={{$.State}}&q={{$.Keyword}}">{{.locale.Tr "repo.issues.filter_sort.nearduedate"}}</a>
diff --git a/templates/user/dashboard/milestones.tmpl b/templates/user/dashboard/milestones.tmpl
index 736d703ee..5c6551290 100644
--- a/templates/user/dashboard/milestones.tmpl
+++ b/templates/user/dashboard/milestones.tmpl
@@ -38,11 +38,11 @@
 					<div class="column">
 						<div class="ui compact tiny menu">
 							<a class="item{{if not .IsShowClosed}} active{{end}}" href="{{.Link}}?repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=open&q={{$.Keyword}}">
-								{{svg "octicon-milestone" 16 "mr-3"}}
+								{{svg "octicon-milestone" 16 "gt-mr-3"}}
 								{{JsPrettyNumber .MilestoneStats.OpenCount}}&nbsp;{{.locale.Tr "repo.issues.open_title"}}
 							</a>
 							<a class="item{{if .IsShowClosed}} active{{end}}" href="{{.Link}}?repos=[{{range $.RepoIDs}}{{.}}%2C{{end}}]&sort={{$.SortType}}&state=closed&q={{$.Keyword}}">
-								{{svg "octicon-check" 16 "mr-3"}}
+								{{svg "octicon-check" 16 "gt-mr-3"}}
 								{{JsPrettyNumber .MilestoneStats.ClosedCount}}&nbsp;{{.locale.Tr "repo.issues.closed_title"}}
 							</a>
 						</div>
@@ -59,7 +59,7 @@
 							</div>
 						</form>
 					</div>
-					<div class="column right aligned df ac je">
+					<div class="column right aligned gt-df gt-ac gt-je">
 						<!-- Sort -->
 						<div class="ui dropdown type jump item">
 							<span class="text">
@@ -80,13 +80,13 @@
 				<div class="milestone list">
 					{{range .Milestones}}
 						<li class="item">
-							<div class="df ac sb">
-								<h2 class="df ac m-0 fw">
+							<div class="gt-df gt-ac gt-sb">
+								<h3 class="gt-df gt-ac gt-m-0 gt-fw">
 									<span class="ui large label">{{.Repo.FullName}}</span>
-									{{svg "octicon-milestone" 16 "mr-3"}}<a class="muted" href="{{.Repo.Link}}/milestone/{{.ID}}">{{.Name}}</a>
-								</h2>
-								<div class="df ac">
-									<span class="mr-3">{{.Completeness}}%</span>
+									{{svg "octicon-milestone" 16 "gt-mr-3"}}<a class="muted" href="{{.Repo.Link}}/milestone/{{.ID}}">{{.Name}}</a>
+								</h3>
+								<div class="gt-df gt-ac">
+									<span class="gt-mr-3">{{.Completeness}}%</span>
 									<progress value="{{.Completeness}}" max="100"></progress>
 								</div>
 							</div>
@@ -103,9 +103,9 @@
 									{{end}}
 								{{end}}
 								<span class="issue-stats">
-									{{svg "octicon-issue-opened" 16 "mr-3"}}
+									{{svg "octicon-issue-opened" 16 "gt-mr-3"}}
 									{{JsPrettyNumber .NumOpenIssues}}&nbsp;{{$.locale.Tr "repo.issues.open_title"}}
-									{{svg "octicon-check" 16 "mr-3"}}
+									{{svg "octicon-check" 16 "gt-mr-3"}}
 									{{JsPrettyNumber .NumClosedIssues}}&nbsp;{{$.locale.Tr "repo.issues.closed_title"}}
 									{{if .TotalTrackedTime}}
 										{{svg "octicon-clock"}} {{.TotalTrackedTime|Sec2Time}}
diff --git a/templates/user/dashboard/navbar.tmpl b/templates/user/dashboard/navbar.tmpl
index ab3d5029d..719d5b06b 100644
--- a/templates/user/dashboard/navbar.tmpl
+++ b/templates/user/dashboard/navbar.tmpl
@@ -3,7 +3,7 @@
 		<div class="item">
 			<div class="ui floating dropdown link jump">
 				<span class="text truncated-item-container">
-					{{avatar .ContextUser}}
+					{{avatar $.Context .ContextUser}}
 					<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 					{{if .ContextUser.IsOrganization}}
 						<span class="org-visibility">
@@ -19,12 +19,12 @@
 					</div>
 					<div class="scrolling menu items">
 						<a class="{{if eq .ContextUser.ID .SignedUser.ID}}active selected{{end}} item truncated-item-container" href="{{AppSubUrl}}/{{if .PageIsIssues}}issues{{else if .PageIsPulls}}pulls{{else if .PageIsMilestonesDashboard}}milestones{{end}}">
-							{{avatar .SignedUser}}
+							{{avatar $.Context .SignedUser}}
 							<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 						</a>
 						{{range .Orgs}}
 							<a class="{{if eq $.ContextUser.ID .ID}}active selected{{end}} item truncated-item-container" title="{{.Name}}" href="{{.OrganisationLink}}/{{if $.PageIsIssues}}issues{{else if $.PageIsPulls}}pulls{{else if $.PageIsMilestonesDashboard}}milestones{{else}}dashboard{{end}}">
-								{{avatar .}}
+								{{avatar $.Context .}}
 								<span class="truncated-item-name">{{.ShortName 40}}</span>
 								<span class="org-visibility">
 									{{if .Visibility.IsLimited}}<div class="ui basic tiny horizontal label">{{$.locale.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}}
diff --git a/templates/user/dashboard/repolist.tmpl b/templates/user/dashboard/repolist.tmpl
index 8fb5763f3..22af578fc 100644
--- a/templates/user/dashboard/repolist.tmpl
+++ b/templates/user/dashboard/repolist.tmpl
@@ -29,10 +29,10 @@
 			<a :class="{item: true, active: tab === 'organizations'}" @click="changeTab('organizations')">{{.locale.Tr "organization"}}</a>
 		</div>
 		<div v-show="tab === 'repos'" class="ui tab active list dashboard-repos">
-			<h4 class="ui top attached header df ac">
-				<div class="f1 df ac">
+			<h4 class="ui top attached header gt-df gt-ac">
+				<div class="gt-f1 gt-df gt-ac">
 					{{.locale.Tr "home.my_repos"}}
-					<span class="ui grey label ml-3">${reposTotalCount}</span>
+					<span class="ui grey label gt-ml-3">${reposTotalCount}</span>
 				</div>
 				<a class="tooltip" :href="subUrl + '/repo/create'" data-content="{{.locale.Tr "new_repo"}}" data-position="left center">
 					{{svg "octicon-plus"}}
@@ -42,30 +42,30 @@
 			<div class="ui attached segment repos-search">
 				<div class="ui fluid right action left icon input" :class="{loading: isLoading}">
 					<input @input="changeReposFilter(reposFilter)" v-model="searchQuery" ref="search" placeholder="{{.locale.Tr "home.search_repos"}}">
-					<i class="icon df ac jc">{{svg "octicon-search" 16}}</i>
+					<i class="icon gt-df gt-ac gt-jc">{{svg "octicon-search" 16}}</i>
 					<div class="ui dropdown icon button" title="{{.locale.Tr "home.filter"}}">
-						<i class="icon df ac jc m-0">{{svg "octicon-filter" 16}}</i>
+						<i class="icon gt-df gt-ac gt-jc gt-m-0">{{svg "octicon-filter" 16}}</i>
 						<div class="menu">
 							<div class="item">
 								<a @click="toggleArchivedFilter()">
 									<div class="ui checkbox" id="archivedFilterCheckbox" title="{{.locale.Tr "home.show_both_archived_unarchived"}}" v-if="archivedFilter === 'both'">
 										<input type="checkbox">
 										<label>
-											{{svg "octicon-archive" 16 "mr-2"}}
+											{{svg "octicon-archive" 16 "gt-mr-2"}}
 											{{.locale.Tr "home.show_archived"}}
 										</label>
 									</div>
 									<div class="ui checkbox" id="archivedFilterCheckbox" title="{{.locale.Tr "home.show_only_unarchived"}}" v-if="archivedFilter === 'unarchived'">
 										<input type="checkbox">
 										<label>
-											{{svg "octicon-archive" 16 "mr-2"}}
+											{{svg "octicon-archive" 16 "gt-mr-2"}}
 											{{.locale.Tr "home.show_archived"}}
 										</label>
 									</div>
 									<div class="ui checkbox" id="archivedFilterCheckbox" title="{{.locale.Tr "home.show_only_archived"}}" v-if="archivedFilter === 'archived'">
 										<input type="checkbox">
 										<label>
-											{{svg "octicon-archive" 16 "mr-2"}}
+											{{svg "octicon-archive" 16 "gt-mr-2"}}
 											{{.locale.Tr "home.show_archived"}}
 										</label>
 									</div>
@@ -76,21 +76,21 @@
 									<div class="ui checkbox" id="privateFilterCheckbox" title="{{.locale.Tr "home.show_both_private_public"}}" v-if="privateFilter === 'both'">
 										<input type="checkbox">
 										<label>
-											{{svg "octicon-lock" 16 "mr-2"}}
+											{{svg "octicon-lock" 16 "gt-mr-2"}}
 											{{.locale.Tr "home.show_private"}}
 										</label>
 									</div>
 									<div class="ui checkbox" id="privateFilterCheckbox" title="{{.locale.Tr "home.show_only_public"}}" v-if="privateFilter === 'public'">
 										<input type="checkbox">
 										<label>
-											{{svg "octicon-lock" 16 "mr-2"}}
+											{{svg "octicon-lock" 16 "gt-mr-2"}}
 											{{.locale.Tr "home.show_private"}}
 										</label>
 									</div>
 									<div class="ui checkbox" id="privateFilterCheckbox" title="{{.locale.Tr "home.show_only_private"}}" v-if="privateFilter === 'private'">
 										<input type="checkbox">
 											<label>
-												{{svg "octicon-lock" 16 "mr-2"}}
+												{{svg "octicon-lock" 16 "gt-mr-2"}}
 												{{.locale.Tr "home.show_private"}}
 											</label>
 									</div>
@@ -124,71 +124,71 @@
 					</a>
 				</div>
 			</div>
-			<div v-if="repos.length" class="ui attached table segment rounded-bottom">
+			<div v-if="repos.length" class="ui attached table segment gt-rounded-bottom">
 				<ul class="repo-owner-name-list">
 					<li v-for="repo in repos" :class="{'private': repo.private || repo.internal}">
-						<a class="repo-list-link df ac sb" :href="repo.link">
-							<div class="item-name df ac f1 mr-2">
-								<component v-bind:is="repoIcon(repo)" size="16" class="mr-2"></component>
-								<div class="text bold truncate ml-1">${repo.full_name}</div>
+						<a class="repo-list-link gt-df gt-ac gt-sb" :href="repo.link">
+							<div class="item-name gt-df gt-ac gt-f1 gt-mr-2">
+								<component v-bind:is="repoIcon(repo)" size="16" class="gt-mr-2"></component>
+								<div class="text gt-bold truncate gt-ml-1">${repo.full_name}</div>
 								<span v-if="repo.archived">
-									{{svg "octicon-archive" 16 "ml-2"}}
+									{{svg "octicon-archive" 16 "gt-ml-2"}}
 								</span>
 							</div>
 							{{if not .DisableStars}}
-								<div class="text light grey df ac">
+								<div class="text light grey gt-df gt-ac">
 									${repo.stars_count}
-									{{svg "octicon-star" 16 "ml-2"}}
+									{{svg "octicon-star" 16 "gt-ml-2"}}
 								</div>
 							{{end}}
 						</a>
 					</li>
 				</ul>
-				<div v-if="showMoreReposLink" class="center py-3 border-secondary-top">
+				<div v-if="showMoreReposLink" class="center gt-py-3 gt-border-secondary-top">
 					<div class="ui borderless pagination menu narrow">
-						<a class="item navigation py-2" :class="{'disabled': page === 1}"
+						<a class="item navigation gt-py-2" :class="{'disabled': page === 1}"
 							@click="changePage(1)" title="{{$.locale.Tr "admin.first_page"}}">
-							{{svg "gitea-double-chevron-left" 16 "mr-2"}}
+							{{svg "gitea-double-chevron-left" 16 "gt-mr-2"}}
 						</a>
-						<a class="item navigation py-2" :class="{'disabled': page === 1}"
+						<a class="item navigation gt-py-2" :class="{'disabled': page === 1}"
 							@click="changePage(page - 1)" title="{{$.locale.Tr "repo.issues.previous"}}">
-							{{svg "octicon-chevron-left" 16 "mr-2"}}
+							{{svg "octicon-chevron-left" 16 "gt-mr-2"}}
 						</a>
-						<a class="active item py-2">${page}</a>
+						<a class="active item gt-py-2">${page}</a>
 						<a class="item navigation" :class="{'disabled': page === finalPage}"
 							@click="changePage(page + 1)" title="{{$.locale.Tr "repo.issues.next"}}">
-							{{svg "octicon-chevron-right" 16 "ml-2"}}
+							{{svg "octicon-chevron-right" 16 "gt-ml-2"}}
 						</a>
-						<a class="item navigation py-2" :class="{'disabled': page === finalPage}"
+						<a class="item navigation gt-py-2" :class="{'disabled': page === finalPage}"
 							@click="changePage(finalPage)" title="{{$.locale.Tr "admin.last_page"}}">
-							{{svg "gitea-double-chevron-right" 16 "ml-2"}}
+							{{svg "gitea-double-chevron-right" 16 "gt-ml-2"}}
 						</a>
 					</div>
 				</div>
 			</div>
 		</div>
 		<div v-if="!isOrganization" v-show="tab === 'organizations'" class="ui tab active list dashboard-orgs">
-			<h4 class="ui top attached header df ac">
-				<div class="f1 df ac">
+			<h4 class="ui top attached header gt-df gt-ac">
+				<div class="gt-f1 gt-df gt-ac">
 					{{.locale.Tr "home.my_orgs"}}
-					<span class="ui grey label ml-3">${organizationsTotalCount}</span>
+					<span class="ui grey label gt-ml-3">${organizationsTotalCount}</span>
 				</div>
 				<a v-if="canCreateOrganization" class="tooltip" :href="subUrl + '/org/create'" data-content="{{.locale.Tr "new_org"}}" data-position="left center">
 					{{svg "octicon-plus"}}
 					<span class="sr-only">{{.locale.Tr "new_org"}}</span>
 				</a>
 			</h4>
-			<div v-if="organizations.length" class="ui attached table segment rounded-bottom">
+			<div v-if="organizations.length" class="ui attached table segment gt-rounded-bottom">
 				<ul class="repo-owner-name-list">
 					<li v-for="org in organizations">
-						<a class="repo-list-link df ac sb" :href="subUrl + '/' + encodeURIComponent(org.name)">
-							<div class="text truncate item-name f1">
-								{{svg "octicon-organization" 16 "mr-2"}}
+						<a class="repo-list-link gt-df gt-ac gt-sb" :href="subUrl + '/' + encodeURIComponent(org.name)">
+							<div class="text truncate item-name gt-f1">
+								{{svg "octicon-organization" 16 "gt-mr-2"}}
 								<strong>${org.name}</strong>
 							</div>
-							<div class="text light grey df ac">
+							<div class="text light grey gt-df gt-ac">
 								${org.num_repos}
-								{{svg "octicon-repo" 16 "ml-2 mt-1"}}
+								{{svg "octicon-repo" 16 "gt-ml-2 gt-mt-1"}}
 							</div>
 						</a>
 					</li>
diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl
index 0ea001ff3..c8db659c1 100644
--- a/templates/user/notification/notification_div.tmpl
+++ b/templates/user/notification/notification_div.tmpl
@@ -5,7 +5,7 @@
 			{{$notificationUnreadCount := call .NotificationUnreadCount}}
 			<a href="{{AppSubUrl}}/notifications?q=unread" class="{{if eq .Status 1}}active {{end}}item">
 				{{.locale.Tr "notification.unread"}}
-				<div class="ui label {{if not $notificationUnreadCount}}hidden{{end}}">{{$notificationUnreadCount}}</div>
+				<div class="ui label {{if not $notificationUnreadCount}}gt-hidden{{end}}">{{$notificationUnreadCount}}</div>
 			</a>
 			<a href="{{AppSubUrl}}/notifications?q=read" class="{{if eq .Status 2}}active {{end}}item">
 				{{.locale.Tr "notification.read"}}
@@ -13,7 +13,7 @@
 			{{if and (eq .Status 1)}}
 				<form action="{{AppSubUrl}}/notifications/purge" method="POST" style="margin-left: auto;">
 					{{$.CsrfTokenHtml}}
-					<div class="{{if not $notificationUnreadCount}}hide{{end}}">
+					<div class="{{if not $notificationUnreadCount}}gt-hidden{{end}}">
 						<button class="ui mini button primary" title='{{$.locale.Tr "notification.mark_all_as_read"}}'>
 							{{svg "octicon-checklist"}}
 						</button>
diff --git a/templates/user/notification/notification_subscriptions.tmpl b/templates/user/notification/notification_subscriptions.tmpl
index 2083902c5..5aff7ef9d 100644
--- a/templates/user/notification/notification_subscriptions.tmpl
+++ b/templates/user/notification/notification_subscriptions.tmpl
@@ -18,11 +18,11 @@
 								{{.locale.Tr "all"}}
 							</a>
 							<a class="{{if eq .State "open"}}active {{end}}item" href="{{$.Link}}?sort={{$.SortType}}&state=open&issueType={{$.IssueType}}&labels={{$.Labels}}">
-								{{svg "octicon-issue-opened" 16 "mr-3"}}
+								{{svg "octicon-issue-opened" 16 "gt-mr-3"}}
 								{{.locale.Tr "repo.issues.open_title"}}
 							</a>
 							<a class="{{if eq .State "closed"}}active {{end}}item" href="{{$.Link}}?sort={{$.SortType}}&state=closed&issueType={{$.IssueType}}&labels={{$.Labels}}">
-								{{svg "octicon-issue-closed" 16 "mr-3"}}
+								{{svg "octicon-issue-closed" 16 "gt-mr-3"}}
 								{{.locale.Tr "repo.issues.closed_title"}}
 							</a>
 						</div>
diff --git a/templates/user/overview/header.tmpl b/templates/user/overview/header.tmpl
index 18fbd3070..2449f5fc3 100644
--- a/templates/user/overview/header.tmpl
+++ b/templates/user/overview/header.tmpl
@@ -5,7 +5,7 @@
 			<div class="ui vertically grid head">
 				<div class="column">
 					<div class="ui header">
-						{{avatar . 100}}
+						{{avatar $.Context . 100}}
 						<span class="text thin grey"><a href="{{.HomeLink}}">{{.DisplayName}}</a></span>
 						<span class="org-visibility">
 							{{if .Visibility.IsLimited}}<div class="ui medium basic horizontal label">{{$.locale.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}}
@@ -39,7 +39,7 @@
 			{{if .ContextUser.IsOrganization}}
 				{{if .IsOrganizationMember}}
 					<a class="item" href="{{$.OrgLink}}/members">
-						{{svg "octicon-organization"}}&nbsp;{{$.locale.Tr "org.people"}}
+						{{svg "octicon-person"}}&nbsp;{{$.locale.Tr "org.members"}}
 						{{if .NumMembers}}
 							<div class="ui primary label">{{.NumMembers}}</div>
 						{{end}}
diff --git a/templates/user/profile.tmpl b/templates/user/profile.tmpl
index 512e1187c..fcaec60ea 100644
--- a/templates/user/profile.tmpl
+++ b/templates/user/profile.tmpl
@@ -4,28 +4,28 @@
 		<div class="ui stackable grid">
 			<div class="ui five wide column">
 				<div class="ui card">
-					<div id="profile-avatar" class="content df"/>
+					<div id="profile-avatar" class="content gt-df"/>
 					{{if eq .SignedUserName .Owner.Name}}
 						<a class="image tooltip" href="{{AppSubUrl}}/user/settings" data-content="{{.locale.Tr "user.change_avatar"}}" data-position="bottom center">
-							{{avatar .Owner 290}}
+							{{avatar $.Context .Owner 290}}
 						</a>
 					{{else}}
 						<span class="image">
-							{{avatar .Owner 290}}
+							{{avatar $.Context .Owner 290}}
 						</span>
 					{{end}}
 					</div>
-					<div class="content word-break profile-avatar-name">
+					<div class="content gt-word-break profile-avatar-name">
 						{{if .Owner.FullName}}<span class="header text center">{{.Owner.FullName}}</span>{{end}}
 						<span class="username text center">{{.Owner.Name}}</span>
 						{{if .EnableFeed}}
-							<a href="{{.Owner.HomeLink}}.rss"><i class="ui grey icon tooltip ml-3" data-content="{{.locale.Tr "rss_feed"}}" data-position="bottom center">{{svg "octicon-rss" 18}}</i></a>
+							<a href="{{.Owner.HomeLink}}.rss"><i class="ui grey icon tooltip gt-ml-3" data-content="{{.locale.Tr "rss_feed"}}" data-position="bottom center">{{svg "octicon-rss" 18}}</i></a>
 						{{end}}
-						<div class="mt-3">
-							<a class="muted" href="{{.Owner.HomeLink}}?tab=followers">{{svg "octicon-person" 18 "mr-2"}}{{.Owner.NumFollowers}} {{.locale.Tr "user.followers"}}</a> · <a class="muted" href="{{.Owner.HomeLink}}?tab=following">{{.Owner.NumFollowing}} {{.locale.Tr "user.following"}}</a>
+						<div class="gt-mt-3">
+							<a class="muted" href="{{.Owner.HomeLink}}?tab=followers">{{svg "octicon-person" 18 "gt-mr-2"}}{{.Owner.NumFollowers}} {{.locale.Tr "user.followers"}}</a> · <a class="muted" href="{{.Owner.HomeLink}}?tab=following">{{.Owner.NumFollowing}} {{.locale.Tr "user.following"}}</a>
 						</div>
 					</div>
-					<div class="extra content word-break">
+					<div class="extra content gt-word-break">
 						<ul>
 							{{if .Owner.Location}}
 								<li>{{svg "octicon-location"}} {{.Owner.Location}}</li>
@@ -63,7 +63,7 @@
 									{{if (or .Visibility.IsPublic (and ($.SignedUser) (or .Visibility.IsLimited (and (.HasMemberWithUserID $.SignedUserID) .Visibility.IsPrivate) ($.IsAdmin))))}}
 									<li>
 										<a class="tooltip" href="{{.HomeLink}}" data-content="{{.Name}}" data-position="top center">
-											{{avatar .}}
+											{{avatar $.Context .}}
 										</a>
 									</li>
 									{{end}}
diff --git a/templates/user/project.tmpl b/templates/user/project.tmpl
index 59eff13aa..b46fa1c77 100644
--- a/templates/user/project.tmpl
+++ b/templates/user/project.tmpl
@@ -14,18 +14,18 @@
 						<div class="ui selection owner dropdown">
 							<input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required>
 							<span class="text truncated-item-container" title="{{.ContextUser.Name}}">
-								{{avatar .ContextUser 28 "mini"}}
+								{{avatar $.Context .ContextUser 28 "mini"}}
 								<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span>
 							</span>
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
 							<div class="menu">
 								<div class="item truncated-item-container" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}">
-									{{avatar .SignedUser 28 "mini"}}
+									{{avatar $.Context .SignedUser 28 "mini"}}
 									<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span>
 								</div>
 								{{range .Orgs}}
 								<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}">
-									{{avatar . 28 "mini"}}
+									{{avatar $.Context . 28 "mini"}}
 									<span class="truncated-item-name">{{.ShortName 40}}</span>
 								</div>
 								{{end}}
@@ -48,7 +48,7 @@
 							<input type="hidden" name="board_type" value="{{.type}}">
 							<div class="default text">{{.locale.Tr "repo.projects.template.desc_helper"}}</div>
 							<div class="menu">
-								{{range $element := .ProjectTypes}}
+								{{range $element := .BoardTypes}}
 								<div class="item" data-id="{{$element.BoardType}}" data-value="{{$element.BoardType}}">{{$.locale.Tr $element.Translation}}</div>
 								{{end}}
 							</div>
diff --git a/templates/user/settings/applications.tmpl b/templates/user/settings/applications.tmpl
index 29d76862f..439ed5e14 100644
--- a/templates/user/settings/applications.tmpl
+++ b/templates/user/settings/applications.tmpl
@@ -15,7 +15,7 @@
 					<div class="item">
 						<div class="right floated content">
 								<button class="ui red tiny button delete-button" data-modal-id="delete-token" data-url="{{$.Link}}/delete" data-id="{{.ID}}">
-									{{svg "octicon-trash" 16 "mr-2"}}
+									{{svg "octicon-trash" 16 "gt-mr-2"}}
 									{{$.locale.Tr "settings.delete_token"}}
 								</button>
 						</div>
@@ -42,16 +42,16 @@
 					<input id="name" name="name" value="{{.name}}" autofocus required>
 				</div>
 				<details class="ui optional field">
-					<summary class="p-2">
+					<summary class="gt-p-2">
 						{{.locale.Tr "settings.select_scopes"}}
 					</summary>
-					<div class="field pl-2">
+					<div class="field gt-pl-2">
 						<div class="ui checkbox">
 							<input class="enable-system" type="checkbox" name="scope" value="repo">
 							<label>repo</label>
 						</div>
 					</div>
-					<div class="field pl-4">
+					<div class="field gt-pl-4">
 						<div class="field">
 							<div class="ui checkbox">
 								<input class="enable-system" type="checkbox" name="scope" value="repo:status">
@@ -71,7 +71,7 @@
 							<label>admin:org</label>
 						</div>
 					</div>
-					<div class="field pl-4">
+					<div class="field gt-pl-4">
 						<div class="field">
 							<div class="ui checkbox">
 								<input class="enable-system" type="checkbox" name="scope" value="write:org">
@@ -91,7 +91,7 @@
 							<label>admin:public_key</label>
 						</div>
 					</div>
-					<div class="field pl-4">
+					<div class="field gt-pl-4">
 						<div class="field">
 							<div class="ui checkbox">
 								<input class="enable-system" type="checkbox" name="scope" value="write:public_key">
@@ -111,7 +111,7 @@
 							<label>admin:repo_hook</label>
 						</div>
 					</div>
-					<div class="field pl-4">
+					<div class="field gt-pl-4">
 						<div class="field">
 							<div class="ui checkbox">
 								<input class="enable-system" type="checkbox" name="scope" value="write:repo_hook">
@@ -143,7 +143,7 @@
 							<label>user</label>
 						</div>
 					</div>
-					<div class="field pl-4">
+					<div class="field gt-pl-4">
 						<div class="field">
 							<div class="ui checkbox">
 								<input class="enable-system" type="checkbox" name="scope" value="read:user">
@@ -175,7 +175,7 @@
 							<label>package</label>
 						</div>
 					</div>
-					<div class="field pl-4">
+					<div class="field gt-pl-4">
 						<div class="field">
 							<div class="ui checkbox">
 								<input class="enable-system" type="checkbox" name="scope" value="write:package">
@@ -201,7 +201,7 @@
 							<label>admin:gpg_key</label>
 						</div>
 					</div>
-					<div class="field pl-4">
+					<div class="field gt-pl-4">
 						<div class="field">
 							<div class="ui checkbox">
 								<input class="enable-system" type="checkbox" name="scope" value="write:gpg_key">
@@ -221,7 +221,7 @@
 							<label>admin:application</label>
 						</div>
 					</div>
-					<div class="field pl-4">
+					<div class="field gt-pl-4">
 						<div class="field">
 							<div class="ui checkbox">
 								<input class="enable-system" type="checkbox" name="scope" value="write:application">
diff --git a/templates/user/settings/applications_oauth2_list.tmpl b/templates/user/settings/applications_oauth2_list.tmpl
index fbca5934c..8ec304532 100644
--- a/templates/user/settings/applications_oauth2_list.tmpl
+++ b/templates/user/settings/applications_oauth2_list.tmpl
@@ -7,12 +7,12 @@
 			<div class="item">
 				<div class="right floated content">
 					<a href="{{$.Link}}/oauth2/{{$app.ID}}" class="ui primary tiny button">
-						{{svg "octicon-pencil" 16 "mr-2"}}
+						{{svg "octicon-pencil" 16 "gt-mr-2"}}
 						{{$.locale.Tr "settings.oauth2_application_edit"}}
 					</a>
 					<button class="ui red tiny button delete-button" data-modal-id="remove-gitea-oauth2-application"
 							data-url="{{$.Link}}/oauth2/{{$app.ID}}/delete">
-						{{svg "octicon-trash" 16 "mr-2"}}
+						{{svg "octicon-trash" 16 "gt-mr-2"}}
 						{{$.locale.Tr "settings.delete_key"}}
 					</button>
 				</div>
diff --git a/templates/user/settings/grants_oauth2.tmpl b/templates/user/settings/grants_oauth2.tmpl
index 878c258dd..0adc98168 100644
--- a/templates/user/settings/grants_oauth2.tmpl
+++ b/templates/user/settings/grants_oauth2.tmpl
@@ -30,7 +30,7 @@
 
 <div class="ui small basic delete modal" id="revoke-gitea-oauth2-grant">
 	<div class="ui icon header">
-		{{svg "octicon-shield" 16 "mr-2"}}
+		{{svg "octicon-shield" 16 "gt-mr-2"}}
 		{{.locale.Tr "settings.revoke_oauth2_grant"}}
 	</div>
 	<div class="content">
diff --git a/templates/user/settings/keys_gpg.tmpl b/templates/user/settings/keys_gpg.tmpl
index 0968069c3..c80890940 100644
--- a/templates/user/settings/keys_gpg.tmpl
+++ b/templates/user/settings/keys_gpg.tmpl
@@ -5,7 +5,7 @@
 	</div>
 </h4>
 <div class="ui attached segment">
-	<div class="{{if not .HasGPGError}}hide{{end}} mb-4" id="add-gpg-key-panel">
+	<div class="{{if not .HasGPGError}}gt-hidden{{end}} gt-mb-4" id="add-gpg-key-panel">
 		<form class="ui form{{if .HasGPGError}} error{{end}}" action="{{.Link}}" method="post">
 			{{.CsrfTokenHtml}}
 			<input type="hidden" name="title" value="none">
@@ -39,7 +39,7 @@
 			</button>
 		</form>
 	</div>
-	<div class="ui key list mt-0">
+	<div class="ui key list gt-mt-0">
 		<div class="item">
 			{{.locale.Tr "settings.gpg_desc"}}
 		</div>
diff --git a/templates/user/settings/keys_principal.tmpl b/templates/user/settings/keys_principal.tmpl
index b0cacbe54..cc1152b73 100644
--- a/templates/user/settings/keys_principal.tmpl
+++ b/templates/user/settings/keys_principal.tmpl
@@ -34,7 +34,7 @@
 	</div>
 	<br>
 
-	<div {{if not .HasPrincipalError}}class="hide"{{end}} id="add-ssh-principal-panel">
+	<div {{if not .HasPrincipalError}}class="gt-hidden"{{end}} id="add-ssh-principal-panel">
 		<h4 class="ui top attached header">
 			{{.locale.Tr "settings.add_new_principal"}}
 		</h4>
diff --git a/templates/user/settings/keys_ssh.tmpl b/templates/user/settings/keys_ssh.tmpl
index 093395390..891959d35 100644
--- a/templates/user/settings/keys_ssh.tmpl
+++ b/templates/user/settings/keys_ssh.tmpl
@@ -11,7 +11,7 @@
 	</div>
 </h4>
 <div class="ui attached segment">
-	<div class="{{if not .HasSSHError}}hide{{end}} mb-4" id="add-ssh-key-panel">
+	<div class="{{if not .HasSSHError}}gt-hidden{{end}} gt-mb-4" id="add-ssh-key-panel">
 		<form class="ui form" action="{{.Link}}" method="post">
 			{{.CsrfTokenHtml}}
 			<div class="field {{if .Err_Title}}error{{end}}">
@@ -31,7 +31,7 @@
 			</button>
 		</form>
 	</div>
-	<div class="ui key list mt-0">
+	<div class="ui key list gt-mt-0">
 		<div class="item">
 			{{.locale.Tr "settings.ssh_desc"}}
 		</div>
diff --git a/templates/user/settings/organization.tmpl b/templates/user/settings/organization.tmpl
index 8f1f682ab..cd513db24 100644
--- a/templates/user/settings/organization.tmpl
+++ b/templates/user/settings/organization.tmpl
@@ -26,7 +26,7 @@
 								</button>
 							</form>
 						</div>
-						{{avatar . 28 "mini"}}
+						{{avatar $.Context . 28 "mini"}}
 						<div class="content">
 								<a href="{{.HomeLink}}">{{.Name}}</a>
 						</div>
diff --git a/templates/user/settings/profile.tmpl b/templates/user/settings/profile.tmpl
index a362bf2c2..240a579fb 100644
--- a/templates/user/settings/profile.tmpl
+++ b/templates/user/settings/profile.tmpl
@@ -12,8 +12,8 @@
 				{{.CsrfTokenHtml}}
 				<div class="required field {{if .Err_Name}}error{{end}}">
 					<label for="username">{{.locale.Tr "username"}}
-						<span class="text red hide" id="name-change-prompt"> {{.locale.Tr "settings.change_username_prompt"}}</span>
-						<span class="text red hide" id="name-change-redirect-prompt"> {{.locale.Tr "settings.change_username_redirect_prompt"}}</span>
+						<span class="text red gt-hidden" id="name-change-prompt"> {{.locale.Tr "settings.change_username_prompt"}}</span>
+						<span class="text red gt-hidden" id="name-change-redirect-prompt"> {{.locale.Tr "settings.change_username_redirect_prompt"}}</span>
 					</label>
 					<input id="username" name="name" value="{{.SignedUser.Name}}" data-name="{{.SignedUser.Name}}" autofocus required {{if or (not .SignedUser.IsLocal) .IsReverseProxy}}disabled{{end}}>
 					{{if or (not .SignedUser.IsLocal) .IsReverseProxy}}
@@ -101,7 +101,7 @@
 		<div class="ui attached segment">
 			<form class="ui form" action="{{.Link}}/avatar" method="post" enctype="multipart/form-data">
 				{{.CsrfTokenHtml}}
-				{{if not DisableGravatar}}
+				{{if not (DisableGravatar $.Context)}}
 				<div class="inline field">
 					<div class="ui radio checkbox">
 						<input name="source" value="lookup" type="radio" {{if not .SignedUser.UseCustomAvatar}}checked{{end}}>
diff --git a/templates/user/settings/repos.tmpl b/templates/user/settings/repos.tmpl
index c655aa86d..902b3fb2f 100644
--- a/templates/user/settings/repos.tmpl
+++ b/templates/user/settings/repos.tmpl
@@ -109,15 +109,15 @@
 							<div class="item">
 								<div class="content">
 									{{if .IsPrivate}}
-										{{svg "octicon-lock" 16 "mr-2 iconFloat text gold"}}
+										{{svg "octicon-lock" 16 "gt-mr-2 iconFloat text gold"}}
 									{{else if .IsFork}}
-										{{svg "octicon-repo-forked" 16 "mr-2 iconFloat"}}
+										{{svg "octicon-repo-forked" 16 "gt-mr-2 iconFloat"}}
 									{{else if .IsMirror}}
-										{{svg "octicon-mirror" 16 "mr-2 iconFloat"}}
+										{{svg "octicon-mirror" 16 "gt-mr-2 iconFloat"}}
 									{{else if .IsTemplate}}
-										{{svg "octicon-repo-template" 16 "mr-2 iconFloat"}}
+										{{svg "octicon-repo-template" 16 "gt-mr-2 iconFloat"}}
 									{{else}}
-										{{svg "octicon-repo" 16 "mr-2 iconFloat"}}
+										{{svg "octicon-repo" 16 "gt-mr-2 iconFloat"}}
 									{{end}}
 									<a class="name" href="{{.Link}}">{{.OwnerName}}/{{.Name}}</a>
 									<span>{{FileSize .Size}}</span>