diff --git a/custom/conf/app.example.ini b/custom/conf/app.example.ini
index 95ad9fe399ff..3ceb53dcd0a3 100644
--- a/custom/conf/app.example.ini
+++ b/custom/conf/app.example.ini
@@ -303,7 +303,7 @@ RUN_MODE = ; prod
 LFS_JWT_SECRET =
 ;;
 ;; LFS authentication validity period (in time.Duration), pushes taking longer than this may fail.
-;LFS_HTTP_AUTH_EXPIRY = 20m
+;LFS_HTTP_AUTH_EXPIRY = 24h
 ;;
 ;; Maximum allowed LFS file size in bytes (Set to 0 for no limit).
 ;LFS_MAX_FILE_SIZE = 0
diff --git a/docs/content/doc/actions/act-runner.en-us.md b/docs/content/doc/actions/act-runner.en-us.md
index 7c1f5c73c083..03d01bfa7cd8 100644
--- a/docs/content/doc/actions/act-runner.en-us.md
+++ b/docs/content/doc/actions/act-runner.en-us.md
@@ -138,7 +138,7 @@ You may be confused about the runner labels, which will be explained later.
 If you want to register the runner in a non-interactive way, you can use arguments to do it.
 
 ```bash
-./act_runner register --no-interactive --instance <intance_url> --token <registration_token> --name <runner_name> --labels <runner_labels>
+./act_runner register --no-interactive --instance <instance_url> --token <registration_token> --name <runner_name> --labels <runner_labels>
 ```
 
 When you have registered the runner, you can find a new file named `.runner` in the current directory.
