From 5961db5aa751a34575d9a03145f0d2104e21e0e5 Mon Sep 17 00:00:00 2001 From: 0ko <0ko@noreply.codeberg.org> Date: Fri, 7 Feb 2025 01:07:16 +0000 Subject: [PATCH] ui: update styling of comment headers and role labels (#6816) ## Changes * same as https://codeberg.org/forgejo/forgejo/pulls/6201, but for role labels * remove border * decrease paddings * all by simply removing `basic` * I did check that no important properties were added by that class * make the header itself more compact by decreasing paddings here too * it's really large currently - being as high as single line content * removed "review" label by @fnetX request There was no heavy consideration behind these changes. I was just poking around the area from time to time and finally decided to submit something. If you think there's more consideration needed, please tell! ## Preview ![b1.webp](/attachments/626a8c26-ba21-4920-810e-2bd924997cdb) ![b2.webp](/attachments/389995d3-70d2-480f-8c75-56c59a659569) Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6816 Reviewed-by: Beowulf Reviewed-by: Otto Co-authored-by: 0ko <0ko@noreply.codeberg.org> Co-committed-by: 0ko <0ko@noreply.codeberg.org> --- options/locale/locale_en-US.ini | 1 - templates/repo/diff/comments.tmpl | 8 ++------ templates/repo/diff/conversation.tmpl | 2 +- templates/repo/issue/view_content/conversation.tmpl | 2 +- templates/repo/issue/view_content/show_role.tmpl | 4 ++-- web_src/css/repo.css | 2 +- web_src/css/themes/theme-forgejo-dark.css | 4 ++-- web_src/css/themes/theme-forgejo-light.css | 5 ++--- 8 files changed, 11 insertions(+), 17 deletions(-) diff --git a/options/locale/locale_en-US.ini b/options/locale/locale_en-US.ini index 5f945f0d0f..deff5f471e 100644 --- a/options/locale/locale_en-US.ini +++ b/options/locale/locale_en-US.ini @@ -1831,7 +1831,6 @@ issues.review.remove_review_request_self = refused to review %s issues.review.add_remove_review_requests = requested reviews from %[1]s and removed review requests for %[2]s %[3]s issues.review.pending = Pending issues.review.pending.tooltip = This comment is not currently visible to other users. To submit your pending comments, select "%s" -> "%s/%s/%s" at the top of the page. -issues.review.review = Review issues.review.reviewers = Reviewers issues.review.outdated = Outdated issues.review.outdated_description = Content has changed since this comment was made diff --git a/templates/repo/diff/comments.tmpl b/templates/repo/diff/comments.tmpl index b36f20269e..3128149c75 100644 --- a/templates/repo/diff/comments.tmpl +++ b/templates/repo/diff/comments.tmpl @@ -33,19 +33,15 @@
{{if .Invalidated}} {{$referenceUrl := printf "%s#%s" $.root.Issue.Link .HashTag}} - + {{ctx.Locale.Tr "repo.issues.review.outdated"}} {{end}} {{if and .Review}} {{if eq .Review.Type 0}} -
+
{{ctx.Locale.Tr "repo.issues.review.pending"}}
- {{else}} -
- {{ctx.Locale.Tr "repo.issues.review.review"}} -
{{end}} {{end}} {{template "repo/issue/view_content/add_reaction" dict "ctxData" $.root "ActionURL" (printf "%s/comments/%d/reactions" $.root.RepoLink .ID)}} diff --git a/templates/repo/diff/conversation.tmpl b/templates/repo/diff/conversation.tmpl index c80d999f47..9753bd80e1 100644 --- a/templates/repo/diff/conversation.tmpl +++ b/templates/repo/diff/conversation.tmpl @@ -14,7 +14,7 @@ We only handle the case $resolved=true and $invalid=true in this template because if the comment is not resolved it has the outdated label in the comments area (not the header above). The case $resolved=false and $invalid=true is handled in repo/diff/comments.tmpl --> - + {{ctx.Locale.Tr "repo.issues.review.outdated"}} {{end}} diff --git a/templates/repo/issue/view_content/conversation.tmpl b/templates/repo/issue/view_content/conversation.tmpl index 4f70e799a2..a802d930fd 100644 --- a/templates/repo/issue/view_content/conversation.tmpl +++ b/templates/repo/issue/view_content/conversation.tmpl @@ -7,7 +7,7 @@
{{(index .comments 0).TreePath}} {{if $invalid}} - + {{ctx.Locale.Tr "repo.issues.review.outdated"}} {{end}} diff --git a/templates/repo/issue/view_content/show_role.tmpl b/templates/repo/issue/view_content/show_role.tmpl index 0f1b895501..878a943bb9 100644 --- a/templates/repo/issue/view_content/show_role.tmpl +++ b/templates/repo/issue/view_content/show_role.tmpl @@ -1,5 +1,5 @@ {{if and .ShowRole.IsPoster (not .IgnorePoster)}} -
{{end}} {{if .ShowRole.RoleInRepo}} -
+
{{.ShowRole.RoleInRepo.LocaleString ctx.Locale}}
{{end}} diff --git a/web_src/css/repo.css b/web_src/css/repo.css index bdb09eb776..1277954b14 100644 --- a/web_src/css/repo.css +++ b/web_src/css/repo.css @@ -2248,7 +2248,7 @@ details.repo-search-result summary::marker { } .timeline .ui.comment-header { - padding: 0.5rem 1rem; + padding: 0.25rem 0.75rem; } .comment-header::before, diff --git a/web_src/css/themes/theme-forgejo-dark.css b/web_src/css/themes/theme-forgejo-dark.css index bc321f38a8..c9c538502d 100644 --- a/web_src/css/themes/theme-forgejo-dark.css +++ b/web_src/css/themes/theme-forgejo-dark.css @@ -326,8 +326,8 @@ i.grey.icon.icon.icon.icon { .ui.ui.ui.basic.primary.label { color: var(--color-text-dark) !important; } -.ui.basic.yellow.label.pending-label { - background: var(--color-light) !important; +.ui.yellow.label.pending-label { + color: var(--color-warning-text) !important; } ::selection { background: var(--steel-100) !important; diff --git a/web_src/css/themes/theme-forgejo-light.css b/web_src/css/themes/theme-forgejo-light.css index c86ea53314..a5e4ffe050 100644 --- a/web_src/css/themes/theme-forgejo-light.css +++ b/web_src/css/themes/theme-forgejo-light.css @@ -314,10 +314,9 @@ .ui.ui.ui.basic.primary.label { color: var(--color-text-dark) !important; } -.ui.basic.yellow.label.pending-label { +.ui.yellow.label.pending-label { background: var(--color-warning-bg) !important; - color: var(--color-warning-text) !important; - border-color: var(--color-yellow-light) !important; + color: var(--color-text-dark) !important; } ::selection { background: var(--steel-450) !important;