diff --git a/templates/repo/issue/list.tmpl b/templates/repo/issue/list.tmpl
index a7311c24903..d739561d279 100644
--- a/templates/repo/issue/list.tmpl
+++ b/templates/repo/issue/list.tmpl
@@ -215,9 +215,9 @@
 					{{if not .Repository.IsArchived}}
 					<!-- Action Button -->
 					{{if .IsShowClosed}}
-						<button class="ui green active basic button issue-action" data-action="open" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.locale.Tr "repo.issues.action_open"}}</button>
+						<button class="ui green active basic button issue-action gt-ml-auto" data-action="open" data-url="{{$.RepoLink}}/issues/status">{{.locale.Tr "repo.issues.action_open"}}</button>
 					{{else}}
-						<button class="ui red active basic button issue-action" data-action="close" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.locale.Tr "repo.issues.action_close"}}</button>
+						<button class="ui red active basic button issue-action gt-ml-auto" data-action="close" data-url="{{$.RepoLink}}/issues/status">{{.locale.Tr "repo.issues.action_close"}}</button>
 					{{end}}
 					<!-- Labels -->
 					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item">
diff --git a/templates/repo/issue/milestone_issues.tmpl b/templates/repo/issue/milestone_issues.tmpl
index a1fc2458873..82d2cac9434 100644
--- a/templates/repo/issue/milestone_issues.tmpl
+++ b/templates/repo/issue/milestone_issues.tmpl
@@ -51,7 +51,7 @@
 			<div class="issue-list-toolbar-right">
 				<div class="ui secondary filter stackable menu labels">
 					<!-- Label -->
-					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item label-filter" style="margin-left: auto">
+					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item label-filter gt-ml-auto">
 						<span class="text">
 							{{.locale.Tr "repo.issues.filter_label"}}
 							{{svg "octicon-triangle-down" 14 "dropdown icon"}}
@@ -153,9 +153,9 @@
 				<div class="ui secondary filter stackable menu">
 					<!-- Action Button -->
 					{{if .IsShowClosed}}
-						<button class="ui green active basic button issue-action" data-action="open" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.locale.Tr "repo.issues.action_open"}}</button>
+						<button class="ui green active basic button issue-action gt-ml-auto" data-action="open" data-url="{{$.RepoLink}}/issues/status">{{.locale.Tr "repo.issues.action_open"}}</button>
 					{{else}}
-						<button class="ui red active basic button issue-action" data-action="close" data-url="{{$.RepoLink}}/issues/status" style="margin-left: auto">{{.locale.Tr "repo.issues.action_close"}}</button>
+						<button class="ui red active basic button issue-action gt-ml-auto" data-action="close" data-url="{{$.RepoLink}}/issues/status">{{.locale.Tr "repo.issues.action_close"}}</button>
 					{{end}}
 					<!-- Labels -->
 					<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item">
diff --git a/templates/user/dashboard/navbar.tmpl b/templates/user/dashboard/navbar.tmpl
index 7703bbfb98c..20b66b2ec37 100644
--- a/templates/user/dashboard/navbar.tmpl
+++ b/templates/user/dashboard/navbar.tmpl
@@ -78,7 +78,7 @@
 
 	{{if .ContextUser.IsOrganization}}
 		<div class="right stackable menu">
-			<a class="{{if .PageIsNews}}active {{end}}item" style="margin-left: auto" href="{{.ContextUser.DashboardLink}}{{if .Team}}/{{PathEscape .Team.Name}}{{end}}">
+			<a class="{{if .PageIsNews}}active {{end}}item gt-ml-auto" href="{{.ContextUser.DashboardLink}}{{if .Team}}/{{PathEscape .Team.Name}}{{end}}">
 				{{svg "octicon-rss"}}&nbsp;{{.locale.Tr "activities"}}
 			</a>
 			{{if not .UnitIssuesGlobalDisabled}}
diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl
index 1ea34fe2a68..b8efd2433e8 100644
--- a/templates/user/notification/notification_div.tmpl
+++ b/templates/user/notification/notification_div.tmpl
@@ -11,17 +11,17 @@
 				{{.locale.Tr "notification.read"}}
 			</a>
 			{{if and (eq .Status 1)}}
-				<form action="{{AppSubUrl}}/notifications/purge" method="POST" style="margin-left: auto;">
+				<form class="gt-ml-auto" action="{{AppSubUrl}}/notifications/purge" method="POST">
 					{{$.CsrfTokenHtml}}
 					<div class="{{if not $notificationUnreadCount}}gt-hidden{{end}}">
-						<button class="ui mini button primary" title='{{$.locale.Tr "notification.mark_all_as_read"}}'>
+						<button class="ui mini button primary gt-mr-0" title='{{$.locale.Tr "notification.mark_all_as_read"}}'>
 							{{svg "octicon-checklist"}}
 						</button>
 					</div>
 				</form>
 			{{end}}
 		</div>
-		<div class="ui bottom attached active tab segment">
+		<div class="ui bottom attached active tab segment gt-p-3">
 			{{if eq (len .Notifications) 0}}
 				{{if eq .Status 1}}
 					{{.locale.Tr "notification.no_unread"}}
@@ -29,7 +29,7 @@
 					{{.locale.Tr "notification.no_read"}}
 				{{end}}
 			{{else}}
-				<table class="ui unstackable striped very compact small selectable table" id="notification_table">
+				<table class="ui unstackable very compact small table" id="notification_table">
 					<tbody>
 						{{range $notification := .Notifications}}
 							{{$issue := .Issue}}