diff --git a/docs/content/doc/actions/comparison.en-us.md b/docs/content/doc/actions/comparison.en-us.md
index f916440af571..209fa2adc0b1 100644
--- a/docs/content/doc/actions/comparison.en-us.md
+++ b/docs/content/doc/actions/comparison.en-us.md
@@ -132,7 +132,7 @@ The missing host will be filled with `https://gitea.com` if you don't configure
 That means `uses: actions/checkout@v3` will download the action from [gitea.com/actions/checkout](https://gitea.com/actions/checkout), instead of [github.com/actions/checkout](https://github.com/actions/checkout).
 
 As mentioned, it's configurable.
-If you want your runners to download actions from GitHub or your own Gitea instance by default, you can configure it by setting `[actions].DEFAULT_ACTIONS_URL`. See [Configuration Cheat Sheet](({{ < relref "doc/administration/config-cheat-sheet.en-us.md#actions-actions" > }})).
+If you want your runners to download actions from GitHub or your own Gitea instance by default, you can configure it by setting `[actions].DEFAULT_ACTIONS_URL`. See [Configuration Cheat Sheet]({{< relref "doc/administration/config-cheat-sheet.en-us.md#actions-actions" >}}).
 
 ### Context availability
 
diff --git a/docs/content/doc/actions/quickstart.en-us.md b/docs/content/doc/actions/quickstart.en-us.md
index 74bbedea2428..72f1dda08292 100644
--- a/docs/content/doc/actions/quickstart.en-us.md
+++ b/docs/content/doc/actions/quickstart.en-us.md
@@ -24,7 +24,7 @@ This page will guide you through the process of using Gitea Actions.
 ## Set up Gitea
 
 First of all, you need a Gitea instance.
-You can follow the [documentation]({{ < relref "doc/installation/from-package.en-us.md" > }}) to set up a new instance or upgrade your existing one.
+You can follow the [documentation]({{< relref "doc/installation/from-package.en-us.md" >}}) to set up a new instance or upgrade your existing one.
 It doesn't matter how you install or run Gitea, as long as its version is 1.19.0 or higher.
 
 Actions are disabled by default, so you need to add the following to the configuration file to enable it:
@@ -34,7 +34,7 @@ Actions are disabled by default, so you need to add the following to the configu
 ENABLED=true
 ```
 
-If you want to learn more or encounter any problems while configuring it, please refer to the [Configuration Cheat Sheet]({{ < relref "doc/administration/config-cheat-sheet.en-us.md#actions-actions" > }}).
+If you want to learn more or encounter any problems while configuring it, please refer to the [Configuration Cheat Sheet]({{< relref "doc/administration/config-cheat-sheet.en-us.md#actions-actions" >}}).
 
 ### Set up runner
 
@@ -85,7 +85,7 @@ And you can see the new runner in the management page:
 
 ![view runner](/images/usage/actions/view-runner.png)
 
-You can find more information by visiting [Act runner]({{ < relref "doc/actions/act-runner.en-us.md" > }}).
+You can find more information by visiting [Act runner]({{< relref "doc/actions/act-runner.en-us.md" >}}).
 
 ### Use Actions
 
@@ -119,7 +119,7 @@ jobs:
       - name: List files in the repository
         run: |
           ls ${{ gitea.workspace }}
-      - run: echo "🍏 This job's status is ${{ gitea.status }}."
+      - run: echo "🍏 This job's status is ${{ job.status }}."
 ```
 
 You can upload it as a file with the extension `.yaml` in the directory `.gitea/workflows/` of the repository, for example `.gitea/workflows/demo.yaml`.
@@ -129,7 +129,7 @@ That is because  Gitea Actions is designed to be compatible with GitHub Actions
 Be careful, the demo file contains some emojis.
 Please make sure your database supports them, especially when using MySQL.
 If the charset is not `utf8mb4`, errors will occur, such as `Error 1366 (HY000): Incorrect string value: '\\xF0\\x9F\\x8E\\x89 T...' for column 'name' at row 1`.
-See [Database Preparation]( {{ < relref "doc/installation/database-preparation.en-us.md#mysql" > }}) for more information.
+See [Database Preparation]({{< relref "doc/installation/database-preparation.en-us.md#mysql" >}}) for more information.
 
 Alternatively, you can remove all emojis from the demo file and try again.
 
diff --git a/docs/content/doc/administration/config-cheat-sheet.en-us.md b/docs/content/doc/administration/config-cheat-sheet.en-us.md
index 294f50bc81e6..c1befed48980 100644
--- a/docs/content/doc/administration/config-cheat-sheet.en-us.md
+++ b/docs/content/doc/administration/config-cheat-sheet.en-us.md
@@ -364,7 +364,7 @@ The following configuration set `Content-Type: application/vnd.android.package-a
 - `LFS_START_SERVER`: **false**: Enables Git LFS support.
 - `LFS_CONTENT_PATH`: **%(APP_DATA_PATH)s/lfs**: Default LFS content path. (if it is on local storage.) **DEPRECATED** use settings in `[lfs]`.
 - `LFS_JWT_SECRET`: **\<empty\>**: LFS authentication secret, change this a unique string.
-- `LFS_HTTP_AUTH_EXPIRY`: **20m**: LFS authentication validity period in time.Duration, pushes taking longer than this may fail.
+- `LFS_HTTP_AUTH_EXPIRY`: **24h**: LFS authentication validity period in time.Duration, pushes taking longer than this may fail.
 - `LFS_MAX_FILE_SIZE`: **0**: Maximum allowed LFS file size in bytes (Set to 0 for no limit).
 - `LFS_LOCKS_PAGING_NUM`: **50**: Maximum number of LFS Locks returned per page.
 
diff --git a/docs/content/doc/administration/reverse-proxies.en-us.md b/docs/content/doc/administration/reverse-proxies.en-us.md
index d11552bb9fa3..a6efd86549a0 100644
--- a/docs/content/doc/administration/reverse-proxies.en-us.md
+++ b/docs/content/doc/administration/reverse-proxies.en-us.md
@@ -25,12 +25,13 @@ menu:
 
 If you want Nginx to serve your Gitea instance, add the following `server` section to the `http` section of `nginx.conf`:
 
-```apacheconf
+```
 server {
     listen 80;
     server_name git.example.com;
 
     location / {
+        client_max_body_size 512M;
         proxy_pass http://localhost:3000;
         proxy_set_header Host $host;
         proxy_set_header X-Real-IP $remote_addr;
@@ -40,23 +41,32 @@ server {
 }
 ```
 
+### Resolving Error: 413 Request Entity Too Large
+
+This error indicates nginx is configured to restrict the file upload size,
+it affects attachment uploading, form posting, package uploading and LFS pushing, etc.
+You can fine tune the `client_max_body_size` option according to [nginx document](http://nginx.org/en/docs/http/ngx_http_core_module.html#client_max_body_size).
+
 ## Nginx with a sub-path
 
 In case you already have a site, and you want Gitea to share the domain name, you can setup Nginx to serve Gitea under a sub-path by adding the following `server` section inside the `http` section of `nginx.conf`:
 
-```apacheconf
+```
 server {
     listen 80;
     server_name git.example.com;
 
     # Note: Trailing slash
-    location /git/ {
-        # Note: Trailing slash
-        proxy_pass http://localhost:3000/;
-        proxy_set_header Host $host;
-        proxy_set_header X-Real-IP $remote_addr;
-        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-        proxy_set_header X-Forwarded-Proto $scheme;
+    location /gitea/ {
+        client_max_body_size 512M;
+
+        # make nginx use unescaped URI, keep "%2F" as is
+        rewrite ^ $request_uri;
+        rewrite ^/gitea(/.*) $1 break;
+        proxy_pass http://127.0.0.1:3000$uri;
+
+        # other common HTTP headers, see the "Nginx" config section above
+        proxy_set_header ...
     }
 }
 ```
@@ -132,14 +142,6 @@ server {
 }
 ```
 
-## Resolving Error: 413 Request Entity Too Large
-
-This error indicates nginx is configured to restrict the file upload size.
-
-In your nginx config file containing your Gitea proxy directive, find the `location { ... }` block for Gitea and add the line
-`client_max_body_size 16M;` to set this limit to 16 megabytes or any other number of choice.
-If you use Git LFS, this will also limit the size of the largest file you will be able to push.
-
 ## Apache HTTPD
 
 If you want Apache HTTPD to serve your Gitea instance, you can add the following to your Apache HTTPD configuration (usually located at `/etc/apache2/httpd.conf` in Ubuntu):
@@ -387,3 +389,13 @@ gitea:
 This config assumes that you are handling HTTPS on the traefik side and using HTTP between Gitea and traefik.
 
 Then you **MUST** set something like `[server] ROOT_URL = http://example.com/gitea/` correctly in your configuration.
+
+## General sub-path configuration
+
+Usually it's not recommended to put Gitea in a sub-path, it's not widely used and may have some issues in rare cases.
+
+If you really need to do so, to make Gitea works with sub-path (eg: `http://example.com/gitea/`), here are the requirements:
+
+1. Set `[server] ROOT_URL = http://example.com/gitea/` in your `app.ini` file.
+2. Make the reverse-proxy pass `http://example.com/gitea/foo` to `http://gitea-server:3000/foo`.
+3. Make sure the reverse-proxy not decode the URI, the request `http://example.com/gitea/a%2Fb` should be passed as `http://gitea-server:3000/a%2Fb`.
diff --git a/docs/content/doc/development/hacking-on-gitea.zh-cn.md b/docs/content/doc/development/hacking-on-gitea.zh-cn.md
index 3a4078dfdb62..6a18777ed686 100644
--- a/docs/content/doc/development/hacking-on-gitea.zh-cn.md
+++ b/docs/content/doc/development/hacking-on-gitea.zh-cn.md
@@ -168,7 +168,7 @@ make lint-backend
 
 ### 处理 JS 和 CSS
 
-前端开发应遵循 [Guidelines for Frontend Development]({{ < 相关参考 "doc/development/guidelines-frontend.en-us.md" > }})
+前端开发应遵循 [Guidelines for Frontend Development]({{< relref "doc/contributing/guidelines-frontend.zh-cn.md" >}})。
 
 要使用前端资源构建，请使用上面提到的“watch-frontend”目标或只构建一次：
 
diff --git a/docs/content/doc/usage/packages/swift.en-us.md b/docs/content/doc/usage/packages/swift.en-us.md
index a1c818021cd3..3164f8d17016 100644
--- a/docs/content/doc/usage/packages/swift.en-us.md
+++ b/docs/content/doc/usage/packages/swift.en-us.md
@@ -15,7 +15,7 @@ menu:
 
 # Swift Packages Repository
 
-Publish [Swift](hhttps://www.swift.org/) packages for your user or organization.
+Publish [Swift](https://www.swift.org/) packages for your user or organization.
 
 **Table of Contents**
 
diff --git a/docs/content/doc/usage/push.zh-tw.md b/docs/content/doc/usage/push.zh-tw.md
index 7647b6b029ef..5fe5052c113d 100644
--- a/docs/content/doc/usage/push.zh-tw.md
+++ b/docs/content/doc/usage/push.zh-tw.md
@@ -54,7 +54,7 @@ Push to create is a feature that allows you to push to a repository that does no
 
 ## Enabling Push To Create
 
-In the `app.ini` file, set `ENABLE_PUSH_CREATE_USER` to `true` and `ENABLE_PUSH_CREATE_ORG` to `true` if you want to allow users to create repositories in their own user account and in organizations they are a member of respectively. Restart Gitea for the changes to take effect. You can read more about these two options in the [Configuration Cheat Sheet]({{ < relref "doc/administration/config-cheat-sheet.zh-tw.md#repository-repository" > }}).
+In the `app.ini` file, set `ENABLE_PUSH_CREATE_USER` to `true` and `ENABLE_PUSH_CREATE_ORG` to `true` if you want to allow users to create repositories in their own user account and in organizations they are a member of respectively. Restart Gitea for the changes to take effect. You can read more about these two options in the [Configuration Cheat Sheet]({{< relref "doc/administration/config-cheat-sheet.zh-tw.md#repository-repository" >}}).
 
 ## Using Push To Create
 
diff --git a/models/actions/task.go b/models/actions/task.go
index ffec4c92aa8d..66cd2bbea114 100644
--- a/models/actions/task.go
+++ b/models/actions/task.go
@@ -291,7 +291,7 @@ func CreateTaskForRunner(ctx context.Context, runner *ActionRunner) (*ActionTask
 	}
 
 	task.LogFilename = logFileName(job.Run.Repo.FullName(), task.ID)
-	if _, err := e.ID(task.ID).Cols("log_filename").Update(task); err != nil {
+	if err := UpdateTask(ctx, task, "log_filename"); err != nil {
 		return nil, false, err
 	}
 
@@ -367,9 +367,18 @@ func UpdateTaskByState(ctx context.Context, state *runnerv1.TaskState) (*ActionT
 		return nil, util.ErrNotExist
 	}
 
+	if task.Status.IsDone() {
+		// the state is final, do nothing
+		return task, nil
+	}
+
+	// state.Result is not unspecified means the task is finished
 	if state.Result != runnerv1.Result_RESULT_UNSPECIFIED {
 		task.Status = Status(state.Result)
 		task.Stopped = timeutil.TimeStamp(state.StoppedAt.AsTime().Unix())
+		if err := UpdateTask(ctx, task, "status", "stopped"); err != nil {
+			return nil, err
+		}
 		if _, err := UpdateRunJob(ctx, &ActionRunJob{
 			ID:      task.JobID,
 			Status:  task.Status,
@@ -379,10 +388,6 @@ func UpdateTaskByState(ctx context.Context, state *runnerv1.TaskState) (*ActionT
 		}
 	}
 
-	if _, err := e.ID(task.ID).Update(task); err != nil {
-		return nil, err
-	}
-
 	if err := task.LoadAttributes(ctx); err != nil {
 		return nil, err
 	}
@@ -440,7 +445,7 @@ func StopTask(ctx context.Context, taskID int64, status Status) error {
 		return err
 	}
 
-	if _, err := e.ID(task.ID).Update(task); err != nil {
+	if err := UpdateTask(ctx, task, "status", "stopped"); err != nil {
 		return err
 	}
 
diff --git a/models/issues/label.go b/models/issues/label.go
index 35c649e8f24d..9c22dcdd2d26 100644
--- a/models/issues/label.go
+++ b/models/issues/label.go
@@ -159,33 +159,6 @@ func (l *Label) BelongsToRepo() bool {
 	return l.RepoID > 0
 }
 
-// Get color as RGB values in 0..255 range
-func (l *Label) ColorRGB() (float64, float64, float64, error) {
-	color, err := strconv.ParseUint(l.Color[1:], 16, 64)
-	if err != nil {
-		return 0, 0, 0, err
-	}
-
-	r := float64(uint8(0xFF & (uint32(color) >> 16)))
-	g := float64(uint8(0xFF & (uint32(color) >> 8)))
-	b := float64(uint8(0xFF & uint32(color)))
-	return r, g, b, nil
-}
-
-// Determine if label text should be light or dark to be readable on background color
-func (l *Label) UseLightTextColor() bool {
-	if strings.HasPrefix(l.Color, "#") {
-		if r, g, b, err := l.ColorRGB(); err == nil {
-			// Perceived brightness from: https://www.w3.org/TR/AERT/#color-contrast
-			// In the future WCAG 3 APCA may be a better solution
-			brightness := (0.299*r + 0.587*g + 0.114*b) / 255
-			return brightness < 0.35
-		}
-	}
-
-	return false
-}
-
 // Return scope substring of label name, or empty string if none exists
 func (l *Label) ExclusiveScope() string {
 	if !l.Exclusive {
diff --git a/models/issues/label_test.go b/models/issues/label_test.go
index 1f6ce4f42ee7..1bc5a1a93544 100644
--- a/models/issues/label_test.go
+++ b/models/issues/label_test.go
@@ -22,15 +22,6 @@ func TestLabel_CalOpenIssues(t *testing.T) {
 	assert.EqualValues(t, 2, label.NumOpenIssues)
 }
 
-func TestLabel_TextColor(t *testing.T) {
-	assert.NoError(t, unittest.PrepareTestDatabase())
-	label := unittest.AssertExistsAndLoadBean(t, &issues_model.Label{ID: 1})
-	assert.False(t, label.UseLightTextColor())
-
-	label = unittest.AssertExistsAndLoadBean(t, &issues_model.Label{ID: 2})
-	assert.True(t, label.UseLightTextColor())
-}
-
 func TestLabel_ExclusiveScope(t *testing.T) {
 	assert.NoError(t, unittest.PrepareTestDatabase())
 	label := unittest.AssertExistsAndLoadBean(t, &issues_model.Label{ID: 7})
diff --git a/models/issues/review.go b/models/issues/review.go
index fe123d73986b..ed30bce149a3 100644
--- a/models/issues/review.go
+++ b/models/issues/review.go
@@ -189,6 +189,20 @@ func (r *Review) LoadAttributes(ctx context.Context) (err error) {
 	return err
 }
 
+func (r *Review) HTMLTypeColorName() string {
+	switch r.Type {
+	case ReviewTypeApprove:
+		return "green"
+	case ReviewTypeComment:
+		return "grey"
+	case ReviewTypeReject:
+		return "red"
+	case ReviewTypeRequest:
+		return "yellow"
+	}
+	return "grey"
+}
+
 // GetReviewByID returns the review by the given ID
 func GetReviewByID(ctx context.Context, id int64) (*Review, error) {
 	review := new(Review)
diff --git a/modules/setting/lfs.go b/modules/setting/lfs.go
index 1b659dd22b03..a5c3631681be 100644
--- a/modules/setting/lfs.go
+++ b/modules/setting/lfs.go
@@ -45,7 +45,7 @@ func loadLFSFrom(rootCfg ConfigProvider) {
 		LFS.LocksPagingNum = 50
 	}
 
-	LFS.HTTPAuthExpiry = sec.Key("LFS_HTTP_AUTH_EXPIRY").MustDuration(20 * time.Minute)
+	LFS.HTTPAuthExpiry = sec.Key("LFS_HTTP_AUTH_EXPIRY").MustDuration(24 * time.Hour)
 
 	if LFS.StartServer {
 		LFS.JWTSecretBytes = make([]byte, 32)
diff --git a/modules/templates/util_render.go b/modules/templates/util_render.go
index a59ddd3f175d..a26c0531f81d 100644
--- a/modules/templates/util_render.go
+++ b/modules/templates/util_render.go
@@ -20,6 +20,7 @@ import (
 	"code.gitea.io/gitea/modules/markup"
 	"code.gitea.io/gitea/modules/markup/markdown"
 	"code.gitea.io/gitea/modules/setting"
+	"code.gitea.io/gitea/modules/util"
 )
 
 // RenderCommitMessage renders commit message with XSS-safe and special links.
@@ -133,7 +134,9 @@ func RenderLabel(ctx context.Context, label *issues_model.Label) template.HTML {
 	labelScope := label.ExclusiveScope()
 
 	textColor := "#111"
-	if label.UseLightTextColor() {
+	r, g, b := util.HexToRBGColor(label.Color)
+	// Determine if label text should be light or dark to be readable on background color
+	if util.UseLightTextOnBackground(r, g, b) {
 		textColor = "#eee"
 	}
 
@@ -150,34 +153,30 @@ func RenderLabel(ctx context.Context, label *issues_model.Label) template.HTML {
 	scopeText := RenderEmoji(ctx, labelScope)
 	itemText := RenderEmoji(ctx, label.Name[len(labelScope)+1:])
 
-	itemColor := label.Color
-	scopeColor := label.Color
-	if r, g, b, err := label.ColorRGB(); err == nil {
-		// Make scope and item background colors slightly darker and lighter respectively.
-		// More contrast needed with higher luminance, empirically tweaked.
-		luminance := (0.299*r + 0.587*g + 0.114*b) / 255
-		contrast := 0.01 + luminance*0.03
-		// Ensure we add the same amount of contrast also near 0 and 1.
-		darken := contrast + math.Max(luminance+contrast-1.0, 0.0)
-		lighten := contrast + math.Max(contrast-luminance, 0.0)
-		// Compute factor to keep RGB values proportional.
-		darkenFactor := math.Max(luminance-darken, 0.0) / math.Max(luminance, 1.0/255.0)
-		lightenFactor := math.Min(luminance+lighten, 1.0) / math.Max(luminance, 1.0/255.0)
-
-		scopeBytes := []byte{
-			uint8(math.Min(math.Round(r*darkenFactor), 255)),
-			uint8(math.Min(math.Round(g*darkenFactor), 255)),
-			uint8(math.Min(math.Round(b*darkenFactor), 255)),
-		}
-		itemBytes := []byte{
-			uint8(math.Min(math.Round(r*lightenFactor), 255)),
-			uint8(math.Min(math.Round(g*lightenFactor), 255)),
-			uint8(math.Min(math.Round(b*lightenFactor), 255)),
-		}
-
-		itemColor = "#" + hex.EncodeToString(itemBytes)
-		scopeColor = "#" + hex.EncodeToString(scopeBytes)
-	}
+	// Make scope and item background colors slightly darker and lighter respectively.
+	// More contrast needed with higher luminance, empirically tweaked.
+	luminance := util.GetLuminance(r, g, b)
+	contrast := 0.01 + luminance*0.03
+	// Ensure we add the same amount of contrast also near 0 and 1.
+	darken := contrast + math.Max(luminance+contrast-1.0, 0.0)
+	lighten := contrast + math.Max(contrast-luminance, 0.0)
+	// Compute factor to keep RGB values proportional.
+	darkenFactor := math.Max(luminance-darken, 0.0) / math.Max(luminance, 1.0/255.0)
+	lightenFactor := math.Min(luminance+lighten, 1.0) / math.Max(luminance, 1.0/255.0)
+
+	scopeBytes := []byte{
+		uint8(math.Min(math.Round(r*darkenFactor), 255)),
+		uint8(math.Min(math.Round(g*darkenFactor), 255)),
+		uint8(math.Min(math.Round(b*darkenFactor), 255)),
+	}
+	itemBytes := []byte{
+		uint8(math.Min(math.Round(r*lightenFactor), 255)),
+		uint8(math.Min(math.Round(g*lightenFactor), 255)),
+		uint8(math.Min(math.Round(b*lightenFactor), 255)),
+	}
+
+	itemColor := "#" + hex.EncodeToString(itemBytes)
+	scopeColor := "#" + hex.EncodeToString(scopeBytes)
 
 	s := fmt.Sprintf("<span class='ui label scope-parent' title='%s'>"+
 		"<div class='ui label scope-left' style='color: %s !important; background-color: %s !important'>%s</div>"+
diff --git a/modules/util/color.go b/modules/util/color.go
new file mode 100644
index 000000000000..240b045c287a
--- /dev/null
+++ b/modules/util/color.go
@@ -0,0 +1,65 @@
+// Copyright 2023 The Gitea Authors. All rights reserved.
+// SPDX-License-Identifier: MIT
+package util
+
+import (
+	"fmt"
+	"math"
+	"strconv"
+	"strings"
+)
+
+// Check similar implementation in web_src/js/utils/color.js and keep synchronization
+
+// Return R, G, B values defined in reletive luminance
+func getLuminanceRGB(channel float64) float64 {
+	sRGB := channel / 255
+	if sRGB <= 0.03928 {
+		return sRGB / 12.92
+	}
+	return math.Pow((sRGB+0.055)/1.055, 2.4)
+}
+
+// Get color as RGB values in 0..255 range from the hex color string (with or without #)
+func HexToRBGColor(colorString string) (float64, float64, float64) {
+	hexString := colorString
+	if strings.HasPrefix(colorString, "#") {
+		hexString = colorString[1:]
+	}
+	// only support transfer of rgb, rgba, rrggbb and rrggbbaa
+	// if not in these formats, use default values 0, 0, 0
+	if len(hexString) != 3 && len(hexString) != 4 && len(hexString) != 6 && len(hexString) != 8 {
+		return 0, 0, 0
+	}
+	if len(hexString) == 3 || len(hexString) == 4 {
+		hexString = fmt.Sprintf("%c%c%c%c%c%c", hexString[0], hexString[0], hexString[1], hexString[1], hexString[2], hexString[2])
+	}
+	if len(hexString) == 8 {
+		hexString = hexString[0:6]
+	}
+	color, err := strconv.ParseUint(hexString, 16, 64)
+	if err != nil {
+		return 0, 0, 0
+	}
+	r := float64(uint8(0xFF & (uint32(color) >> 16)))
+	g := float64(uint8(0xFF & (uint32(color) >> 8)))
+	b := float64(uint8(0xFF & uint32(color)))
+	return r, g, b
+}
+
+// return luminance given RGB channels
+// Reference from: https://www.w3.org/WAI/GL/wiki/Relative_luminance
+func GetLuminance(r, g, b float64) float64 {
+	R := getLuminanceRGB(r)
+	G := getLuminanceRGB(g)
+	B := getLuminanceRGB(b)
+	luminance := 0.2126*R + 0.7152*G + 0.0722*B
+	return luminance
+}
+
+// Reference from: https://firsching.ch/github_labels.html
+// In the future WCAG 3 APCA may be a better solution.
+// Check if text should use light color based on RGB of background
+func UseLightTextOnBackground(r, g, b float64) bool {
+	return GetLuminance(r, g, b) < 0.453
+}
diff --git a/modules/util/color_test.go b/modules/util/color_test.go
new file mode 100644
index 000000000000..d96ac36730ab
--- /dev/null
+++ b/modules/util/color_test.go
@@ -0,0 +1,65 @@
+// Copyright 2023 The Gitea Authors. All rights reserved.
+// SPDX-License-Identifier: MIT
+package util
+
+import (
+	"testing"
+
+	"github.com/stretchr/testify/assert"
+)
+
+func Test_HexToRBGColor(t *testing.T) {
+	cases := []struct {
+		colorString string
+		expectedR   float64
+		expectedG   float64
+		expectedB   float64
+	}{
+		{"2b8685", 43, 134, 133},
+		{"1e1", 17, 238, 17},
+		{"#1e1", 17, 238, 17},
+		{"1e16", 17, 238, 17},
+		{"3bb6b3", 59, 182, 179},
+		{"#3bb6b399", 59, 182, 179},
+		{"#0", 0, 0, 0},
+		{"#00000", 0, 0, 0},
+		{"#1234567", 0, 0, 0},
+	}
+	for n, c := range cases {
+		r, g, b := HexToRBGColor(c.colorString)
+		assert.Equal(t, c.expectedR, r, "case %d: error R should match: expected %f, but get %f", n, c.expectedR, r)
+		assert.Equal(t, c.expectedG, g, "case %d: error G should match: expected %f, but get %f", n, c.expectedG, g)
+		assert.Equal(t, c.expectedB, b, "case %d: error B should match: expected %f, but get %f", n, c.expectedB, b)
+	}
+}
+
+func Test_UseLightTextOnBackground(t *testing.T) {
+	cases := []struct {
+		r        float64
+		g        float64
+		b        float64
+		expected bool
+	}{
+		{215, 58, 74, true},
+		{0, 117, 202, true},
+		{207, 211, 215, false},
+		{162, 238, 239, false},
+		{112, 87, 255, true},
+		{0, 134, 114, true},
+		{228, 230, 105, false},
+		{216, 118, 227, true},
+		{255, 255, 255, false},
+		{43, 134, 133, true},
+		{43, 135, 134, true},
+		{44, 135, 134, true},
+		{59, 182, 179, true},
+		{124, 114, 104, true},
+		{126, 113, 108, true},
+		{129, 112, 109, true},
+		{128, 112, 112, true},
+	}
+	for n, c := range cases {
+		result := UseLightTextOnBackground(c.r, c.g, c.b)
+		assert.Equal(t, c.expected, result, "case %d: error should match", n)
+	}
+}
diff --git a/routers/api/actions/runner/runner.go b/routers/api/actions/runner/runner.go
index 73c6b746a0fe..895b281725da 100644
--- a/routers/api/actions/runner/runner.go
+++ b/routers/api/actions/runner/runner.go
@@ -10,7 +10,6 @@ import (
 
 	actions_model "code.gitea.io/gitea/models/actions"
 	"code.gitea.io/gitea/modules/actions"
-	"code.gitea.io/gitea/modules/json"
 	"code.gitea.io/gitea/modules/log"
 	"code.gitea.io/gitea/modules/util"
 	actions_service "code.gitea.io/gitea/services/actions"
@@ -120,27 +119,7 @@ func (s *Service) UpdateTask(
 	ctx context.Context,
 	req *connect.Request[runnerv1.UpdateTaskRequest],
 ) (*connect.Response[runnerv1.UpdateTaskResponse], error) {
-	{
-		// to debug strange runner behaviors, it could be removed if all problems have been solved.
-		stateMsg, _ := json.Marshal(req.Msg.State)
-		log.Trace("update task with state: %s", stateMsg)
-	}
-
-	// Get Task first
-	task, err := actions_model.GetTaskByID(ctx, req.Msg.State.Id)
-	if err != nil {
-		return nil, status.Errorf(codes.Internal, "can't find the task: %v", err)
-	}
-	if task.Status.IsCancelled() {
-		return connect.NewResponse(&runnerv1.UpdateTaskResponse{
-			State: &runnerv1.TaskState{
-				Id:     req.Msg.State.Id,
-				Result: task.Status.AsResult(),
-			},
-		}), nil
-	}
-
-	task, err = actions_model.UpdateTaskByState(ctx, req.Msg.State)
+	task, err := actions_model.UpdateTaskByState(ctx, req.Msg.State)
 	if err != nil {
 		return nil, status.Errorf(codes.Internal, "update task: %v", err)
 	}
diff --git a/services/auth/reverseproxy.go b/services/auth/reverseproxy.go
index 91acff90cc6c..3574e660b84a 100644
--- a/services/auth/reverseproxy.go
+++ b/services/auth/reverseproxy.go
@@ -13,7 +13,6 @@ import (
 	"code.gitea.io/gitea/modules/setting"
 	"code.gitea.io/gitea/modules/util"
 	"code.gitea.io/gitea/modules/web/middleware"
-	"code.gitea.io/gitea/services/mailer"
 
 	gouuid "github.com/google/uuid"
 )
@@ -172,7 +171,5 @@ func (r *ReverseProxy) newUser(req *http.Request) *user_model.User {
 		return nil
 	}
 
-	mailer.SendRegisterNotifyMail(user)
-
 	return user
 }
diff --git a/services/auth/source/ldap/source_authenticate.go b/services/auth/source/ldap/source_authenticate.go
index fba8da793452..89e99b5e606c 100644
--- a/services/auth/source/ldap/source_authenticate.go
+++ b/services/auth/source/ldap/source_authenticate.go
@@ -14,7 +14,6 @@ import (
 	auth_module "code.gitea.io/gitea/modules/auth"
 	"code.gitea.io/gitea/modules/util"
 	source_service "code.gitea.io/gitea/services/auth/source"
-	"code.gitea.io/gitea/services/mailer"
 	user_service "code.gitea.io/gitea/services/user"
 )
 
@@ -100,8 +99,6 @@ func (source *Source) Authenticate(user *user_model.User, userName, password str
 			return user, err
 		}
 
-		mailer.SendRegisterNotifyMail(user)
-
 		if isAttributeSSHPublicKeySet && asymkey_model.AddPublicKeysBySource(user, source.authSource, sr.SSHPublicKey) {
 			if err := asymkey_model.RewriteAllPublicKeys(); err != nil {
 				return user, err
diff --git a/services/auth/source/pam/source_authenticate.go b/services/auth/source/pam/source_authenticate.go
index 48cd905a0a5e..e3a74e495cd6 100644
--- a/services/auth/source/pam/source_authenticate.go
+++ b/services/auth/source/pam/source_authenticate.go
@@ -12,7 +12,6 @@ import (
 	"code.gitea.io/gitea/modules/auth/pam"
 	"code.gitea.io/gitea/modules/setting"
 	"code.gitea.io/gitea/modules/util"
-	"code.gitea.io/gitea/services/mailer"
 
 	"github.com/google/uuid"
 )
@@ -67,8 +66,6 @@ func (source *Source) Authenticate(user *user_model.User, userName, password str
 		return user, err
 	}
 
-	mailer.SendRegisterNotifyMail(user)
-
 	return user, nil
 }
 
diff --git a/services/auth/source/smtp/source_authenticate.go b/services/auth/source/smtp/source_authenticate.go
index 36b351198acb..7d7d1aa8b6bc 100644
--- a/services/auth/source/smtp/source_authenticate.go
+++ b/services/auth/source/smtp/source_authenticate.go
@@ -12,7 +12,6 @@ import (
 	auth_model "code.gitea.io/gitea/models/auth"
 	user_model "code.gitea.io/gitea/models/user"
 	"code.gitea.io/gitea/modules/util"
-	"code.gitea.io/gitea/services/mailer"
 )
 
 // Authenticate queries if the provided login/password is authenticates against the SMTP server
@@ -82,8 +81,6 @@ func (source *Source) Authenticate(user *user_model.User, userName, password str
 		return user, err
 	}
 
-	mailer.SendRegisterNotifyMail(user)
-
 	return user, nil
 }
 
diff --git a/services/auth/sspi_windows.go b/services/auth/sspi_windows.go
index 176f4f574f56..d49497e19c95 100644
--- a/services/auth/sspi_windows.go
+++ b/services/auth/sspi_windows.go
@@ -19,7 +19,6 @@ import (
 	"code.gitea.io/gitea/modules/util"
 	"code.gitea.io/gitea/modules/web/middleware"
 	"code.gitea.io/gitea/services/auth/source/sspi"
-	"code.gitea.io/gitea/services/mailer"
 
 	gouuid "github.com/google/uuid"
 	"github.com/quasoft/websspi"
@@ -191,8 +190,6 @@ func (s *SSPI) newUser(username string, cfg *sspi.Source) (*user_model.User, err
 		return nil, err
 	}
 
-	mailer.SendRegisterNotifyMail(user)
-
 	return user, nil
 }
 
diff --git a/templates/org/home.tmpl b/templates/org/home.tmpl
index afd7d61ca9f8..27f0df0b385e 100644
--- a/templates/org/home.tmpl
+++ b/templates/org/home.tmpl
@@ -3,15 +3,15 @@
 	<div class="ui container gt-df">
 		{{avatar $.Context .Org 140 "org-avatar"}}
 		<div id="org-info">
-			<div class="ui header">
+			<div class="ui header gt-df gt-fw">
 				{{.Org.DisplayName}}
-				{{if .EnableFeed}}
-					<a href="{{.Org.HomeLink}}.rss"><i class="ui grey icon gt-ml-3" data-tooltip-content="{{.locale.Tr "rss_feed"}}">{{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}}
-					{{if .Org.Visibility.IsPrivate}}<div class="ui large basic horizontal label">{{.locale.Tr "org.settings.visibility.private_shortname"}}</div>{{end}}
+					{{if .Org.Visibility.IsLimited}}<span class="ui large basic horizontal label">{{.locale.Tr "org.settings.visibility.limited_shortname"}}</span>{{end}}
+					{{if .Org.Visibility.IsPrivate}}<span class="ui large basic horizontal label">{{.locale.Tr "org.settings.visibility.private_shortname"}}</span>{{end}}
 				</span>
+				{{if .EnableFeed}}
+					<a class="muted" href="{{.Org.HomeLink}}.rss" data-tooltip-content="{{.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 24}}</a>
+				{{end}}
 			</div>
 			{{if $.RenderedDescription}}<div class="render-content markup">{{$.RenderedDescription|Str2html}}</div>{{end}}
 			<div class="text grey meta">
diff --git a/templates/repo/diff/compare.tmpl b/templates/repo/diff/compare.tmpl
index cb6dca441e56..01a1cfd54e9b 100644
--- a/templates/repo/diff/compare.tmpl
+++ b/templates/repo/diff/compare.tmpl
@@ -237,8 +237,6 @@
 	{{if $showDiffBox}}
 	<div class="ui container">
 		{{template "repo/commits_table" .}}
-	</div>
-	<div class="ui container fluid padded">
 		{{template "repo/diff/box" .}}
 	</div>
 	{{end}}
diff --git a/templates/repo/header.tmpl b/templates/repo/header.tmpl
index b36d1d8f6ac3..b2fd0710afb0 100644
--- a/templates/repo/header.tmpl
+++ b/templates/repo/header.tmpl
@@ -13,9 +13,6 @@
 					<a href="{{.Owner.HomeLink}}">{{.Owner.Name}}</a>
 					<div class="gt-mx-2">/</div>
 					<a href="{{$.RepoLink}}">{{.Name}}</a>
-					{{if $.EnableFeed}}
-						<a href="{{$.RepoLink}}.rss"><i class="ui grey icon gt-ml-3" data-tooltip-content="{{$.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 18}}</i></a>
-					{{end}}
 					<div class="labels gt-df gt-ac gt-fw">
 						{{if .IsTemplate}}
 							{{if .IsPrivate}}
@@ -38,6 +35,9 @@
 							<span class="ui basic label">{{$.locale.Tr "repo.desc.archived"}}</span>
 						{{end}}
 					</div>
+					{{if $.EnableFeed}}
+						<a class="muted gt-ml-3" href="{{$.RepoLink}}.rss" data-tooltip-content="{{$.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 18}}</a>
+					{{end}}
 				</div>
 				{{if $.IsPullMirror}}
 					{{$address := MirrorRemoteAddress $.Context . $.Mirror.GetRemoteName false}}
diff --git a/templates/repo/issue/list.tmpl b/templates/repo/issue/list.tmpl
index a7311c249033..d739561d2790 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 a1fc24588733..82d2cac94348 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/repo/issue/search.tmpl b/templates/repo/issue/search.tmpl
index 3e7bf1d9ca1c..f24c2dbb7e0a 100644
--- a/templates/repo/issue/search.tmpl
+++ b/templates/repo/issue/search.tmpl
@@ -8,9 +8,9 @@
 		<input type="hidden" name="assignee" value="{{$.AssigneeID}}">
 		<input type="hidden" name="poster" value="{{$.PosterID}}">
 		<input name="q" value="{{.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}...">
-		<button id="hashtag-button" class="ui small icon button gt-hidden" data-tooltip-content="{{.locale.Tr "explore.go_to"}}">{{svg "octicon-hash"}}</button>
-		<button id="search-button" class="ui small icon button" aria-label="{{.locale.Tr "explore.search"}}">
-			{{svg "octicon-search"}}
-		</button>
+		{{if .PageIsIssueList}}
+			<button id="issue-list-quick-goto" class="ui small icon button gt-hidden" data-tooltip-content="{{.locale.Tr "explore.go_to"}}" data-repo-link="{{.RepoLink}}">{{svg "octicon-hash"}}</button>
+		{{end}}
+		<button class="ui small icon button" aria-label="{{.locale.Tr "explore.search"}}">{{svg "octicon-search"}}</button>
 	</div>
 </form>
diff --git a/templates/repo/issue/view_content/comments.tmpl b/templates/repo/issue/view_content/comments.tmpl
index 13e3b5305193..ab499f346afd 100644
--- a/templates/repo/issue/view_content/comments.tmpl
+++ b/templates/repo/issue/view_content/comments.tmpl
@@ -372,7 +372,10 @@
 				<div class="timeline-item event">
 					{{if .OriginalAuthor}}
 					{{else}}
-					<a class="timeline-avatar"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
+					{{/* Some timeline avatars need a offset to correctly allign with their speech
+							bubble. The condition depends on review type and for positive reviews whether
+							there is a comment element or not */}}
+					<a class="timeline-avatar{{if or (and (eq .Review.Type 1) (or .Content .Attachments)) (eq .Review.Type 2) (eq .Review.Type 3)}} timeline-avatar-offset{{end}}"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}>
 						{{avatar $.Context .Poster}}
 					</a>
 					{{end}}
@@ -408,6 +411,11 @@
 					<div class="content comment-container">
 						<div class="ui top attached header comment-header gt-df gt-ac gt-sb">
 							<div class="comment-header-left gt-df gt-ac">
+								{{if gt .Poster.ID 0}}
+									<a class="inline-timeline-avatar" href="{{.Poster.HomeLink}}">
+										{{avatar $.Context .Poster}}
+									</a>
+								{{end}}
 								<span class="text grey muted-links">
 									{{if .OriginalAuthor}}
 										<span class="text black gt-bold">
@@ -763,6 +771,7 @@
 						<img src="{{.Poster.AvatarLink $.Context}}">
 					</a>
 					<span class="badge grey">{{svg "octicon-x" 16}}</span>
+					{{template "shared/user/avatarlink" dict "Context" $.Context "user" .Poster}}
 					<span class="text grey muted-links">
 						{{template "shared/user/authorlink" .Poster}}
 						{{$reviewerName := ""}}
@@ -777,7 +786,12 @@
 				{{if .Content}}
 					<div class="timeline-item comment">
 						<div class="content">
-							<div class="ui top attached header arrow-top">
+							<div class="ui top attached header comment-header-left gt-df gt-ac arrow-top">
+								{{if gt .Poster.ID 0}}
+									<a class="inline-timeline-avatar" href="{{.Poster.HomeLink}}">
+										{{avatar $.Context .Poster}}
+									</a>
+								{{end}}
 								<span class="text grey muted-links">
 									{{$.locale.Tr "action.review_dismissed_reason"}}
 								</span>
diff --git a/templates/repo/issue/view_content/pull.tmpl b/templates/repo/issue/view_content/pull.tmpl
index 29d8d9d47ce9..907ee1985755 100644
--- a/templates/repo/issue/view_content/pull.tmpl
+++ b/templates/repo/issue/view_content/pull.tmpl
@@ -1,5 +1,5 @@
 {{if or .PullReviewers .OriginalReviews}}
-	<div class="comment box">
+	<div class="comment box timeline-item gt-pt-3 gt-pb-0">
 		<div class="content">
 			<div class="ui segment">
 				<h4>{{$.locale.Tr "repo.issues.review.reviewers"}}</h4>
@@ -8,9 +8,12 @@
 					<div class="ui divider"></div>
 					<div class="review-item">
 						<div class="review-item-left">
+							<span class="gt-mr-3 text {{.Review.HTMLTypeColorName}}">
+								{{svg (printf "octicon-%s" .Review.Type.Icon)}}
+							</span>
 							{{if .User}}
 								<a href="{{.User.HomeLink}}">
-									{{avatar $.Context .User}}
+									{{avatar $.Context .User 20}}
 								</a>
 							{{end}}
 							<span class="gt-ml-2">
@@ -34,13 +37,13 @@
 						</div>
 						<div class="review-item-right">
 							{{if .Review.Stale}}
-								<span class="ui type-icon text grey" data-tooltip-content="{{$.locale.Tr "repo.issues.is_stale"}}">
+								<span class="ui text grey" data-tooltip-content="{{$.locale.Tr "repo.issues.is_stale"}}">
 									{{svg "octicon-hourglass" 16 "icon"}}
 								</span>
 							{{end}}
 							{{if (and $.Permission.IsAdmin (or (eq .Review.Type 1) (eq .Review.Type 3)) (not $.Issue.IsClosed))}}
-								<a href="#" class="ui muted icon dismiss-review-btn" data-review-id="dismiss-review-{{.Review.ID}}" data-tooltip-content="{{$.locale.Tr "repo.issues.dismiss_review"}}">
-									{{svg "octicon-x" 16}}
+								<a href="#" class="ui muted icon gt-df gt-ac dismiss-review-btn" data-review-id="dismiss-review-{{.Review.ID}}" data-tooltip-content="{{$.locale.Tr "repo.issues.dismiss_review"}}">
+									{{svg "octicon-x" 20}}
 								</a>
 								<div class="ui small modal" id="dismiss-review-modal">
 									<div class="header">
@@ -65,19 +68,9 @@
 									</div>
 								</div>
 							{{end}}
-							<span class="type-icon text {{if eq .Review.Type 1}}green
-								{{- else if eq .Review.Type 2}}grey
-								{{- else if eq .Review.Type 3}}red
-								{{- else if eq .Review.Type 4}}yellow
-								{{else}}grey{{end}}">
-
-								{{if .CanChange}}
-									<a href="#" class="ui icon re-request-review {{if .Checked}}checked{{end}}" data-issue-id="{{$.Issue.ID}}" data-tooltip-content="{{if .Checked}} {{$.locale.Tr "repo.issues.remove_request_review"}} {{else}} {{$.locale.Tr "repo.issues.re_request_review"}} {{end}}"  data-id="{{.ItemID}}" data-update-url="{{$.RepoLink}}/issues/request_review">
-										{{if .Checked}} {{svg "octicon-trash"}} {{else}} {{svg "octicon-sync"}} {{end}}
-									</a>
-								{{end}}
-								{{svg (printf "octicon-%s" .Review.Type.Icon)}}
-							</span>
+							{{if .CanChange}}
+								<a href="#" class="ui icon muted gt-df gt-ac re-request-review{{if .Checked}} checked{{end}}" data-issue-id="{{$.Issue.ID}}" data-tooltip-content="{{if .Checked}}{{$.locale.Tr "repo.issues.remove_request_review"}}{{else}}{{$.locale.Tr "repo.issues.re_request_review"}}{{end}}" data-id="{{.ItemID}}" data-update-url="{{$.RepoLink}}/issues/request_review">{{if .Checked}}{{svg "octicon-trash"}}{{else}}{{svg "octicon-sync"}}{{end}}</a>
+							{{end}}
 						</div>
 					</div>
 				{{end}}
@@ -86,22 +79,16 @@
 					<div class="ui divider"></div>
 					<div class="review-item">
 						<div class="review-item-left">
+							<span class="gt-mr-3 text {{.Review.HTMLTypeColorName}}">
+								{{svg (printf "octicon-%s" .Type.Icon)}}
+							</span>
 							<a href="{{$.Repository.OriginalURL}}" data-tooltip-content="{{$.locale.Tr "repo.migrated_from_fake" ($.Repository.GetOriginalURLHostname|Escape) | Safe}}">
-								<span class="text black ">
+								<span class="text black">
 									{{svg (MigrationIcon $.Repository.GetOriginalURLHostname)}}
 									{{.OriginalAuthor}}
 								</span>
 							</a>
 						</div>
-						<div class="review-item-right">
-							<span class="type-icon text {{if eq .Type 1}}green
-								{{- else if eq .Type 2}}grey
-								{{- else if eq .Type 3}}red
-								{{- else if eq .Type 4}}yellow
-								{{else}}grey{{end}}">
-								{{svg (printf "octicon-%s" .Type.Icon)}}
-							</span>
-						</div>
 					</div>
 				{{end}}
 			</div>
@@ -204,7 +191,7 @@
 				</div>
 			{{else if .Issue.PullRequest.IsAncestor}}
 				<div class="item">
-					<i class="icon icon-octicon">{{svg "octicon-alert" 16}}</i>
+					<i class="icon icon-octicon">{{svg "octicon-alert"}}</i>
 					{{$.locale.Tr "repo.pulls.is_ancestor"}}
 				</div>
 			{{else if or .Issue.PullRequest.CanAutoMerge .Issue.PullRequest.IsEmpty}}
@@ -230,7 +217,7 @@
 					</div>
 				{{else if .IsBlockedByChangedProtectedFiles}}
 					<div class="item">
-						<i class="icon icon-octicon">{{svg "octicon-x" 16}}</i>
+						<i class="icon icon-octicon">{{svg "octicon-x"}}</i>
 						{{$.locale.TrN $.ChangedProtectedFilesNum "repo.pulls.blocked_by_changed_protected_files_1" "repo.pulls.blocked_by_changed_protected_files_n" | Safe}}
 						<ul>
 							{{range .ChangedProtectedFiles}}
@@ -294,7 +281,7 @@
 					<div class="ui divider"></div>
 
 					<div class="item">
-						<i class="icon icon-octicon">{{svg "octicon-alert" 16}}</i>
+						<i class="icon icon-octicon">{{svg "octicon-alert"}}</i>
 						{{$.locale.Tr "repo.pulls.is_empty"}}
 					</div>
 				{{end}}
@@ -430,7 +417,7 @@
 					</div>
 				{{else if .IsBlockedByChangedProtectedFiles}}
 					<div class="item text red">
-						<i class="icon icon-octicon">{{svg "octicon-x" 16}}</i>
+						<i class="icon icon-octicon">{{svg "octicon-x"}}</i>
 						{{$.locale.TrN $.ChangedProtectedFilesNum "repo.pulls.blocked_by_changed_protected_files_1" "repo.pulls.blocked_by_changed_protected_files_n" | Safe}}
 						<ul>
 							{{range .ChangedProtectedFiles}}
diff --git a/templates/repo/issue/view_content/sidebar.tmpl b/templates/repo/issue/view_content/sidebar.tmpl
index ebde25e4a6f8..8686045aaf11 100644
--- a/templates/repo/issue/view_content/sidebar.tmpl
+++ b/templates/repo/issue/view_content/sidebar.tmpl
@@ -54,37 +54,27 @@
 					{{range .PullReviewers}}
 						<div class="item gt-mb-2">
 							{{if .User}}
-								<a class="muted sidebar-item-link" href="{{.User.HomeLink}}">
-									{{avatar $.Context .User 28 "gt-mr-3"}}
-									{{.User.GetDisplayName}}
-								</a>
+								<a class="muted sidebar-item-link" href="{{.User.HomeLink}}">{{avatar $.Context .User 28 "gt-mr-3"}}{{.User.GetDisplayName}}</a>
 							{{else if .Team}}
 								<span class="text">{{svg "octicon-people" 16 "teamavatar"}}{{$.Issue.Repo.OwnerName}}/{{.Team.Name}}</span>
 							{{end}}
-							<span class="ui right type-icon text {{if eq .Review.Type 1}}green
-								{{- else if eq .Review.Type 2}}grey
-								{{- else if eq .Review.Type 3}}red
-								{{- else if eq .Review.Type 4}}yellow
-								{{- else}}grey{{end}} right ">
-
+							<span class="ui right gt-df gt-ac gt-gap-3">
 								{{if .CanChange}}
-									<a href="#" class="ui icon re-request-review {{if .Checked}}checked{{end}}" data-tooltip-content="{{if .Checked}} {{$.locale.Tr "repo.issues.remove_request_review"}} {{else}} {{$.locale.Tr "repo.issues.re_request_review"}} {{end}}" data-issue-id="{{$.Issue.ID}}"  data-id="{{.ItemID}}" data-update-url="{{$.RepoLink}}/issues/request_review">
-										{{if .Checked}} {{svg "octicon-trash"}} {{else}} {{svg "octicon-sync"}} {{end}}
-									</a>
+									<a href="#" class="ui muted icon re-request-review{{if .Checked}} checked{{end}}" data-tooltip-content="{{if .Checked}}{{$.locale.Tr "repo.issues.remove_request_review"}}{{else}}{{$.locale.Tr "repo.issues.re_request_review"}}{{end}}" data-issue-id="{{$.Issue.ID}}" data-id="{{.ItemID}}" data-update-url="{{$.RepoLink}}/issues/request_review">{{if .Checked}}{{svg "octicon-trash"}}{{else}}{{svg "octicon-sync"}}{{end}}</a>
 								{{end}}
-								{{svg (printf "octicon-%s" .Review.Type.Icon)}}
+								{{svg (printf "octicon-%s" .Review.Type.Icon) 16 (printf "text %s" (.Review.HTMLTypeColorName))}}
 							</span>
 						</div>
 					{{end}}
 					{{range .OriginalReviews}}
-						<div class="item" style="margin-bottom: 10px;">
+						<div class="item gt-mb-3">
 							<a href="{{$.Repository.OriginalURL}}" data-tooltip-content="{{$.locale.Tr "repo.migrated_from_fake" ($.Repository.GetOriginalURLHostname|Escape) | Safe}}">
 								<span class="text black">
 									{{svg (MigrationIcon $.Repository.GetOriginalURLHostname)}}
 									{{.OriginalAuthor}}
 								</span>
 							</a>
-							<span class="ui right type-icon text {{if eq .Type 1}}green
+							<span class="ui right text {{if eq .Type 1}}green
 								{{- else if eq .Type 2}}grey
 								{{- else if eq .Type 3}}red
 								{{- else if eq .Type 4}}yellow
diff --git a/templates/repo/release/list.tmpl b/templates/repo/release/list.tmpl
index 2dcb012412ff..fb8534f10280 100644
--- a/templates/repo/release/list.tmpl
+++ b/templates/repo/release/list.tmpl
@@ -3,14 +3,7 @@
 	{{template "repo/header" .}}
 	<div class="ui container">
 		{{template "base/alert" .}}
-		{{template "repo/sub_menu_release_tag" .}}
-
-		{{if .CanCreateRelease}}
-			<a class="ui right small green button" href="{{$.RepoLink}}/releases/new">
-				{{.locale.Tr "repo.release.new_release"}}
-			</a>
-		{{end}}
-
+		{{template "repo/release_tag_header" .}}
 		<ul id="release-list">
 			{{range $idx, $release := .Releases}}
 				<li class="ui grid">
diff --git a/templates/repo/release_tag_header.tmpl b/templates/repo/release_tag_header.tmpl
new file mode 100644
index 000000000000..6d022eebccac
--- /dev/null
+++ b/templates/repo/release_tag_header.tmpl
@@ -0,0 +1,27 @@
+{{$canReadReleases := $.Permission.CanRead $.UnitTypeReleases}}
+{{$canReadCode := $.Permission.CanRead $.UnitTypeCode}}
+
+{{if $canReadReleases}}
+	<div class="gt-df">
+		<div class="gt-f1">
+			<h2 class="ui compact small menu header small-menu-items">
+				<a class="{{if .PageIsReleaseList}}active {{end}}item" href="{{.RepoLink}}/releases">{{.locale.Tr "repo.release.releases"}}</a>
+				{{if $canReadCode}}
+					<a class="{{if .PageIsTagList}}active {{end}}item" href="{{.RepoLink}}/tags">{{.locale.Tr "repo.release.tags"}}</a>
+				{{end}}
+			</h2>
+			{{if .EnableFeed}}
+				<a class="muted gt-mx-3" href="{{.RepoLink}}/{{if .PageIsTagList}}tags{{else}}releases{{end}}.rss" data-tooltip-content="{{.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 18}}</a>
+			{{end}}
+		</div>
+		{{if and (not .PageIsTagList) .CanCreateRelease}}
+			<a class="ui right small green button" href="{{$.RepoLink}}/releases/new">
+				{{.locale.Tr "repo.release.new_release"}}
+			</a>
+		{{end}}
+	</div>
+	<div class="ui divider"></div>
+{{else if $canReadCode}}
+	{{/* if the "repo.releases" unit is disabled, only show the "commits / branches / tags" sub menu */}}
+	{{template "repo/sub_menu" .}}
+{{end}}
diff --git a/templates/repo/sub_menu_release_tag.tmpl b/templates/repo/sub_menu_release_tag.tmpl
deleted file mode 100644
index c700893ee670..000000000000
--- a/templates/repo/sub_menu_release_tag.tmpl
+++ /dev/null
@@ -1,17 +0,0 @@
-{{$canReadReleases := $.Permission.CanRead $.UnitTypeReleases}}
-{{$canReadCode := $.Permission.CanRead $.UnitTypeCode}}
-
-{{if $canReadReleases}}
-	<h2 class="ui compact small menu header small-menu-items">
-		<a class="{{if .PageIsReleaseList}}active {{end}}item" href="{{.RepoLink}}/releases">{{.locale.Tr "repo.release.releases"}}</a>
-		{{if $canReadCode}}
-			<a class="{{if .PageIsTagList}}active {{end}}item" href="{{.RepoLink}}/tags">{{.locale.Tr "repo.release.tags"}}</a>
-		{{end}}
-	</h2>
-
-	{{if .EnableFeed}}
-		<a href="{{.RepoLink}}/{{if .PageIsTagList}}tags{{else}}releases{{end}}.rss"><i class="ui grey icon gt-ml-3" data-tooltip-content="{{.locale.Tr "rss_feed"}}">{{svg "octicon-rss" 18}}</i></a>
-	{{end}}
-{{else if $canReadCode}}
-	{{template "repo/sub_menu" .}}
-{{end}}
diff --git a/templates/repo/tag/list.tmpl b/templates/repo/tag/list.tmpl
index 6f9e1e8d7aed..8651bfe2ec94 100644
--- a/templates/repo/tag/list.tmpl
+++ b/templates/repo/tag/list.tmpl
@@ -1,21 +1,15 @@
 {{template "base/head" .}}
-
 <div role="main" aria-label="{{.Title}}" class="page-content repository tags">
 	{{template "repo/header" .}}
 	<div class="ui container">
 		{{template "base/alert" .}}
-		{{template "repo/sub_menu_release_tag" .}}
-
-		<div class="ui divider"></div>
-
+		{{template "repo/release_tag_header" .}}
 		<h4 class="ui top attached header">
 			<div class="five wide column gt-df gt-ac">
 				{{svg "octicon-tag" 16 "gt-mr-2"}}{{.locale.Tr "repo.release.tags"}}
 			</div>
 		</h4>
-
 		{{$canReadReleases := $.Permission.CanRead $.UnitTypeReleases}}
-
 		<div class="ui attached table segment">
 			<table class="ui very basic striped fixed table single line" id="tags-table">
 				<tbody class="tag-list">
diff --git a/templates/user/dashboard/issues.tmpl b/templates/user/dashboard/issues.tmpl
index bf13cf993b6a..a0b02887b018 100644
--- a/templates/user/dashboard/issues.tmpl
+++ b/templates/user/dashboard/issues.tmpl
@@ -78,8 +78,8 @@
 							<input type="hidden" name="sort" value="{{$.SortType}}">
 							<input type="hidden" name="state" value="{{$.State}}">
 							<input name="q" value="{{$.Keyword}}" placeholder="{{.locale.Tr "explore.search"}}...">
-							<button id="hashtag-button" class="ui small icon button gt-hidden" data-tooltip-content="{{.locale.Tr "explore.go_to"}}">{{svg "octicon-hash"}}</button>
-							<button id="search-button" class="ui small icon button" aria-label="{{.locale.Tr "explore.search"}}">{{svg "octicon-search"}}</button>
+							<button id="issue-list-quick-goto" class="ui small icon button gt-hidden" data-tooltip-content="{{.locale.Tr "explore.go_to"}}">{{svg "octicon-hash"}}</button>
+							<button class="ui small icon button" aria-label="{{.locale.Tr "explore.search"}}">{{svg "octicon-search"}}</button>
 						</div>
 					</form>
 					<!-- Sort -->
diff --git a/templates/user/dashboard/navbar.tmpl b/templates/user/dashboard/navbar.tmpl
index 7703bbfb98ce..20b66b2ec379 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 1ea34fe2a68d..b8efd2433e8c 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 591c09377cd0..aa86d140fe4b 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -364,6 +364,12 @@ a.label,
   text-decoration: none !important;
 }
 
+/* for most cases, we only use our svg icon as inline icon, so we need to make them inline-block and vertical-align: middle */
+svg.svg {
+  display: inline-block;
+  vertical-align: middle;
+}
+
 .ui.red.labels .label,
 .ui.ui.ui.red.label,
 .ui.red.button,
@@ -1148,6 +1154,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 +2244,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 ceb20db043cb..22e18f79269a 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/organization.css b/web_src/css/organization.css
index 25d4940fe53e..1b10ba157e3d 100644
--- a/web_src/css/organization.css
+++ b/web_src/css/organization.css
@@ -112,11 +112,6 @@
   margin-bottom: 0;
 }
 
-.organization.profile #org-info .ui.header .org-visibility .label {
-  margin-left: 5px;
-  margin-top: 2px;
-}
-
 .organization.profile #org-info .desc {
   font-size: 16px;
   margin-bottom: 10px;
diff --git a/web_src/css/repository.css b/web_src/css/repository.css
index 6709b127db17..0d81d6511068 100644
--- a/web_src/css/repository.css
+++ b/web_src/css/repository.css
@@ -691,49 +691,41 @@
   margin-right: 5px;
 }
 
-.repository.view.issue .pull .merge.box .timeline-avatar {
+.repository.view.issue .merge.box .timeline-avatar {
   margin-top: 3px;
   margin-left: 4px;
 }
 
-.repository.view.issue .pull .merge.box .branch-update.grid .row {
+.repository.view.issue .merge.box .branch-update.grid .row {
   padding-bottom: 1rem;
 }
 
-.repository.view.issue .pull .merge.box .branch-update.grid .row .icon {
+.repository.view.issue .merge.box .branch-update.grid .row .icon {
   margin-top: 1.1rem;
 }
 
-.repository.view.issue .pull .review-item {
+.repository.view.issue .review-item {
   display: flex;
   justify-content: space-between;
   align-items: center;
 }
 
-.repository.view.issue .pull .review-item .review-item-left,
-.repository.view.issue .pull .review-item .review-item-right {
+.review-item-left,
+.review-item-right {
   display: flex;
   align-items: center;
 }
 
-.repository.view.issue .pull .review-item .text {
-  margin: 0.3em 0 0.5em 0.5em;
-}
-
-.repository.view.issue .pull .review-item .type-icon {
-  align-self: flex-start;
-  margin-right: 1em;
-}
-
-.repository.view.issue .pull .review-item .type-icon i {
-  line-height: 1.8em;
+.review-item-right {
+  gap: 8px;
+  margin-left: 4px;
 }
 
-.repository.view.issue .pull .review-item .divider {
+.repository.view.issue .review-item .divider {
   margin: 0.5rem 0;
 }
 
-.repository.view.issue .pull .review-item .review-content {
+.repository.view.issue .review-item .review-content {
   padding: 1em 0 1em 3.8em;
 }
 
@@ -782,6 +774,10 @@
   padding-bottom: 8px;
 }
 
+.repository.view.issue .comment-list .timeline-avatar-offset {
+  margin-top: 48px;
+}
+
 .repository.view.issue .comment-list .timeline-item {
   margin-left: 16px;
   position: relative;
@@ -1098,8 +1094,8 @@
   margin-left: 3em;
 }
 
-.repository.view.issue .comment-list .code-comment img.avatar,
-.repository.view.issue .comment-list .comment img.avatar {
+.repository.view.issue .comment-code-cloud .comment-list .code-comment img.avatar,
+.repository.view.issue .comment-code-cloud .comment-list .comment img.avatar {
   width: 28px;
   height: 28px;
 }
@@ -3261,6 +3257,8 @@ td.blob-excerpt {
   .repository.view.issue .comment-list .timeline .inline-timeline-avatar {
     display: flex;
     margin-bottom: auto;
+    margin-left: 6px;
+    margin-right: 2px;
   }
   .repository.view.issue .comment-list .timeline .inline-timeline-avatar img.avatar {
     height: 24px;
diff --git a/web_src/css/themes/theme-arc-green.css b/web_src/css/themes/theme-arc-green.css
index 42cde8180296..84007d2e2dfe 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;
diff --git a/web_src/js/components/ContextPopup.vue b/web_src/js/components/ContextPopup.vue
index 98f9db51f91d..bef9b7a6f386 100644
--- a/web_src/js/components/ContextPopup.vue
+++ b/web_src/js/components/ContextPopup.vue
@@ -26,7 +26,7 @@
 <script>
 import $ from 'jquery';
 import {SvgIcon} from '../svg.js';
-import {useLightTextOnBackground} from '../utils.js';
+import {useLightTextOnBackground, hexToRGBColor} from '../utils/color.js';
 
 const {appSubUrl, i18n} = window.config;
 
@@ -77,7 +77,8 @@ export default {
     labels() {
       return this.issue.labels.map((label) => {
         let textColor;
-        if (useLightTextOnBackground(label.color)) {
+        const [r, g, b] = hexToRGBColor(label.color);
+        if (useLightTextOnBackground(r, g, b)) {
           textColor = '#eeeeee';
         } else {
           textColor = '#111111';
diff --git a/web_src/js/components/RepoActionView.vue b/web_src/js/components/RepoActionView.vue
index 91da5385bf68..d6a38737511c 100644
--- a/web_src/js/components/RepoActionView.vue
+++ b/web_src/js/components/RepoActionView.vue
@@ -1,19 +1,19 @@
 <template>
   <div class="action-view-container">
     <div class="action-view-header">
-      <div class="action-info-summary gt-ac">
+      <div class="action-info-summary">
         <ActionRunStatus :locale-status="locale.status[run.status]" :status="run.status" :size="20"/>
         <div class="action-title">
           {{ run.title }}
         </div>
-        <button :data-tooltip-content="locale.approve" class="action-control-button text green" @click="approveRun()" v-if="run.canApprove">
-          <SvgIcon name="octicon-play" :size="20"/>
+        <button class="ui basic small compact button primary" @click="approveRun()" v-if="run.canApprove">
+          <SvgIcon class="gt-mr-2" name="octicon-play" :size="20"/> {{ locale.approve }}
         </button>
-        <button :data-tooltip-content="locale.cancel" class="action-control-button text red" @click="cancelRun()" v-else-if="run.canCancel">
-          <SvgIcon name="octicon-x-circle-fill" :size="20"/>
+        <button class="ui basic small compact button red" @click="cancelRun()" v-else-if="run.canCancel">
+          <SvgIcon class="gt-mr-2" name="octicon-x-circle-fill" :size="20"/> {{ locale.cancel }}
         </button>
-        <button :data-tooltip-content="locale.rerun" class="action-control-button text green" @click="rerun()" v-else-if="run.canRerun">
-          <SvgIcon name="octicon-sync" :size="20"/>
+        <button class="ui basic small compact button secondary" @click="rerun()" v-else-if="run.canRerun">
+          <SvgIcon class="gt-mr-2" name="octicon-sync" :size="20"/> {{ locale.rerun }}
         </button>
       </div>
       <div class="action-commit-summary">
@@ -36,7 +36,7 @@
                 <span class="ui text gt-mx-3">{{ job.name }}</span>
               </a>
               <span class="step-summary-duration">{{ job.duration }}</span>
-              <button class="job-brief-rerun" @click="rerunJob(index)" v-if="job.canRerun">
+              <button :data-tooltip-content="locale.rerun" class="job-brief-rerun" @click="rerunJob(index)" v-if="job.canRerun">
                 <SvgIcon name="octicon-sync" class="ui text black"/>
               </button>
             </div>
@@ -391,27 +391,17 @@ export function ansiLogToHTML(line) {
   margin: 0 20px 20px 20px;
 }
 
-.action-view-header .action-control-button {
-  border: none;
-  background-color: transparent;
-  outline: none;
-  cursor: pointer;
-  transition: transform 0.2s;
-  display: flex;
-}
-
-.action-view-header .action-control-button:hover {
-  transform: scale(130%);
-}
-
 .action-info-summary {
   font-size: 150%;
   height: 20px;
   display: flex;
+  align-items: center;
+  margin-top: 1rem;
 }
 
 .action-info-summary .action-title {
   padding: 0 5px;
+  flex: 1;
 }
 
 .action-commit-summary {
diff --git a/web_src/js/components/RepoBranchTagSelector.vue b/web_src/js/components/RepoBranchTagSelector.vue
index 38a375aa85da..f02918da9aa7 100644
--- a/web_src/js/components/RepoBranchTagSelector.vue
+++ b/web_src/js/components/RepoBranchTagSelector.vue
@@ -39,7 +39,7 @@
       <div class="scrolling menu" ref="scrollContainer">
         <div v-for="(item, index) in filteredItems" :key="item.name" class="item" :class="{selected: item.selected, active: active === index}" @click="selectItem(item)" :ref="'listItem' + index">
           {{ item.name }}
-          <a v-if="enableFeed && mode === 'branches'" role="button" class="ui compact muted right" :href="rssURLPrefix + item.url" target="_blank" @click.stop>
+          <a v-if="enableFeed && mode === 'branches'" role="button" class="ui compact right muted" :href="rssURLPrefix + item.url" target="_blank" @click.stop>
             <svg-icon name="octicon-rss" :size="14"/>
           </a>
         </div>
diff --git a/web_src/js/features/codeeditor.js b/web_src/js/features/codeeditor.js
index 3a925e08c1e0..76eeaa9898d4 100644
--- a/web_src/js/features/codeeditor.js
+++ b/web_src/js/features/codeeditor.js
@@ -1,5 +1,5 @@
 import {basename, extname, isObject, isDarkTheme} from '../utils.js';
-import {debounce} from 'throttle-debounce';
+import {onInputDebounce} from '../utils/dom.js';
 
 const languagesByFilename = {};
 const languagesByExt = {};
@@ -164,7 +164,7 @@ export async function createCodeEditor(textarea, filenameInput) {
     ...getEditorConfigOptions(editorConfig),
   });
 
-  filenameInput.addEventListener('input', debounce(500, () => {
+  filenameInput.addEventListener('input', onInputDebounce(() => {
     const filename = filenameInput.value;
     const previewable = previewableExts.has(extname(filename));
     togglePreviewDisplay(previewable);
diff --git a/web_src/js/features/common-issue-list.js b/web_src/js/features/common-issue-list.js
new file mode 100644
index 000000000000..ecada11988cf
--- /dev/null
+++ b/web_src/js/features/common-issue-list.js
@@ -0,0 +1,70 @@
+import $ from 'jquery';
+import {isElemHidden, onInputDebounce, toggleElem} from '../utils/dom.js';
+const {appSubUrl} = window.config;
+
+const reIssueIndex = /^(\d+)$/; // eg: "123"
+const reIssueSharpIndex = /^#(\d+)$/; // eg: "#123"
+const reIssueOwnerRepoIndex = /^([-.\w]+)\/([-.\w]+)#(\d+)$/;  // eg: "{owner}/{repo}#{index}"
+
+// if the searchText can be parsed to an "issue goto link", return the link, otherwise return empty string
+export function parseIssueListQuickGotoLink(repoLink, searchText) {
+  searchText = searchText.trim();
+  let targetUrl = '';
+  if (repoLink) {
+    // try to parse it in current repo
+    if (reIssueIndex.test(searchText)) {
+      targetUrl = `${repoLink}/issues/${searchText}`;
+    } else if (reIssueSharpIndex.test(searchText)) {
+      targetUrl = `${repoLink}/issues/${searchText.substr(1)}`;
+    }
+  } else {
+    // try to parse it for a global search (eg: "owner/repo#123")
+    const matchIssueOwnerRepoIndex = searchText.match(reIssueOwnerRepoIndex);
+    if (matchIssueOwnerRepoIndex) {
+      const [_, owner, repo, index] = matchIssueOwnerRepoIndex;
+      targetUrl = `${appSubUrl}/${owner}/${repo}/issues/${index}`;
+    }
+  }
+  return targetUrl;
+}
+
+export function initCommonIssueListQuickGoto() {
+  const $goto = $('#issue-list-quick-goto');
+  if (!$goto.length) return;
+
+  const $form = $goto.closest('form');
+  const $input = $form.find('input[name=q]');
+  const repoLink = $goto.attr('data-repo-link');
+
+  $form.on('submit', (e) => {
+    // if there is no goto button, or the form is submitted by non-quick-goto elements, submit the form directly
+    let doQuickGoto = !isElemHidden($goto);
+    const submitter = e.originalEvent.submitter;
+    if (submitter !== $form[0] && submitter !== $input[0] && submitter !== $goto[0]) doQuickGoto = false;
+    if (!doQuickGoto) return;
+
+    // if there is a goto button, use its link
+    e.preventDefault();
+    window.location.href = $goto.attr('data-issue-goto-link');
+  });
+
+  const onInput = async () => {
+    const searchText = $input.val();
+
+    // try to check whether the parsed goto link is valid
+    let targetUrl = parseIssueListQuickGotoLink(repoLink, searchText);
+    if (targetUrl) {
+      const res = await fetch(`${targetUrl}/info`);
+      if (res.status !== 200) targetUrl = '';
+    }
+
+    // if the input value has changed, then ignore the result
+    if ($input.val() !== searchText) return;
+
+    toggleElem($goto, Boolean(targetUrl));
+    $goto.attr('data-issue-goto-link', targetUrl);
+  };
+
+  $input.on('input', onInputDebounce(onInput));
+  onInput();
+}
diff --git a/web_src/js/features/common-issue-list.test.js b/web_src/js/features/common-issue-list.test.js
new file mode 100644
index 000000000000..271acc718aab
--- /dev/null
+++ b/web_src/js/features/common-issue-list.test.js
@@ -0,0 +1,17 @@
+import {test, expect} from 'vitest';
+import {parseIssueListQuickGotoLink} from './common-issue-list.js';
+
+test('parseIssueListQuickGotoLink', () => {
+  expect(parseIssueListQuickGotoLink('/link', '')).toEqual('');
+  expect(parseIssueListQuickGotoLink('/link', 'abc')).toEqual('');
+  expect(parseIssueListQuickGotoLink('/link', '123')).toEqual('/link/issues/123');
+  expect(parseIssueListQuickGotoLink('/link', '#123')).toEqual('/link/issues/123');
+  expect(parseIssueListQuickGotoLink('/link', 'owner/repo#123')).toEqual('');
+
+  expect(parseIssueListQuickGotoLink('', '')).toEqual('');
+  expect(parseIssueListQuickGotoLink('', 'abc')).toEqual('');
+  expect(parseIssueListQuickGotoLink('', '123')).toEqual('');
+  expect(parseIssueListQuickGotoLink('', '#123')).toEqual('');
+  expect(parseIssueListQuickGotoLink('', 'owner/repo#')).toEqual('');
+  expect(parseIssueListQuickGotoLink('', 'owner/repo#123')).toEqual('/owner/repo/issues/123');
+});
diff --git a/web_src/js/features/repo-issue.js b/web_src/js/features/repo-issue.js
index 8ecc7aa4ca2a..d2942cd93331 100644
--- a/web_src/js/features/repo-issue.js
+++ b/web_src/js/features/repo-issue.js
@@ -4,7 +4,6 @@ import {showTemporaryTooltip, createTippy} from '../modules/tippy.js';
 import {hideElem, showElem, toggleElem} from '../utils/dom.js';
 import {setFileFolding} from './file-fold.js';
 import {getComboMarkdownEditor, initComboMarkdownEditor} from './comp/ComboMarkdownEditor.js';
-import {parseIssueHref} from '../utils.js';
 
 const {appSubUrl, csrfToken} = window.config;
 
@@ -638,34 +637,6 @@ export function initRepoIssueBranchSelect() {
   $('#branch-select > .item').on('click', changeBranchSelect);
 }
 
-export function initRepoIssueGotoID() {
-  const issueidre = /^(?:\w+\/\w+#\d+|#\d+|\d+)$/;
-  const isGlobalIssuesArea = $('.repo.name.item').length > 0; // for global issues area or repository issues area
-  $('form.list-header-search').on('submit', (e) => {
-    const qval = e.target.q.value;
-    const aElm = document.activeElement;
-    if (!$('#hashtag-button').length || aElm.id === 'search-button' || (aElm.name === 'q' && !qval.includes('#')) || (isGlobalIssuesArea && !qval.includes('/')) || !issueidre.test(qval)) return;
-    const pathname = window.location.pathname;
-    let gotoUrl = qval.includes('/') ? `${qval.replace('#', '/issues/')}` : `${pathname}/${qval.replace('#', '')}`;
-    if (appSubUrl.length) {
-      gotoUrl = qval.includes('/') ? `/${appSubUrl}/${qval.replace('#', '/issues/')}` : `/${appSubUrl}/${pathname}/${qval.replace('#', '')}`;
-    }
-    const {owner, repo, type, index} = parseIssueHref(gotoUrl);
-    if (owner && repo && type && index) {
-      e.preventDefault();
-      window.location.href = gotoUrl;
-    }
-  });
-  $('form.list-header-search input[name=q]').on('input', (e) => {
-    const qval = e.target.value;
-    if (isGlobalIssuesArea && qval.includes('/') && issueidre.test(qval) || !isGlobalIssuesArea && issueidre.test(qval)) {
-      showElem($('#hashtag-button'));
-    } else {
-      hideElem($('#hashtag-button'));
-    }
-  });
-}
-
 export function initSingleCommentEditor($commentForm) {
   // pages:
   // * normal new issue/pr page, no status-button
diff --git a/web_src/js/features/repo-projects.js b/web_src/js/features/repo-projects.js
index 11f5518283a9..abbe23458e14 100644
--- a/web_src/js/features/repo-projects.js
+++ b/web_src/js/features/repo-projects.js
@@ -1,5 +1,5 @@
 import $ from 'jquery';
-import {useLightTextOnBackground} from '../utils.js';
+import {useLightTextOnBackground, hexToRGBColor} from '../utils/color.js';
 
 const {csrfToken} = window.config;
 
@@ -190,7 +190,8 @@ export function initRepoProject() {
 }
 
 function setLabelColor(label, color) {
-  if (useLightTextOnBackground(color)) {
+  const [r, g, b] = hexToRGBColor(color);
+  if (useLightTextOnBackground(r, g, b)) {
     label.removeClass('dark-label').addClass('light-label');
   } else {
     label.removeClass('light-label').addClass('dark-label');
diff --git a/web_src/js/index.js b/web_src/js/index.js
index 10e2ecd28919..a837375b4ec5 100644
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -30,7 +30,7 @@ import {
   initRepoIssueWipTitle,
   initRepoPullRequestMergeInstruction,
   initRepoPullRequestAllowMaintainerEdit,
-  initRepoPullRequestReview, initRepoIssueSidebarList, initRepoIssueGotoID
+  initRepoPullRequestReview, initRepoIssueSidebarList
 } from './features/repo-issue.js';
 import {
   initRepoEllipsisButton,
@@ -81,6 +81,7 @@ import {initGlobalTooltips} from './modules/tippy.js';
 import {initGiteaFomantic} from './modules/fomantic.js';
 import {onDomReady} from './utils/dom.js';
 import {initRepoIssueList} from './features/repo-issue-list.js';
+import {initCommonIssueListQuickGoto} from './features/common-issue-list.js';
 
 // Init Gitea's Fomantic settings
 initGiteaFomantic();
@@ -98,6 +99,7 @@ onDomReady(() => {
   initGlobalLinkActions();
 
   initCommonOrganization();
+  initCommonIssueListQuickGoto();
 
   initCompSearchUserBox();
   initCompWebHookEditor();
@@ -175,5 +177,4 @@ onDomReady(() => {
   initUserAuthWebAuthnRegister();
   initUserSettings();
   initRepoDiffView();
-  initRepoIssueGotoID();
 });
diff --git a/web_src/js/utils.js b/web_src/js/utils.js
index 25094deea226..2a2d6df0b41e 100644
--- a/web_src/js/utils.js
+++ b/web_src/js/utils.js
@@ -135,17 +135,3 @@ export function toAbsoluteUrl(url) {
   return `${window.location.origin}${url}`;
 }
 
-// determine if light or dark text color should be used on a given background color
-// NOTE: see models/issue_label.go for similar implementation
-export function useLightTextOnBackground(backgroundColor) {
-  if (backgroundColor[0] === '#') {
-    backgroundColor = backgroundColor.substring(1);
-  }
-  // Perceived brightness from: https://www.w3.org/TR/AERT/#color-contrast
-  // In the future WCAG 3 APCA may be a better solution.
-  const r = parseInt(backgroundColor.substring(0, 2), 16);
-  const g = parseInt(backgroundColor.substring(2, 4), 16);
-  const b = parseInt(backgroundColor.substring(4, 6), 16);
-  const brightness = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
-  return brightness < 0.35;
-}
diff --git a/web_src/js/utils/color.js b/web_src/js/utils/color.js
new file mode 100644
index 000000000000..389e2d095f01
--- /dev/null
+++ b/web_src/js/utils/color.js
@@ -0,0 +1,42 @@
+// Check similar implementation in modules/util/color.go and keep synchronization
+// Return R, G, B values defined in reletive luminance
+function getLuminanceRGB(channel) {
+  const sRGB = channel / 255;
+  return (sRGB <= 0.03928) ? sRGB / 12.92 : ((sRGB + 0.055) / 1.055) ** 2.4;
+}
+
+// Reference from: https://www.w3.org/WAI/GL/wiki/Relative_luminance
+function getLuminance(r, g, b) {
+  const R = getLuminanceRGB(r);
+  const G = getLuminanceRGB(g);
+  const B = getLuminanceRGB(b);
+  return 0.2126 * R + 0.7152 * G + 0.0722 * B;
+}
+
+// Get color as RGB values in 0..255 range from the hex color string (with or without #)
+export function hexToRGBColor(backgroundColorStr) {
+  let backgroundColor = backgroundColorStr;
+  if (backgroundColorStr[0] === '#') {
+    backgroundColor = backgroundColorStr.substring(1);
+  }
+  // only support transfer of rgb, rgba, rrggbb and rrggbbaa
+  // if not in these formats, use default values 0, 0, 0
+  if (![3, 4, 6, 8].includes(backgroundColor.length)) {
+    return [0, 0, 0];
+  }
+  if ([3, 4].includes(backgroundColor.length)) {
+    const [r, g, b] = backgroundColor;
+    backgroundColor = `${r}${r}${g}${g}${b}${b}`;
+  }
+  const r = parseInt(backgroundColor.substring(0, 2), 16);
+  const g = parseInt(backgroundColor.substring(2, 4), 16);
+  const b = parseInt(backgroundColor.substring(4, 6), 16);
+  return [r, g, b];
+}
+
+// Reference from: https://firsching.ch/github_labels.html
+// In the future WCAG 3 APCA may be a better solution.
+// Check if text should use light color based on RGB of background
+export function useLightTextOnBackground(r, g, b) {
+  return getLuminance(r, g, b) < 0.453;
+}
diff --git a/web_src/js/utils/color.test.js b/web_src/js/utils/color.test.js
new file mode 100644
index 000000000000..592e93b0f232
--- /dev/null
+++ b/web_src/js/utils/color.test.js
@@ -0,0 +1,34 @@
+import {test, expect} from 'vitest';
+import {hexToRGBColor, useLightTextOnBackground} from './color.js';
+
+test('hexToRGBColor', () => {
+  expect(hexToRGBColor('2b8685')).toEqual([43, 134, 133]);
+  expect(hexToRGBColor('1e1')).toEqual([17, 238, 17]);
+  expect(hexToRGBColor('#1e1')).toEqual([17, 238, 17]);
+  expect(hexToRGBColor('1e16')).toEqual([17, 238, 17]);
+  expect(hexToRGBColor('3bb6b3')).toEqual([59, 182, 179]);
+  expect(hexToRGBColor('#3bb6b399')).toEqual([59, 182, 179]);
+  expect(hexToRGBColor('#0')).toEqual([0, 0, 0]);
+  expect(hexToRGBColor('#00000')).toEqual([0, 0, 0]);
+  expect(hexToRGBColor('#1234567')).toEqual([0, 0, 0]);
+});
+
+test('useLightTextOnBackground', () => {
+  expect(useLightTextOnBackground(215, 58, 74)).toBe(true);
+  expect(useLightTextOnBackground(0, 117, 202)).toBe(true);
+  expect(useLightTextOnBackground(207, 211, 215)).toBe(false);
+  expect(useLightTextOnBackground(162, 238, 239)).toBe(false);
+  expect(useLightTextOnBackground(112, 87, 255)).toBe(true);
+  expect(useLightTextOnBackground(0, 134, 114)).toBe(true);
+  expect(useLightTextOnBackground(228, 230, 105)).toBe(false);
+  expect(useLightTextOnBackground(216, 118, 227)).toBe(true);
+  expect(useLightTextOnBackground(255, 255, 255)).toBe(false);
+  expect(useLightTextOnBackground(43, 134, 133)).toBe(true);
+  expect(useLightTextOnBackground(43, 135, 134)).toBe(true);
+  expect(useLightTextOnBackground(44, 135, 134)).toBe(true);
+  expect(useLightTextOnBackground(59, 182, 179)).toBe(true);
+  expect(useLightTextOnBackground(124, 114, 104)).toBe(true);
+  expect(useLightTextOnBackground(126, 113, 108)).toBe(true);
+  expect(useLightTextOnBackground(129, 112, 109)).toBe(true);
+  expect(useLightTextOnBackground(128, 112, 112)).toBe(true);
+});
diff --git a/web_src/js/utils/dom.js b/web_src/js/utils/dom.js
index 6a9ee56eebec..cdc52b1a7425 100644
--- a/web_src/js/utils/dom.js
+++ b/web_src/js/utils/dom.js
@@ -1,3 +1,5 @@
+import {debounce} from 'throttle-debounce';
+
 function elementsCall(el, func, ...args) {
   if (typeof el === 'string' || el instanceof String) {
     el = document.querySelectorAll(el);
@@ -42,6 +44,13 @@ export function toggleElem(el, force) {
   elementsCall(el, toggleShown, force);
 }
 
+export function isElemHidden(el) {
+  const res = [];
+  elementsCall(el, (e) => res.push(e.classList.contains('gt-hidden')));
+  if (res.length > 1) throw new Error(`isElemHidden doesn't work for multiple elements`);
+  return res[0];
+}
+
 export function onDomReady(cb) {
   if (document.readyState === 'loading') {
     document.addEventListener('DOMContentLoaded', cb);
@@ -170,3 +179,7 @@ export function autosize(textarea, {viewportMarginBottom = 0} = {}) {
     }
   };
 }
+
+export function onInputDebounce(fn) {
+  return debounce(300, fn);
+}