From ed1798f66d30e3755f01e24f8cb4aa5e8b6628a0 Mon Sep 17 00:00:00 2001
From: yp05327 <576951401@qq.com>
Date: Fri, 15 Mar 2024 04:01:16 +0900
Subject: [PATCH] Improve commit record's ui in comment list (#26619)

Before:

![image](https://github.com/go-gitea/gitea/assets/18380374/795f9941-9989-4045-b0fc-d6dd0262269b)

![image](https://github.com/go-gitea/gitea/assets/18380374/f6505f5e-4248-456e-a98d-e714c6484b2f)

After:

![image](https://github.com/go-gitea/gitea/assets/18380374/321dda1e-6999-4851-afff-2e6c8d20367b)

![image](https://github.com/go-gitea/gitea/assets/18380374/182f18d1-2295-4004-852b-c0ebb498b411)

---------

Co-authored-by: silverwind <me@silverwind.io>
(cherry picked from commit ce085b26fc5076b36c55e6a0a30ba8f11105c0bf)
---
 templates/repo/issue/view_content/comments.tmpl | 16 ++++++++--------
 web_src/css/repo.css                            |  6 +-----
 2 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/templates/repo/issue/view_content/comments.tmpl b/templates/repo/issue/view_content/comments.tmpl
index 37ec98a3d..6e585f028 100644
--- a/templates/repo/issue/view_content/comments.tmpl
+++ b/templates/repo/issue/view_content/comments.tmpl
@@ -148,7 +148,7 @@
 				</span>
 				{{if eq .RefAction 3}}</del>{{end}}
 
-				<div class="detail">
+				<div class="detail flex-text-block">
 					<span class="text grey muted-links"><a href="{{.RefIssueLink ctx}}"><b>{{.RefIssueTitle ctx}}</b> {{.RefIssueIdent ctx}}</a></span>
 				</div>
 			</div>
@@ -164,7 +164,7 @@
 						{{ctx.Locale.Tr "repo.issues.commit_ref_at" .EventTag $createdStr}}
 					{{end}}
 				</span>
-				<div class="detail">
+				<div class="detail flex-text-block">
 					{{svg "octicon-git-commit"}}
 					<span class="text grey muted-links">{{.Content | SanitizeHTML}}</span>
 				</div>
@@ -256,7 +256,7 @@
 					{{ctx.Locale.Tr "repo.issues.stop_tracking_history" $createdStr}}
 				</span>
 				{{template "repo/issue/view_content/comments_delete_time" dict "ctxData" $ "comment" .}}
-				<div class="detail">
+				<div class="detail flex-text-block">
 					{{svg "octicon-clock"}}
 					{{if .RenderedContent}}
 						{{/* compatibility with time comments made before v1.21 */}}
@@ -275,7 +275,7 @@
 					{{ctx.Locale.Tr "repo.issues.add_time_history" $createdStr}}
 				</span>
 				{{template "repo/issue/view_content/comments_delete_time" dict "ctxData" $ "comment" .}}
-				<div class="detail">
+				<div class="detail flex-text-block">
 					{{svg "octicon-clock"}}
 					{{if .RenderedContent}}
 						{{/* compatibility with time comments made before v1.21 */}}
@@ -335,7 +335,7 @@
 					{{ctx.Locale.Tr "repo.issues.dependency.added_dependency" $createdStr}}
 				</span>
 				{{if .DependentIssue}}
-					<div class="detail">
+					<div class="detail flex-text-block">
 						{{svg "octicon-plus"}}
 						<span class="text grey muted-links">
 							<a href="{{.DependentIssue.Link}}">
@@ -358,8 +358,8 @@
 					{{ctx.Locale.Tr "repo.issues.dependency.removed_dependency" $createdStr}}
 				</span>
 				{{if .DependentIssue}}
-					<div class="detail">
-						<span class="text grey muted-links">{{svg "octicon-trash"}}</span>
+					<div class="detail flex-text-block">
+						{{svg "octicon-trash"}}
 						<span class="text grey muted-links">
 							<a href="{{.DependentIssue.Link}}">
 								{{if eq .DependentIssue.RepoID .Issue.RepoID}}
@@ -510,7 +510,7 @@
 
 					{{ctx.Locale.Tr "repo.issues.del_time_history" $createdStr}}
 				</span>
-				<div class="detail">
+				<div class="detail flex-text-block">
 					{{svg "octicon-clock"}}
 					{{if .RenderedContent}}
 						{{/* compatibility with time comments made before v1.21 */}}
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index 0704e7406..dda2439da 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -1065,11 +1065,7 @@
 
 .repository.view.issue .comment-list .event .detail {
   margin-top: 4px;
-  margin-left: 14px;
-}
-
-.repository.view.issue .comment-list .event .detail .svg {
-  margin-right: 2px;
+  margin-left: 15px;
 }
 
 .repository.view.issue .comment-list .event .segments {