From 75e2e5c736687ae1897cf760a432b572feed56f5 Mon Sep 17 00:00:00 2001 From: silverwind Date: Sat, 23 Mar 2024 22:22:15 +0100 Subject: [PATCH] Migrate font-size helpers to tailwind (#30029) Migrate `gt-font-*` to `tw-text-*` All tailwind-original class names are also available and render like they would with 16px root font size. We currently have root font size at 14px, but I would like to eventually migrate us to 16px so that the tailwind docs apply to us unchangend and because 16px is the recommended root font size for web pages in general. Also the number 16 is much better dividable than 14 so will result in more integers. --- tailwind.config.js | 18 ++++++++++++++++++ templates/org/header.tmpl | 2 +- templates/repo/header.tmpl | 2 +- templates/repo/home.tmpl | 4 ++-- templates/user/dashboard/feeds.tmpl | 2 +- .../user/notification/notification_div.tmpl | 4 ++-- web_src/css/helpers.css | 8 -------- web_src/js/components/RepoContributors.vue | 2 +- 8 files changed, 26 insertions(+), 16 deletions(-) diff --git a/tailwind.config.js b/tailwind.config.js index 01fc9ee24c5..0754ab36318 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -73,5 +73,23 @@ export default { semibold: 'var(--font-weight-semibold)', bold: 'var(--font-weight-bold)', }, + fontSize: { // not using `rem` units because our root is currently 14px + 'xs': '12px', + 'sm': '14px', + 'base': '16px', + 'lg': '18px', + 'xl': '20px', + '2xl': '24px', + '3xl': '30px', + '4xl': '36px', + '5xl': '48px', + '6xl': '60px', + '7xl': '72px', + '8xl': '96px', + '9xl': '128px', + ...Object.fromEntries(Array.from({length: 100}, (_, i) => { + return [`${i}`, `${i === 0 ? '0' : `${i}px`}`]; + })), + }, }, }; diff --git a/templates/org/header.tmpl b/templates/org/header.tmpl index 204ba7e3c18..81373aa75c6 100644 --- a/templates/org/header.tmpl +++ b/templates/org/header.tmpl @@ -7,7 +7,7 @@ {{if .Org.Visibility.IsLimited}}{{ctx.Locale.Tr "org.settings.visibility.limited_shortname"}}{{end}} {{if .Org.Visibility.IsPrivate}}{{ctx.Locale.Tr "org.settings.visibility.private_shortname"}}{{end}} - + {{if .EnableFeed}} {{svg "octicon-rss" 24}} diff --git a/templates/repo/header.tmpl b/templates/repo/header.tmpl index 54f72943e45..002d06c23a3 100644 --- a/templates/repo/header.tmpl +++ b/templates/repo/header.tmpl @@ -7,7 +7,7 @@ {{template "repo/icon" .}}
-
+
{{.Owner.Name}}/{{.Name}}
diff --git a/templates/repo/home.tmpl b/templates/repo/home.tmpl index 5a9e02ca60d..40732db94a3 100644 --- a/templates/repo/home.tmpl +++ b/templates/repo/home.tmpl @@ -6,7 +6,7 @@ {{template "repo/code/recently_pushed_new_branches" .}} {{if and (not .HideRepoInfo) (not .IsBlame)}}
-
+
{{$description := .Repository.DescriptionHTML $.Context}} {{if $description}}{{$description | RenderCodeBlock}}{{else if .IsRepositoryAdmin}}{{ctx.Locale.Tr "repo.no_desc"}}{{end}} {{.Repository.Website}} @@ -29,7 +29,7 @@
{{range .Topics}}{{.Name}}{{end}} - {{if and .Permission.IsAdmin (not .Repository.IsArchived)}}{{end}} + {{if and .Permission.IsAdmin (not .Repository.IsArchived)}}{{end}}
{{end}} {{if and .Permission.IsAdmin (not .Repository.IsArchived)}} diff --git a/templates/user/dashboard/feeds.tmpl b/templates/user/dashboard/feeds.tmpl index 382b0d4542b..c58d7e22d79 100644 --- a/templates/user/dashboard/feeds.tmpl +++ b/templates/user/dashboard/feeds.tmpl @@ -107,7 +107,7 @@ {{(.GetIssueTitle ctx) | RenderEmoji $.Context | RenderCodeBlock}} {{$comment := index .GetIssueInfos 1}} {{if $comment}} -
{{RenderMarkdownToHtml ctx $comment}}
+
{{RenderMarkdownToHtml ctx $comment}}
{{end}} {{else if .GetOpType.InActions "merge_pull_request"}}
{{index .GetIssueInfos 1}}
diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl index 371da129cef..da5a920fd1c 100644 --- a/templates/user/notification/notification_div.tmpl +++ b/templates/user/notification/notification_div.tmpl @@ -44,13 +44,13 @@ {{end}}
-
+
{{.Repository.FullName}} {{if .Issue}}#{{.Issue.Index}}{{end}} {{if eq .Status 3}} {{svg "octicon-pin" 13 "text blue gt-mt-1 gt-ml-2"}} {{end}}
-
+
{{if .Issue}} {{.Issue.Title | RenderEmoji $.Context | RenderCodeBlock}} diff --git a/web_src/css/helpers.css b/web_src/css/helpers.css index dd32c3fb315..2d6bd576aee 100644 --- a/web_src/css/helpers.css +++ b/web_src/css/helpers.css @@ -163,14 +163,6 @@ Gitea's private styles use `g-` prefix. .gt-gap-y-4 { row-gap: 1rem !important; } .gt-gap-y-5 { row-gap: 2rem !important; } -.gt-font-12 { font-size: 12px !important } -.gt-font-13 { font-size: 13px !important } -.gt-font-14 { font-size: 14px !important } -.gt-font-15 { font-size: 15px !important } -.gt-font-16 { font-size: 16px !important } -.gt-font-17 { font-size: 17px !important } -.gt-font-18 { font-size: 18px !important } - /* gt-hidden must win all other "display: xxx !important" classes to get the chance to "hide" an element. do not use: diff --git a/web_src/js/components/RepoContributors.vue b/web_src/js/components/RepoContributors.vue index adaf7f28f1d..6de68a4aec7 100644 --- a/web_src/js/components/RepoContributors.vue +++ b/web_src/js/components/RepoContributors.vue @@ -384,7 +384,7 @@ export default {

{{ contributor.name }}

-

+

{{ contributor.total_commits.toLocaleString() }} {{ locale.contributionType.commits }} {{ contributor.total_additions.toLocaleString() }}++