diff options
| -rw-r--r-- | templates/repo/commits_list_small.tmpl | 2 | ||||
| -rw-r--r-- | templates/repo/diff/comments.tmpl | 14 | ||||
| -rw-r--r-- | templates/repo/editor/commit_form.tmpl | 2 | ||||
| -rw-r--r-- | templates/repo/issue/new_form.tmpl | 4 | ||||
| -rw-r--r-- | templates/repo/issue/view_content.tmpl | 4 | ||||
| -rw-r--r-- | templates/repo/issue/view_content/comments.tmpl | 104 | ||||
| -rw-r--r-- | templates/repo/issue/view_content/pull_merge_box.tmpl | 2 | ||||
| -rw-r--r-- | templates/repo/issue/view_title.tmpl | 2 | ||||
| -rw-r--r-- | templates/shared/user/avatarlink.tmpl | 2 | ||||
| -rw-r--r-- | tests/integration/pull_create_test.go | 4 | ||||
| -rw-r--r-- | tests/integration/timetracking_test.go | 4 | ||||
| -rw-r--r-- | web_src/css/base.css | 6 | ||||
| -rw-r--r-- | web_src/css/modules/comment.css | 4 | ||||
| -rw-r--r-- | web_src/css/repo.css | 196 |
14 files changed, 110 insertions, 240 deletions
diff --git a/templates/repo/commits_list_small.tmpl b/templates/repo/commits_list_small.tmpl index ee94ad7e58..0470d1e9f5 100644 --- a/templates/repo/commits_list_small.tmpl +++ b/templates/repo/commits_list_small.tmpl @@ -22,7 +22,7 @@ <button class="ui button ellipsis-button show-panel toggle" data-panel="[data-singular-commit-body-for='{{$tag}}']">...</button> {{end}} - <span class="tw-flex tw-items-center tw-gap-2"> + <span class="flex-text-block"> {{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses}} {{template "repo/commit_sign_badge" dict "Commit" . "CommitBaseLink" $commitBaseLink "CommitSignVerification" .Verification}} </span> diff --git a/templates/repo/diff/comments.tmpl b/templates/repo/diff/comments.tmpl index aa483ec669..22829fbf8a 100644 --- a/templates/repo/diff/comments.tmpl +++ b/templates/repo/diff/comments.tmpl @@ -2,13 +2,15 @@ {{$createdStr:= DateUtils.TimeSince .CreatedUnix}} <div class="comment" id="{{.HashTag}}"> - {{if .OriginalAuthor}} - <span class="avatar">{{ctx.AvatarUtils.Avatar nil}}</span> - {{else}} - {{template "shared/user/avatarlink" dict "user" .Poster}} - {{end}} + <div class="tw-mt-2 tw-mr-4"> + {{if .OriginalAuthor}} + <span class="avatar">{{ctx.AvatarUtils.Avatar nil}}</span> + {{else}} + {{template "shared/user/avatarlink" dict "user" .Poster}} + {{end}} + </div> <div class="content comment-container"> - <div class="comment-header"> + <div class="comment-header avatar-content-left-arrow"> <div class="comment-header-left"> {{if .OriginalAuthor}} <span class="text black tw-font-semibold tw-mr-1"> diff --git a/templates/repo/editor/commit_form.tmpl b/templates/repo/editor/commit_form.tmpl index 7067614444..3e4482f9e2 100644 --- a/templates/repo/editor/commit_form.tmpl +++ b/templates/repo/editor/commit_form.tmpl @@ -1,6 +1,6 @@ <div class="commit-form-wrapper"> {{ctx.AvatarUtils.Avatar .SignedUser 40 "commit-avatar"}} - <div class="commit-form"> + <div class="commit-form avatar-content-left-arrow"> <h3>{{- if .CommitFormOptions.WillSign}} <span title="{{ctx.Locale.Tr "repo.signing.will_sign" .CommitFormOptions.SigningKey}}">{{svg "octicon-lock" 24}}</span> {{ctx.Locale.Tr "repo.editor.commit_signed_changes"}} diff --git a/templates/repo/issue/new_form.tmpl b/templates/repo/issue/new_form.tmpl index 9413200870..b63cbcfc0d 100644 --- a/templates/repo/issue/new_form.tmpl +++ b/templates/repo/issue/new_form.tmpl @@ -4,8 +4,8 @@ <div class="issue-content-left"> <div class="ui comments"> <div class="comment"> - {{ctx.AvatarUtils.Avatar .SignedUser 40}} - <div class="ui segment content tw-my-0"> + <div class=" tw-mr-4 not-mobile">{{ctx.AvatarUtils.Avatar .SignedUser 40}}</div> + <div class="ui segment content tw-my-0 avatar-content-left-arrow"> <div class="field"> <input name="title" data-global-init="initInputAutoFocusEnd" id="issue_title" required maxlength="255" autocomplete="off" placeholder="{{ctx.Locale.Tr "repo.milestones.title"}}" diff --git a/templates/repo/issue/view_content.tmpl b/templates/repo/issue/view_content.tmpl index 926c6e3de5..a51a7f4fb1 100644 --- a/templates/repo/issue/view_content.tmpl +++ b/templates/repo/issue/view_content.tmpl @@ -13,7 +13,7 @@ </a> {{end}} <div class="content comment-container"> - <div class="comment-header" role="heading" aria-level="3"> + <div class="comment-header avatar-content-left-arrow" role="heading" aria-level="3"> <div class="comment-header-left"> {{if .Issue.OriginalAuthor}} <span class="text black tw-font-semibold"> @@ -78,7 +78,7 @@ {{ctx.AvatarUtils.Avatar .SignedUser 40}} </a> <div class="content"> - <div class="ui segment"> + <div class="ui segment avatar-content-left-arrow"> <form class="ui form form-fetch-action" id="comment-form" action="{{$.RepoLink}}/issues/{{.Issue.Index}}/comments" method="post"> {{template "repo/issue/comment_tab" .}} {{.CsrfTokenHtml}} diff --git a/templates/repo/issue/view_content/comments.tmpl b/templates/repo/issue/view_content/comments.tmpl index 2bf8837dd5..089cdf2ccd 100644 --- a/templates/repo/issue/view_content/comments.tmpl +++ b/templates/repo/issue/view_content/comments.tmpl @@ -26,14 +26,14 @@ </a> {{end}} <div class="content comment-container"> - <div class="comment-header" role="heading" aria-level="3"> + <div class="comment-header avatar-content-left-arrow" role="heading" aria-level="3"> <div class="comment-header-left"> {{if .OriginalAuthor}} <span class="text black tw-font-semibold tw-mr-1"> {{svg (MigrationIcon $.Repository.GetOriginalURLHostname)}} {{.OriginalAuthor}} </span> - <span class="text grey muted-links"> + <span class="comment-text-line"> {{ctx.Locale.Tr "repo.issues.commented_at" .HashTag $createdStr}} {{if $.Repository.OriginalURL}} </span> <span class="text migrate"> @@ -45,7 +45,7 @@ {{ctx.AvatarUtils.Avatar .Poster 24}} </a> {{end}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.commented_at" .HashTag $createdStr}} </span> @@ -85,7 +85,7 @@ {{if not .OriginalAuthor}} {{template "shared/user/avatarlink" dict "user" .Poster}} {{end}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "repo/issue/view_content/comments_authorlink" dict "ctxData" $ "comment" .}} {{if .Issue.IsPull}} {{ctx.Locale.Tr "repo.pulls.reopened_at" .EventTag $createdStr}} @@ -100,7 +100,7 @@ {{if not .OriginalAuthor}} {{template "shared/user/avatarlink" dict "user" .Poster}} {{end}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "repo/issue/view_content/comments_authorlink" dict "ctxData" $ "comment" .}} {{if .Issue.IsPull}} {{ctx.Locale.Tr "repo.pulls.closed_at" .EventTag $createdStr}} @@ -115,7 +115,7 @@ {{if not .OriginalAuthor}} {{template "shared/user/avatarlink" dict "user" .Poster}} {{end}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "repo/issue/view_content/comments_authorlink" dict "ctxData" $ "comment" .}} {{$link := printf "%s/commit/%s" $.Repository.Link ($.Issue.PullRequest.MergedCommitID|PathEscape)}} {{if eq $.Issue.PullRequest.Status 3}} @@ -143,28 +143,28 @@ <span class="badge">{{svg "octicon-bookmark"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} {{if eq .RefAction 3}}<del>{{end}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr $refTr .EventTag $createdStr (.RefCommentLink ctx) $refFrom}} </span> {{if eq .RefAction 3}}</del>{{end}} <div class="detail flex-text-block"> - <span class="text grey muted-links"><a href="{{.RefIssueLink ctx}}"><b>{{.RefIssueTitle ctx}}</b> {{.RefIssueIdent ctx}}</a></span> + <span class="comment-text-line"><a href="{{.RefIssueLink ctx}}"><b>{{.RefIssueTitle ctx}}</b> {{.RefIssueIdent ctx}}</a></span> </div> </div> {{else if eq .Type 4}} <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-bookmark"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.commit_ref_at" .EventTag $createdStr}} </span> <div class="detail flex-text-block"> {{svg "octicon-git-commit"}} {{/* the content is a link like <a href="{RepoLink}/commit/{CommitID}">message title</a> (from CreateRefComment) */}} - <span class="text grey muted-links">{{.Content | SanitizeHTML}}</span> + <span class="comment-text-line">{{.Content | SanitizeHTML}}</span> </div> </div> {{else if eq .Type 7}} @@ -172,7 +172,7 @@ <div class="timeline-item event with-labels-list-inline" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-tag"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{if and .AddedLabels (not .RemovedLabels)}} {{ctx.Locale.TrN (len .AddedLabels) "repo.issues.add_label" "repo.issues.add_labels" (ctx.RenderUtils.RenderLabels .AddedLabels $.RepoLink .Issue) $createdStr}} @@ -188,7 +188,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-milestone"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{if gt .OldMilestoneID 0}}{{if gt .MilestoneID 0}}{{ctx.Locale.Tr "repo.issues.change_milestone_at" .OldMilestone.Name .Milestone.Name $createdStr}}{{else}}{{ctx.Locale.Tr "repo.issues.remove_milestone_at" .OldMilestone.Name $createdStr}}{{end}}{{else if gt .MilestoneID 0}}{{ctx.Locale.Tr "repo.issues.add_milestone_at" .Milestone.Name $createdStr}}{{end}} </span> @@ -198,7 +198,7 @@ <span class="badge">{{svg "octicon-person"}}</span> {{if .RemovedAssignee}} {{template "shared/user/avatarlink" dict "user" .Assignee}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Assignee}} {{if eq .Poster.ID .Assignee.ID}} {{ctx.Locale.Tr "repo.issues.remove_self_assignment" $createdStr}} @@ -208,7 +208,7 @@ </span> {{else}} {{template "shared/user/avatarlink" dict "user" .Assignee}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Assignee}} {{if eq .Poster.ID .AssigneeID}} {{ctx.Locale.Tr "repo.issues.self_assign_at" $createdStr}} @@ -222,7 +222,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-pencil"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.change_title_at" (.OldTitle|ctx.RenderUtils.RenderEmoji) (.NewTitle|ctx.RenderUtils.RenderEmoji) $createdStr}} </span> @@ -231,7 +231,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-git-branch"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$oldRef := HTMLFormat `<span class="tw-line-through">%s</span>` .OldRef}} {{ctx.Locale.Tr "repo.issues.delete_branch_at" $oldRef $createdStr}} @@ -241,7 +241,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-clock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.start_tracking_history" $createdStr}} </span> @@ -250,7 +250,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-clock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$timeStr := .RenderedContent}} {{/* compatibility with time comments made before v1.21 */}} {{if not $timeStr}}{{$timeStr = .Content|Sec2Hour}}{{end}} @@ -262,7 +262,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-clock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$timeStr := .RenderedContent}} {{/* compatibility with time comments made before v1.21 */}} {{if not $timeStr}}{{$timeStr = .Content|Sec2Hour}}{{end}} @@ -274,7 +274,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-clock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.cancel_tracking_history" $createdStr}} </span> @@ -283,7 +283,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-clock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$dueDate := DateUtils.AbsoluteLong (.Content|DateUtils.ParseLegacy)}} {{ctx.Locale.Tr "repo.issues.due_date_added" $dueDate $createdStr}} @@ -293,7 +293,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-clock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$parsedDeadline := StringUtils.Split .Content "|"}} {{if eq (len $parsedDeadline) 2}} @@ -307,7 +307,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-clock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$dueDate := DateUtils.AbsoluteLong (.Content|DateUtils.ParseLegacy)}} {{ctx.Locale.Tr "repo.issues.due_date_remove" $dueDate $createdStr}} @@ -317,14 +317,14 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-package-dependents"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.dependency.added_dependency" $createdStr}} </span> {{if .DependentIssue}} <div class="detail flex-text-block"> {{svg "octicon-plus"}} - <span class="text grey muted-links"> + <span class="comment-text-line"> <a href="{{.DependentIssue.Link}}"> {{if eq .DependentIssue.RepoID .Issue.RepoID}} #{{.DependentIssue.Index}} {{.DependentIssue.Title}} @@ -340,14 +340,14 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-package-dependents"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.dependency.removed_dependency" $createdStr}} </span> {{if .DependentIssue}} <div class="detail flex-text-block"> {{svg "octicon-trash"}} - <span class="text grey muted-links"> + <span class="comment-text-line"> <a href="{{.DependentIssue.Link}}"> {{if eq .DependentIssue.RepoID .Issue.RepoID}} #{{.DependentIssue.Index}} {{.DependentIssue.Title}} @@ -375,7 +375,7 @@ <span class="badge tw-text-white{{if eq $reviewType 1}}{{if .Review.Official}} tw-bg-green {{else}} tw-bg-grey{{end}}{{else if eq $reviewType 3}} tw-bg-red{{end}}"> {{if .Review}}{{svg (printf "octicon-%s" .Review.Type.Icon)}}{{end}} </span> - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "repo/issue/view_content/comments_authorlink" dict "ctxData" $ "comment" .}} {{if eq $reviewType 1}} {{ctx.Locale.Tr "repo.issues.review.approve" $createdStr}} @@ -394,20 +394,20 @@ {{if or .Content .Attachments}} <div class="timeline-item comment"> <div class="content comment-container"> - <div class="comment-header"> + <div class="comment-header avatar-content-left-arrow"> <div class="comment-header-left"> {{if gt .Poster.ID 0}} <a class="inline-timeline-avatar" href="{{.Poster.HomeLink}}"> {{ctx.AvatarUtils.Avatar .Poster 24}} </a> {{end}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{if .OriginalAuthor}} <span class="text black tw-font-semibold"> {{svg (MigrationIcon $.Repository.GetOriginalURLHostname)}} {{.OriginalAuthor}} </span> - <span class="text grey muted-links"> {{if $.Repository.OriginalURL}}</span> + <span class="comment-text-line"> {{if $.Repository.OriginalURL}}</span> <span class="text migrate">({{ctx.Locale.Tr "repo.migrated_from" $.Repository.OriginalURL $.Repository.GetOriginalURLHostname}}){{end}}</span> {{else}} {{template "shared/user/authorlink" .Poster}} @@ -461,12 +461,12 @@ <span class="badge">{{svg "octicon-lock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} {{if .Content}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.lock_with_reason" .Content $createdStr}} </span> {{else}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.lock_no_reason" $createdStr}} </span> @@ -476,7 +476,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-key"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.unlock_comment" $createdStr}} </span> @@ -487,7 +487,7 @@ {{if not .OriginalAuthor}} {{template "shared/user/avatarlink" dict "user" .Poster}} {{end}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "repo/issue/view_content/comments_authorlink" dict "ctxData" $ "comment" .}} {{ctx.Locale.Tr "repo.pulls.change_target_branch_at" .OldRef .NewRef $createdStr}} </span> @@ -496,7 +496,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-clock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{ctx.Locale.Tr "repo.issues.del_time_history" $createdStr}} @@ -505,9 +505,9 @@ {{svg "octicon-clock"}} {{if .RenderedContent}} {{/* compatibility with time comments made before v1.21 */}} - <span class="text grey muted-links">{{.RenderedContent}}</span> + <span class="comment-text-line">{{.RenderedContent}}</span> {{else}} - <span class="text grey muted-links">- {{.Content|Sec2Hour}}</span> + <span class="comment-text-line">- {{.Content|Sec2Hour}}</span> {{end}} </div> </div> @@ -515,7 +515,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-eye"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{if (gt .AssigneeID 0)}} {{if .RemovedAssignee}} @@ -548,7 +548,7 @@ {{end}} <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-repo-push"}}</span> - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{if .IsForcePush}} {{ctx.Locale.Tr "repo.issues.force_push_codes" $.Issue.PullRequest.HeadBranch (ShortSha .OldCommit) ($.Issue.Repo.CommitLink .OldCommit) (ShortSha .NewCommit) ($.Issue.Repo.CommitLink .NewCommit) $createdStr}} @@ -557,9 +557,7 @@ {{end}} </span> {{if and .IsForcePush $.Issue.PullRequest.BaseRepo.Name}} - <span class="tw-float-right comparebox"> - <a href="{{$.Issue.PullRequest.BaseRepo.Link}}/compare/{{PathEscape .OldCommit}}..{{PathEscape .NewCommit}}" rel="nofollow" class="ui compare label">{{ctx.Locale.Tr "repo.issues.force_push_compare"}}</a> - </span> + <a class="ui label comment-text-label tw-float-right" href="{{$.Issue.PullRequest.BaseRepo.Link}}/compare/{{PathEscape .OldCommit}}..{{PathEscape .NewCommit}}" rel="nofollow">{{ctx.Locale.Tr "repo.issues.force_push_compare"}}</a> {{end}} </div> {{if not .IsForcePush}} @@ -569,7 +567,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-project"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$oldProjectDisplayHtml := "Unknown Project"}} {{if .OldProject}} @@ -601,7 +599,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-project"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$newProjectDisplay := .CommentMetaData.ProjectTitle}} {{if .Project}} @@ -616,10 +614,10 @@ <div class="timeline-item-group"> <div class="timeline-item event" id="{{.HashTag}}"> <a class="timeline-avatar"{{if gt .Poster.ID 0}} href="{{.Poster.HomeLink}}"{{end}}> - <img loading="lazy" alt src="{{.Poster.AvatarLink ctx}}" width="40" height="40"> + {{ctx.AvatarUtils.Avatar .Poster 40}} </a> <span class="badge grey">{{svg "octicon-x" 16}}</span> - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$reviewerName := ""}} {{if .Review}} @@ -635,13 +633,13 @@ {{if .Content}} <div class="timeline-item comment"> <div class="content comment-container"> - <div class="comment-header arrow-top"> + <div class="comment-header avatar-content-left-arrow arrow-top"> {{if gt .Poster.ID 0}} <a class="inline-timeline-avatar" href="{{.Poster.HomeLink}}"> {{ctx.AvatarUtils.Avatar .Poster 24}} </a> {{end}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{ctx.Locale.Tr "action.review_dismissed_reason"}} </span> </div> @@ -662,7 +660,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-git-branch"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{if and .OldRef .NewRef}} {{ctx.Locale.Tr "repo.issues.change_ref_at" .OldRef .NewRef $createdStr}} @@ -676,7 +674,7 @@ {{else if or (eq .Type 34) (eq .Type 35)}} <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-git-merge" 16}}</span> - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "repo/issue/view_content/comments_authorlink" dict "ctxData" $ "comment" .}} {{if eq .Type 34}}{{ctx.Locale.Tr "repo.pulls.auto_merge_newly_scheduled_comment" $createdStr}} {{else}}{{ctx.Locale.Tr "repo.pulls.auto_merge_canceled_schedule_comment" $createdStr}}{{end}} @@ -686,7 +684,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-pin" 16}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{if eq .Type 36}}{{ctx.Locale.Tr "repo.issues.pin_comment" $createdStr}} {{else}}{{ctx.Locale.Tr "repo.issues.unpin_comment" $createdStr}}{{end}} @@ -696,7 +694,7 @@ <div class="timeline-item event" id="{{.HashTag}}"> <span class="badge">{{svg "octicon-clock"}}</span> {{template "shared/user/avatarlink" dict "user" .Poster}} - <span class="text grey muted-links"> + <span class="comment-text-line"> {{template "shared/user/authorlink" .Poster}} {{$timeStr := .Content|TimeEstimateString}} {{if $timeStr}} diff --git a/templates/repo/issue/view_content/pull_merge_box.tmpl b/templates/repo/issue/view_content/pull_merge_box.tmpl index 46bcd3b8b3..113bfb732e 100644 --- a/templates/repo/issue/view_content/pull_merge_box.tmpl +++ b/templates/repo/issue/view_content/pull_merge_box.tmpl @@ -38,7 +38,7 @@ </div> {{end}} {{$showGeneralMergeForm := false}} - <div class="ui attached segment merge-section {{if not $.LatestCommitStatus}}no-header{{end}} flex-items-block"> + <div class="ui attached segment merge-section {{if not $.LatestCommitStatus}}avatar-content-left-arrow{{end}} flex-items-block"> {{if .Issue.PullRequest.HasMerged}} {{if .IsPullBranchDeletable}} <div class="item item-section text tw-flex-1"> diff --git a/templates/repo/issue/view_title.tmpl b/templates/repo/issue/view_title.tmpl index b8f28dfd9b..103fa5de53 100644 --- a/templates/repo/issue/view_title.tmpl +++ b/templates/repo/issue/view_title.tmpl @@ -12,7 +12,7 @@ <div class="issue-title-header"> {{$canEditIssueTitle := and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}} <div class="issue-title" id="issue-title-display"> - <h1 class="tw-break-anywhere"> + <h1> {{ctx.RenderUtils.RenderIssueTitle .Issue.Title $.Repository}} <span class="index">#{{.Issue.Index}}</span> </h1> diff --git a/templates/shared/user/avatarlink.tmpl b/templates/shared/user/avatarlink.tmpl index 5e3ed7a68c..5d56fef430 100644 --- a/templates/shared/user/avatarlink.tmpl +++ b/templates/shared/user/avatarlink.tmpl @@ -1 +1 @@ -<a class="avatar"{{if gt .user.ID 0}} href="{{.user.HomeLink}}"{{end}}>{{ctx.AvatarUtils.Avatar .user}}</a> +<a class="avatar-with-link" {{if gt .user.ID 0}}href="{{.user.HomeLink}}"{{end}}>{{ctx.AvatarUtils.Avatar .user}}</a> diff --git a/tests/integration/pull_create_test.go b/tests/integration/pull_create_test.go index 179c84e673..44ef501961 100644 --- a/tests/integration/pull_create_test.go +++ b/tests/integration/pull_create_test.go @@ -163,10 +163,10 @@ func TestPullCreate_TitleEscape(t *testing.T) { req = NewRequest(t, "GET", url) resp = session.MakeRequest(t, req, http.StatusOK) htmlDoc = NewHTMLParser(t, resp.Body) - titleHTML, err := htmlDoc.doc.Find(".comment-list .timeline-item.event .text b").First().Html() + titleHTML, err := htmlDoc.doc.Find(".comment-list .timeline-item.event .comment-text-line b").First().Html() assert.NoError(t, err) assert.Equal(t, "<strike><i>XSS PR</i></strike>", titleHTML) - titleHTML, err = htmlDoc.doc.Find(".comment-list .timeline-item.event .text b").Next().Html() + titleHTML, err = htmlDoc.doc.Find(".comment-list .timeline-item.event .comment-text-line b").Next().Html() assert.NoError(t, err) assert.Equal(t, "<u>XSS PR</u>", titleHTML) }) diff --git a/tests/integration/timetracking_test.go b/tests/integration/timetracking_test.go index 4e8109be96..ebe084ccdc 100644 --- a/tests/integration/timetracking_test.go +++ b/tests/integration/timetracking_test.go @@ -56,7 +56,7 @@ func testViewTimetrackingControls(t *testing.T, session *TestSession, user, repo resp = session.MakeRequest(t, req, http.StatusOK) htmlDoc = NewHTMLParser(t, resp.Body) - events := htmlDoc.doc.Find(".event > span.text") + events := htmlDoc.doc.Find(".event > .comment-text-line") assert.Contains(t, events.Last().Text(), "started working") AssertHTMLElement(t, htmlDoc, ".issue-stop-time", true) @@ -74,7 +74,7 @@ func testViewTimetrackingControls(t *testing.T, session *TestSession, user, repo resp = session.MakeRequest(t, req, http.StatusOK) htmlDoc = NewHTMLParser(t, resp.Body) - events = htmlDoc.doc.Find(".event > span.text") + events = htmlDoc.doc.Find(".event > .comment-text-line") assert.Contains(t, events.Last().Text(), "worked for ") } else { session.MakeRequest(t, reqStart, http.StatusNotFound) diff --git a/web_src/css/base.css b/web_src/css/base.css index b415a70cb8..3b819e91bc 100644 --- a/web_src/css/base.css +++ b/web_src/css/base.css @@ -38,7 +38,7 @@ --font-size-label: 12px; /* font size of individual labels */ --gap-inline: 0.25rem; /* gap for inline texts and elements, for example: the spaces for sentence with labels, button text, etc */ - --gap-block: 0.25rem; /* gap for element blocks, for example: spaces between buttons, menu image & title, header icon & title etc */ + --gap-block: 0.5rem; /* gap for element blocks, for example: spaces between buttons, menu image & title, header icon & title etc */ } @media (min-width: 768px) and (max-width: 1200px) { @@ -1069,7 +1069,9 @@ table th[data-sortt-desc] .svg { .btn, .ui.ui.button, .ui.ui.dropdown, -.flex-text-inline { +.flex-text-inline, +.flex-text-inline > a, +.flex-text-inline > span { display: inline-flex; align-items: center; gap: var(--gap-inline); diff --git a/web_src/css/modules/comment.css b/web_src/css/modules/comment.css index 9947b15b9a..1e235a248f 100644 --- a/web_src/css/modules/comment.css +++ b/web_src/css/modules/comment.css @@ -56,10 +56,6 @@ min-width: 0; } -.ui.comments .comment > .avatar ~ .content { - margin-left: 12px; -} - .ui.comments .comment .author { font-size: 1em; font-weight: var(--font-weight-medium); diff --git a/web_src/css/repo.css b/web_src/css/repo.css index 8729212f10..0b50d1d1d7 100644 --- a/web_src/css/repo.css +++ b/web_src/css/repo.css @@ -238,8 +238,8 @@ td .commit-summary { border-radius: var(--border-radius); } -.repository.file.editor .commit-form-wrapper .commit-form::before, -.repository.file.editor .commit-form-wrapper .commit-form::after { +.avatar-content-left-arrow::before, +.avatar-content-left-arrow::after { right: 100%; top: 20px; border: solid transparent; @@ -250,18 +250,24 @@ td .commit-summary { pointer-events: none; } -.repository.file.editor .commit-form-wrapper .commit-form::before { +.avatar-content-left-arrow::before { border-right-color: var(--color-secondary); border-width: 9px; margin-top: -9px; } -.repository.file.editor .commit-form-wrapper .commit-form::after { +.avatar-content-left-arrow::after { border-right-color: var(--color-box-body); border-width: 8px; margin-top: -8px; } +@media (max-width: 767.98px) { + .avatar-content-left-arrow::before, + .avatar-content-left-arrow::after { + display: none; + } +} .repository.file.editor .commit-form-wrapper .commit-form .quick-pull-choice .branch-name { display: inline-block; padding: 2px 4px; @@ -294,30 +300,6 @@ td .commit-summary { min-width: 100px; } -.repository.new.issue .comment.form .content::before, -.repository.new.issue .comment.form .content::after { - right: 100%; - top: 20px; - border: solid transparent; - content: " "; - height: 0; - width: 0; - position: absolute; - pointer-events: none; -} - -.repository.new.issue .comment.form .content::before { - border-right-color: var(--color-secondary); - border-width: 9px; - margin-top: -9px; -} - -.repository.new.issue .comment.form .content::after { - border-right-color: var(--color-box-body); - border-width: 8px; - margin-top: -8px; -} - .repository.new.issue .comment.form .content .markup { font-size: 14px; } @@ -326,21 +308,6 @@ td .commit-summary { display: inline-block; } -@media (max-width: 767.98px) { - .comment.form .issue-content-left .avatar { - display: none; - } - .comment.form .issue-content-left .content { - margin-left: 0 !important; - } - .comment.form .issue-content-left .content::before, - .comment.form .issue-content-left .content::after, - .comment.form .content .form::before, - .comment.form .content .form::after { - display: none; - } -} - /* issue title & meta & edit */ .issue-title-header { width: 100%; @@ -365,7 +332,6 @@ td .commit-summary { .repository.view.issue .issue-title { display: flex; - align-items: center; gap: 0.5em; margin-bottom: 8px; min-height: 40px; /* avoid layout shift on edit */ @@ -379,6 +345,15 @@ td .commit-summary { line-height: 40px; margin: 0; padding-right: 0.25rem; + overflow-wrap: anywhere; +} + +.repository.view.issue .issue-title#issue-title-display .issue-title-buttons { + margin-top: 4px; /* the title's height is 40px, fine tune to align the buttons */ +} + +.repository.view.issue .issue-title#issue-title-editor { + padding-top: 4px; } @media (max-width: 767.98px) { @@ -535,6 +510,7 @@ td .commit-summary { background-color: var(--color-timeline); border-radius: var(--border-radius-full); display: flex; + flex-shrink: 0; float: left; margin-left: -33px; margin-right: 8px; @@ -562,9 +538,18 @@ td .commit-summary { margin-left: -16px; } -.repository.view.issue .comment-list .timeline-item.event > .text { +.repository.view.issue .comment-list .timeline-item .comment-text-line { line-height: 32px; vertical-align: middle; + color: var(--color-text-light); +} + +.repository.view.issue .comment-list .timeline-item .comment-text-line a { + color: inherit; +} + +.repository.view.issue .comment-list .timeline-item .avatar-with-link + .comment-text-line { + margin-left: 0.25em; } .repository.view.issue .comment-list .timeline-item.commits-list { @@ -578,15 +563,11 @@ td .commit-summary { margin-top: 4px; } -.repository.view.issue .comment-list .timeline-item .comparebox { - line-height: 32px; +.repository.view.issue .comment-list .timeline-item .comment-text-label { vertical-align: middle; -} - -.repository.view.issue .comment-list .timeline-item .comparebox .compare.label { - font-size: 1rem; - margin: 0; border: 1px solid var(--color-light-border); + height: 26px; + margin: 4px 0; /* because this label is beside the comment line, which has "line-height: 34px" */ } @media (max-width: 767.98px) { @@ -650,30 +631,6 @@ td .commit-summary { width: calc(100% + 2rem); } -.repository.view.issue .comment-list .comment .merge-section.no-header::before, -.repository.view.issue .comment-list .comment .merge-section.no-header::after { - right: 100%; - top: 20px; - border: solid transparent; - content: " "; - height: 0; - width: 0; - position: absolute; - pointer-events: none; -} - -.repository.view.issue .comment-list .comment .merge-section.no-header::before { - border-right-color: var(--color-secondary); - border-width: 9px; - margin-top: -9px; -} - -.repository.view.issue .comment-list .comment .merge-section.no-header::after { - border-right-color: var(--color-box-body); - border-width: 8px; - margin-top: -8px; -} - .merge-section-info code { border: 1px solid var(--color-light-border); border-radius: var(--border-radius); @@ -717,19 +674,10 @@ td .commit-summary { padding: 0 !important; } -.repository.view.issue .comment-list .code-comment .comment-header::after, -.repository.view.issue .comment-list .code-comment .comment-header::before { - display: none; -} - .repository.view.issue .comment-list .code-comment .comment-content { margin-left: 24px; } -.repository.view.issue .comment-list .comment > .avatar { - margin-top: 6px; -} - .repository.view.issue .comment-list .comment-code-cloud button.comment-form-reply { margin: 0; } @@ -761,30 +709,6 @@ td .commit-summary { clear: none; } -.repository .comment.form .content .segment::before, -.repository .comment.form .content .segment::after { - right: 100%; - top: 20px; - border: solid transparent; - content: " "; - height: 0; - width: 0; - position: absolute; - pointer-events: none; -} - -.repository .comment.form .content .segment::before { - border-right-color: var(--color-secondary); - border-width: 9px; - margin-top: -9px; -} - -.repository .comment.form .content .segment::after { - border-right-color: var(--color-box-body); - border-width: 8px; - margin-top: -8px; -} - .repository.new.milestone textarea { height: 200px; } @@ -807,30 +731,6 @@ td .commit-summary { text-align: center; } -.repository.compare.pull .comment.form .content::before, -.repository.compare.pull .comment.form .content::after { - right: 100%; - top: 20px; - border: solid transparent; - content: " "; - height: 0; - width: 0; - position: absolute; - pointer-events: none; -} - -.repository.compare.pull .comment.form .content::before { - border-right-color: var(--color-secondary); - border-width: 9px; - margin-top: -9px; -} - -.repository.compare.pull .comment.form .content::after { - border-right-color: var(--color-box-body); - border-width: 8px; - margin-top: -8px; -} - .repository.compare.pull .markup { font-size: 14px; } @@ -1431,30 +1331,6 @@ td .commit-summary { gap: 0.25em; } -.comment-header::before, -.comment-header::after { - right: 100%; - top: 20px; - border: solid transparent; - content: " "; - height: 0; - width: 0; - position: absolute; - pointer-events: none; -} - -.comment-header::before { - border-right-color: var(--color-secondary); - border-width: 9px; - margin-top: -9px; -} - -.comment-header::after { - border-right-color: var(--color-box-header); - border-width: 8px; - margin-top: -8px; -} - .comment-header.arrow-top::before, .comment-header.arrow-top::after { transform: rotate(90deg); @@ -1629,7 +1505,7 @@ tbody.commit-list { overflow-wrap: anywhere; } -.content-history-detail-dialog .header .avatar { +.content-history-detail-dialog .header .ui.avatar { position: relative; top: -2px; } @@ -1978,10 +1854,6 @@ tbody.commit-list { .repository.view.issue .comment-list .timeline .comment-header { padding-left: 4px; } - .repository.view.issue .comment-list .timeline .comment-header::before, - .repository.view.issue .comment-list .timeline .comment-header::after { - content: unset; - } /* Don't show the general avatar, we show the inline avatar on mobile. * And don't show the role labels, there's no place for that. */ .repository.view.issue .comment-list .timeline .timeline-avatar, |