From 576644d81555cfcd7c865d444285cad64cc0b9ec Mon Sep 17 00:00:00 2001 From: wxiaoguang Date: Sat, 26 Aug 2023 07:35:10 +0800 Subject: [PATCH] Simplify helper CSS classes and avoid abuse (#26728) Removed CSS helper classes (some of them are not useful while some of them are abused often) * `gt-db`: in most cases it could be replaced by `gt-df` and the flex layout should be encouraged. Other cases: either it does need the `gt-df` (eg: by using `div` directly) or it is an abuse (eg: the warning message in a form) * `gt-di`: it doesn't seem useful, or it could be replaced by `gt-dib` in most cases. * `gt-dif`: not useful, it could be replaced by `flex-text-inline` or `gt-df` * `gt-js`: never used * All `` could be written as `` ## Some UI samples ### Admin Notice ![image](https://github.com/go-gitea/gitea/assets/2114189/d02010d4-dc7d-463f-bc99-dcc9b6e2e2ac) ### Admin Stacktrace ![image](https://github.com/go-gitea/gitea/assets/2114189/4045695c-a8c4-4e37-b720-e77a61b1e965) ### Org Home ![image](https://github.com/go-gitea/gitea/assets/2114189/069f02d0-76ad-4052-8a80-700d7e501d40) ### Org Team Repo ![image](https://github.com/go-gitea/gitea/assets/2114189/dc8d6106-bb6b-4f60-83ac-06cb28df3ab5) ### Release List ![image](https://github.com/go-gitea/gitea/assets/2114189/0845e8a5-d1a9-487a-9d25-3c200ad54c17) ### User Setting Application Token Scope ![image](https://github.com/go-gitea/gitea/assets/2114189/fffbde27-432b-49c6-827e-17b8cd3457ff) Co-authored-by: Giteabot --- templates/admin/notice.tmpl | 2 +- templates/admin/stacktrace-row.tmpl | 2 +- templates/org/home.tmpl | 4 ++-- templates/org/team/repositories.tmpl | 2 +- templates/repo/home.tmpl | 2 +- templates/repo/issue/filters.tmpl | 10 +++++----- templates/repo/issue/labels/labels_selector_field.tmpl | 2 +- templates/repo/issue/milestone/select_menu.tmpl | 2 +- templates/repo/issue/new_form.tmpl | 4 ++-- .../issue/view_content/pull_merge_instruction.tmpl | 4 ++-- templates/repo/issue/view_content/sidebar.tmpl | 6 +++--- templates/repo/release/list.tmpl | 6 +++--- templates/repo/settings/options.tmpl | 2 +- templates/user/settings/applications.tmpl | 8 ++++---- web_src/css/helpers.css | 4 ---- web_src/css/repo/release-tag.css | 5 ++++- web_src/js/components/DashboardRepoList.vue | 2 +- 17 files changed, 33 insertions(+), 34 deletions(-) diff --git a/templates/admin/notice.tmpl b/templates/admin/notice.tmpl index 5cd617a0b5..ac5851f853 100644 --- a/templates/admin/notice.tmpl +++ b/templates/admin/notice.tmpl @@ -17,7 +17,7 @@ {{range .Notices}} -
+
{{.ID}} {{$.locale.Tr .TrStr}} {{.Description}} diff --git a/templates/admin/stacktrace-row.tmpl b/templates/admin/stacktrace-row.tmpl index 15e51e4aca..b0e282bcc7 100644 --- a/templates/admin/stacktrace-row.tmpl +++ b/templates/admin/stacktrace-row.tmpl @@ -27,7 +27,7 @@
-
+
{{svg "octicon-code" 16}}{{.Description}}{{if gt .Count 1}} * {{.Count}}{{end}}
diff --git a/templates/org/home.tmpl b/templates/org/home.tmpl index 0bd744d2b8..72be948650 100644 --- a/templates/org/home.tmpl +++ b/templates/org/home.tmpl @@ -57,7 +57,7 @@ {{if .NumMembers}}

{{.locale.Tr "org.members"}} - {{.NumMembers}} {{svg "octicon-chevron-right"}} + {{.NumMembers}} {{svg "octicon-chevron-right"}}

{{$isMember := .IsOrganizationMember}} @@ -71,7 +71,7 @@ {{if .IsOrganizationMember}}
{{.locale.Tr "org.teams"}} - {{.Org.NumTeams}} {{svg "octicon-chevron-right"}} + {{.Org.NumTeams}} {{svg "octicon-chevron-right"}}
{{range .Teams}} diff --git a/templates/org/team/repositories.tmpl b/templates/org/team/repositories.tmpl index ab5f6c6e75..65eb64cb54 100644 --- a/templates/org/team/repositories.tmpl +++ b/templates/org/team/repositories.tmpl @@ -10,7 +10,7 @@ {{$canAddRemove := and $.IsOrganizationOwner (not $.Team.IncludesAllRepositories)}} {{if $canAddRemove}}
-
+ {{.CsrfTokenHtml}}
-
- {{.locale.Tr "settings.at_least_one_permission"}} -
- + {{/* Fomantic ".ui.form .warning.message" is hidden by default, so put the warning message out of the form*/}} +
+ {{.locale.Tr "settings.at_least_one_permission"}} +
{{if .EnableOAuth2}} diff --git a/web_src/css/helpers.css b/web_src/css/helpers.css index 17a89ebfb7..bd1fb992ac 100644 --- a/web_src/css/helpers.css +++ b/web_src/css/helpers.css @@ -2,14 +2,10 @@ Gitea's tailwind-style CSS helper classes have `gt-` prefix. Gitea's private styles use `g-` prefix. */ -.gt-db { display: block !important; } .gt-df { display: flex !important; } -.gt-di { display: inline !important; } -.gt-dif { display: inline-flex !important; } .gt-dib { display: inline-block !important; } .gt-ac { align-items: center !important; } .gt-jc { justify-content: center !important; } -.gt-js { justify-content: flex-start !important; } .gt-je { justify-content: flex-end !important; } .gt-sb { justify-content: space-between !important; } .gt-fc { flex-direction: column !important; } diff --git a/web_src/css/repo/release-tag.css b/web_src/css/repo/release-tag.css index 33ff2cddd9..70925f5a0e 100644 --- a/web_src/css/repo/release-tag.css +++ b/web_src/css/repo/release-tag.css @@ -23,8 +23,11 @@ .repository.releases #release-list > li .meta { margin-top: 4px; - text-align: right; position: relative; + text-align: right; + display: flex; + flex-direction: column; + gap: 1em; } .repository.releases #release-list > li .detail { diff --git a/web_src/js/components/DashboardRepoList.vue b/web_src/js/components/DashboardRepoList.vue index bc6cc6a2c4..f1ea937f05 100644 --- a/web_src/js/components/DashboardRepoList.vue +++ b/web_src/js/components/DashboardRepoList.vue @@ -17,7 +17,7 @@
- +