@@ -59,16 +59,16 @@
 									{{end}}
 								</td>
 								<td class="eleven wide">
-									<a class="item" href="{{.Link}}">
+									<a class="item issue-title muted" href="{{.Link}}">
 										{{if $issue}}
-											#{{$issue.Index}} - {{$issue.Title}}
+											#{{$issue.Index}} - {{$issue.Title | RenderEmoji $.Context | RenderCodeBlock}}
 										{{else}}
 											{{$repo.FullName}}
 										{{end}}
 									</a>
 								</td>
 								<td>
-									<a class="item" href="{{$repo.Link}}">{{$repo.FullName}}</a>
+									<a class="item muted" href="{{$repo.Link}}">{{$repo.FullName}}</a>
 								</td>
 								<td class="collapsing">
 									{{if ne .Status 3}}
@@ -76,7 +76,7 @@
 											{{$.CsrfTokenHtml}}
 											<input type="hidden" name="notification_id" value="{{.ID}}">
 											<input type="hidden" name="status" value="pinned">
-											<button class="ui mini button" title='{{$.locale.Tr "notification.pin"}}'
+											<button class="ui mini button button-link" title='{{$.locale.Tr "notification.pin"}}'
 												data-url="{{AppSubUrl}}/notifications/status"
 												data-status="pinned"
 												data-page="{{$.Page.Paginater.Current}}"
@@ -94,7 +94,7 @@
 											<input type="hidden" name="notification_id" value="{{.ID}}">
 											<input type="hidden" name="status" value="read">
 											<input type="hidden" name="page" value="{{$.Page.Paginater.Current}}">
-											<button class="ui mini button" title='{{$.locale.Tr "notification.mark_as_read"}}'
+											<button class="ui mini button button-link" title='{{$.locale.Tr "notification.mark_as_read"}}'
 												data-url="{{AppSubUrl}}/notifications/status"
 												data-status="read"
 												data-page="{{$.Page.Paginater.Current}}"
@@ -109,7 +109,7 @@
 											<input type="hidden" name="notification_id" value="{{.ID}}">
 											<input type="hidden" name="status" value="unread">
 											<input type="hidden" name="page" value="{{$.Page.Paginater.Current}}">
-											<button class="ui mini button" title='{{$.locale.Tr "notification.mark_as_unread"}}'
+											<button class="ui mini button button-link" title='{{$.locale.Tr "notification.mark_as_unread"}}'
 												data-url="{{AppSubUrl}}/notifications/status"
 												data-status="unread"
 												data-page="{{$.Page.Paginater.Current}}"
diff --git a/web_src/css/base.css b/web_src/css/base.css
index 591c09377cd..c33acbe9c4e 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -1148,6 +1148,12 @@ a.ui.card:hover {
   border-top-color: var(--color-secondary-alpha-50);
 }
 
+.ui.striped.table > tr:nth-child(2n),
+.ui.striped.table > tbody > tr:nth-child(2n),
+.ui.basic.striped.table > tbody > tr:nth-child(2n) {
+  background: var(--color-light);
+}
+
 .ui.ui.ui.ui.table tr.active,
 .ui.ui.table td.active {
   color: var(--color-text);
@@ -2232,6 +2238,16 @@ a.ui.active.label:hover {
   border-left: none;
 }
 
+.ui.button.button-link {
+  background: transparent;
+  border: none;
+  color: inherit;
+}
+
+.ui.button.button-link:hover {
+  color: var(--color-primary);
+}
+
 .two-toggle-buttons .button:not(.active):first-of-type {
   border-right: none;
 }
diff --git a/web_src/css/helpers.css b/web_src/css/helpers.css
index ceb20db043c..22e18f79269 100644
--- a/web_src/css/helpers.css
+++ b/web_src/css/helpers.css
@@ -163,6 +163,14 @@ Gitea's private styles use `g-` prefix.
 .gt-my-4 { margin-top: 1rem !important; margin-bottom: 1rem !important; }
 .gt-my-5 { margin-top: 2rem !important; margin-bottom: 2rem !important; }
 
+.gt-m-auto  { margin: auto !important; }
+.gt-mx-auto { margin-left: auto !important; margin-right: auto !important; }
+.gt-my-auto { margin-top: auto !important; margin-bottom: auto !important; }
+.gt-mt-auto { margin-top: auto !important; }
+.gt-mr-auto { margin-right: auto !important; }
+.gt-mb-auto { margin-bottom: auto !important; }
+.gt-ml-auto { margin-left: auto !important; }
+
 .gt-p-0 { padding: 0 !important; }
 .gt-p-1 { padding: .125rem !important; }
 .gt-p-2 { padding: .25rem !important; }
diff --git a/web_src/css/themes/theme-arc-green.css b/web_src/css/themes/theme-arc-green.css
index 42cde818029..84007d2e2df 100644
--- a/web_src/css/themes/theme-arc-green.css
+++ b/web_src/css/themes/theme-arc-green.css
@@ -151,7 +151,7 @@
   --color-menu: #2e323e;
   --color-card: #2e323e;
   --color-markup-table-row: #ffffff06;
-  --color-markup-code-block: #ffffff0d;
+  --color-markup-code-block: #ffffff16;
   --color-button: #353846;
   --color-code-bg: #2a2e3a;
   --color-code-sidebar-bg: #2e323e;