Migrate `gap` helpers to tailwind (#30034)

Commands ran:

```sh
perl -p -i -e 's#gt-gap-0#tw-gap-0#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-1#tw-gap-0.5#g' web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-2#tw-gap-1#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-3#tw-gap-2#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-4#tw-gap-4#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-5#tw-gap-8#g'   web_src/js/**/* templates/**/*

perl -p -i -e 's#gt-gap-x-0#tw-gap-x-0#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-x-1#tw-gap-x-0.5#g' web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-x-2#tw-gap-x-1#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-x-3#tw-gap-x-2#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-x-4#tw-gap-x-4#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-x-5#tw-gap-x-8#g'   web_src/js/**/* templates/**/*

perl -p -i -e 's#gt-gap-y-0#tw-gap-y-0#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-y-1#tw-gap-y-0.5#g' web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-y-2#tw-gap-y-1#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-y-3#tw-gap-y-2#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-y-4#tw-gap-y-4#g'   web_src/js/**/* templates/**/*
perl -p -i -e 's#gt-gap-y-5#tw-gap-y-8#g'   web_src/js/**/* templates/**/*
This commit is contained in:
silverwind 2024-03-24 15:31:35 +01:00 committed by GitHub
parent 2d281704de
commit 90a4f9a49e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
19 changed files with 27 additions and 48 deletions

View File

@ -103,7 +103,7 @@
<td><span>{{ctx.Locale.Tr "admin.users.never_login"}}</span></td>
{{end}}
<td>
<div class="tw-flex gt-gap-3">
<div class="tw-flex tw-gap-2">
<a href="{{$.Link}}/{{.ID}}" data-tooltip-content="{{ctx.Locale.Tr "admin.users.details"}}">{{svg "octicon-person"}}</a>
<a href="{{$.Link}}/{{.ID}}/edit" data-tooltip-content="{{ctx.Locale.Tr "edit"}}">{{svg "octicon-pencil"}}</a>
</div>

View File

@ -7,7 +7,7 @@
{{if .Org.Visibility.IsLimited}}<span class="ui large basic horizontal label">{{ctx.Locale.Tr "org.settings.visibility.limited_shortname"}}</span>{{end}}
{{if .Org.Visibility.IsPrivate}}<span class="ui large basic horizontal label">{{ctx.Locale.Tr "org.settings.visibility.private_shortname"}}</span>{{end}}
</span>
<span class="tw-flex tw-items-center gt-gap-2 tw-ml-auto tw-text-16 tw-whitespace-nowrap">
<span class="tw-flex tw-items-center tw-gap-1 tw-ml-auto tw-text-16 tw-whitespace-nowrap">
{{if .EnableFeed}}
<a class="ui basic label button gt-mr-0" href="{{.Org.HomeLink}}.rss" data-tooltip-content="{{ctx.Locale.Tr "rss_feed"}}">
{{svg "octicon-rss" 24}}

View File

@ -9,7 +9,7 @@
{{template "org/team/navbar" .}}
{{if .IsOrganizationOwner}}
<div class="ui attached segment">
<form class="ui form ignore-dirty tw-flex tw-flex-wrap gt-gap-3" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/add" method="post">
<form class="ui form ignore-dirty tw-flex tw-flex-wrap tw-gap-2" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/add" method="post">
{{.CsrfTokenHtml}}
<input type="hidden" name="uid" value="{{.SignedUser.ID}}">
<div id="search-user-box" class="ui search gt-mr-3"{{if .IsEmailInviteEnabled}} data-allow-email="true" data-allow-email-description="{{ctx.Locale.Tr "org.teams.invite_team_member" $.Team.Name}}"{{end}}>

View File

@ -9,7 +9,7 @@
{{template "org/team/navbar" .}}
{{$canAddRemove := and $.IsOrganizationOwner (not $.Team.IncludesAllRepositories)}}
{{if $canAddRemove}}
<div class="ui attached segment tw-flex tw-flex-wrap gt-gap-3">
<div class="ui attached segment tw-flex tw-flex-wrap tw-gap-2">
<form class="ui form ignore-dirty tw-flex-1 tw-flex" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/add" method="post">
{{.CsrfTokenHtml}}
<div id="search-repo-box" data-uid="{{.Org.ID}}" class="ui search">

View File

@ -1,7 +1,7 @@
{{$showFileTree := (and (not .DiffNotAvailable) (gt .Diff.NumFiles 1))}}
<div>
<div class="diff-detail-box diff-box">
<div class="tw-flex tw-items-center tw-flex-wrap gt-gap-3 gt-ml-1">
<div class="tw-flex tw-items-center tw-flex-wrap tw-gap-2 gt-ml-1">
{{if $showFileTree}}
<button class="diff-toggle-file-tree-button not-mobile btn interact-fg" data-show-text="{{ctx.Locale.Tr "repo.diff.show_file_tree"}}" data-hide-text="{{ctx.Locale.Tr "repo.diff.hide_file_tree"}}">
{{/* the icon meaning is reversed here, "octicon-sidebar-collapse" means show the file tree */}}
@ -111,7 +111,7 @@
{{$isReviewFile := and $.IsSigned $.PageIsPullFiles (not $.IsArchived) $.IsShowingAllCommits}}
<div class="diff-file-box diff-box file-content {{TabSizeClass $.Editorconfig $file.Name}} gt-mt-0" id="diff-{{$file.NameHash}}" data-old-filename="{{$file.OldName}}" data-new-filename="{{$file.Name}}" {{if or ($file.ShouldBeHidden) (not $isExpandable)}}data-folded="true"{{end}}>
<h4 class="diff-file-header sticky-2nd-row ui top attached header tw-font-normal tw-flex tw-items-center tw-justify-between tw-flex-wrap">
<div class="diff-file-name tw-flex tw-items-center gt-gap-2 tw-flex-wrap">
<div class="diff-file-name tw-flex tw-items-center tw-gap-1 tw-flex-wrap">
<button class="fold-file btn interact-bg gt-p-2{{if not $isExpandable}} tw-invisible{{end}}">
{{if $file.ShouldBeHidden}}
{{svg "octicon-chevron-right" 18}}
@ -144,7 +144,7 @@
<span class="gt-ml-4 gt-mono">{{ctx.Locale.Tr ($file.ModeTranslationKey $file.Mode)}}</span>
{{end}}
</div>
<div class="diff-file-header-actions tw-flex tw-items-center gt-gap-2 tw-flex-wrap">
<div class="diff-file-header-actions tw-flex tw-items-center tw-gap-1 tw-flex-wrap">
{{if $showFileViewToggle}}
<div class="ui compact icon buttons">
<button class="ui tiny basic button file-view-toggle" data-toggle-selector="#diff-source-{{$file.NameHash}}" data-tooltip-content="{{ctx.Locale.Tr "repo.file_view_source"}}">{{svg "octicon-code"}}</button>

View File

@ -9,7 +9,7 @@
<div class="conversation-holder" data-path="{{$comment.TreePath}}" data-side="{{if lt $comment.Line 0}}left{{else}}right{{end}}" data-idx="{{$comment.UnsignedLine}}">
{{if $resolved}}
<div class="ui attached header resolved-placeholder tw-flex tw-items-center tw-justify-between">
<div class="ui grey text tw-flex tw-items-center tw-flex-wrap gt-gap-2">
<div class="ui grey text tw-flex tw-items-center tw-flex-wrap tw-gap-1">
{{svg "octicon-check" 16 "icon gt-mr-2"}}
<b>{{$resolveDoer.Name}}</b> {{ctx.Locale.Tr "repo.issues.review.resolved_by"}}
{{if $invalid}}
@ -22,7 +22,7 @@
</a>
{{end}}
</div>
<div class="tw-flex tw-items-center gt-gap-3">
<div class="tw-flex tw-items-center tw-gap-2">
<button id="show-outdated-{{$comment.ID}}" data-comment="{{$comment.ID}}" class="ui tiny labeled button show-outdated tw-flex tw-items-center">
{{svg "octicon-unfold" 16 "gt-mr-3"}}
{{ctx.Locale.Tr "repo.issues.review.show_resolved"}}

View File

@ -27,7 +27,7 @@
</div>
{{end}}
</div>
<div class="tw-flex tw-items-center tw-flex-wrap gt-gap-2" id="repo-topics">
<div class="tw-flex tw-items-center tw-flex-wrap tw-gap-1" id="repo-topics">
{{range .Topics}}<a class="ui repo-topic large label topic gt-m-0" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=1">{{.Name}}</a>{{end}}
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}<button id="manage_topic" class="btn interact-fg tw-text-12">{{ctx.Locale.Tr "repo.topic.manage_topics"}}</button>{{end}}
</div>
@ -61,7 +61,7 @@
{{end}}
{{template "repo/sub_menu" .}}
<div class="repo-button-row">
<div class="tw-flex tw-items-center tw-flex-wrap gt-gap-y-3">
<div class="tw-flex tw-items-center tw-flex-wrap tw-gap-y-2">
{{template "repo/branch_dropdown" dict "root" . "ContainerClasses" "gt-mr-2"}}
{{if and .CanCompareOrPull .IsViewBranch (not .Repository.IsArchived)}}
{{$cmpBranch := ""}}

View File

@ -26,9 +26,9 @@
{{.Milestone.RenderedContent}}
</div>
{{end}}
<div class="tw-flex tw-flex-col gt-gap-3">
<div class="tw-flex tw-flex-col tw-gap-2">
<progress class="milestone-progress-big" value="{{.Milestone.Completeness}}" max="100"></progress>
<div class="tw-flex gt-gap-4">
<div class="tw-flex tw-gap-4">
<div classs="tw-flex tw-items-center">
{{$closedDate:= TimeSinceUnix .Milestone.ClosedDateUnix ctx.Locale}}
{{if .IsClosed}}

View File

@ -58,7 +58,7 @@
<span class="text">{{svg "octicon-people" 20 "gt-mr-3"}}{{$.Issue.Repo.OwnerName}}/{{.Team.Name}}</span>
{{end}}
</div>
<div class="tw-flex tw-items-center gt-gap-3">
<div class="tw-flex tw-items-center tw-gap-2">
{{if (and $.Permission.IsAdmin (or (eq .Review.Type 1) (eq .Review.Type 3)) (not $.Issue.IsClosed))}}
<a href="#" class="ui muted icon tw-flex tw-items-center show-modal" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dismiss_review"}}" data-modal="#dismiss-review-modal-{{.Review.ID}}">
{{svg "octicon-x" 20}}
@ -106,7 +106,7 @@
{{.OriginalAuthor}}
</a>
</div>
<div class="tw-flex tw-items-center gt-gap-3">
<div class="tw-flex tw-items-center tw-gap-2">
{{svg (printf "octicon-%s" .Type.Icon) 16 (printf "text %s" (.HTMLTypeColorName))}}
</div>
</div>
@ -310,7 +310,7 @@
<div class="ui mini modal issue-start-time-modal">
<div class="header">{{ctx.Locale.Tr "repo.issues.add_time"}}</div>
<div class="content">
<form method="post" id="add_time_manual_form" action="{{.Issue.Link}}/times/add" class="ui input fluid gt-gap-3">
<form method="post" id="add_time_manual_form" action="{{.Issue.Link}}/times/add" class="ui input fluid tw-gap-2">
{{$.CsrfTokenHtml}}
<input placeholder='{{ctx.Locale.Tr "repo.issues.add_time_hours"}}' type="number" name="hours">
<input placeholder='{{ctx.Locale.Tr "repo.issues.add_time_minutes"}}' type="number" name="minutes" class="ui compact">

View File

@ -15,7 +15,7 @@
{{ctx.Locale.Tr "repo.pulls.tab_files"}}
<span class="ui small label">{{if .NumFiles}}{{.NumFiles}}{{else}}-{{end}}</span>
</a>
<span class="item tw-ml-auto gt-pr-0 tw-font-bold tw-flex tw-items-center gt-gap-3">
<span class="item tw-ml-auto gt-pr-0 tw-font-bold tw-flex tw-items-center tw-gap-2">
<span><span class="text green">{{if .Diff.TotalAddition}}+{{.Diff.TotalAddition}}{{end}}</span> <span class="text red">{{if .Diff.TotalDeletion}}-{{.Diff.TotalDeletion}}{{end}}</span></span>
<span class="diff-stats-bar">
<div class="diff-stats-add-bar" style="width: {{Eval 100 "*" .Diff.TotalAddition "/" "(" .Diff.TotalAddition "+" .Diff.TotalDeletion "+" 0.0 ")"}}%"></div>

View File

@ -55,7 +55,7 @@
</div>
<div id="oauth2-login-navigator" class="gt-py-2">
<div class="tw-flex tw-flex-col tw-justify-center">
<div id="oauth2-login-navigator-inner" class="tw-flex tw-flex-col tw-flex-wrap tw-items-center gt-gap-3">
<div id="oauth2-login-navigator-inner" class="tw-flex tw-flex-col tw-flex-wrap tw-items-center tw-gap-2">
{{range $provider := .OAuth2Providers}}
<a class="{{$provider.Name}} ui button tw-flex tw-items-center tw-justify-center gt-py-3 tw-w-full oauth-login-link" href="{{AppSubUrl}}/user/oauth2/{{$provider.DisplayName}}">
{{$provider.IconHTML 28}}

View File

@ -60,7 +60,7 @@
</div>
<div id="oauth2-login-navigator" class="gt-py-2">
<div class="tw-flex tw-flex-col tw-justify-center">
<div id="oauth2-login-navigator-inner" class="tw-flex tw-flex-col tw-flex-wrap tw-items-center gt-gap-3">
<div id="oauth2-login-navigator-inner" class="tw-flex tw-flex-col tw-flex-wrap tw-items-center tw-gap-2">
{{range $provider := .OAuth2Providers}}
<a class="{{$provider.Name}} ui button tw-flex tw-items-center tw-justify-center gt-py-3 tw-w-full oauth-login-link" href="{{AppSubUrl}}/user/oauth2/{{$provider.DisplayName}}">
{{$provider.IconHTML 28}}

View File

@ -10,7 +10,7 @@
{{template "base/alert" .}}
<p>{{ctx.Locale.Tr "webauthn_sign_in"}}</p>
</div>
<div class="ui attached segment tw-flex tw-items-center tw-justify-center gt-gap-2 gt-py-3">
<div class="ui attached segment tw-flex tw-items-center tw-justify-center tw-gap-1 gt-py-3">
<div class="is-loading tw-w-[40px] tw-h-[40px]"></div>
{{ctx.Locale.Tr "webauthn_press_button"}}
</div>

View File

@ -4,7 +4,7 @@
<div class="flex-item-leading">
{{ctx.AvatarUtils.AvatarByAction .}}
</div>
<div class="flex-item-main gt-gap-3">
<div class="flex-item-main tw-gap-2">
<div>
{{if gt .ActUser.ID 0}}
<a href="{{AppSubUrl}}/{{(.GetActUserName ctx) | PathEscape}}" title="{{.GetActDisplayNameTitle ctx}}">{{.GetActDisplayName ctx}}</a>
@ -84,7 +84,7 @@
{{$push := ActionContent2Commits .}}
{{$repoLink := (.GetRepoLink ctx)}}
{{$repo := .Repo}}
<div class="tw-flex tw-flex-col gt-gap-2">
<div class="tw-flex tw-flex-col tw-gap-1">
{{range $push.Commits}}
{{$commitLink := printf "%s/commit/%s" $repoLink .Sha1}}
<div class="flex-text-block">

View File

@ -35,7 +35,7 @@
</div>
{{else}}
{{range $notification := .Notifications}}
<div class="notifications-item tw-flex tw-items-center tw-flex-wrap gt-gap-3 gt-p-3" id="notification_{{.ID}}" data-status="{{.Status}}">
<div class="notifications-item tw-flex tw-items-center tw-flex-wrap tw-gap-2 gt-p-3" id="notification_{{.ID}}" data-status="{{.Status}}">
<div class="notifications-icon gt-ml-3 gt-mr-2 tw-self-start gt-mt-2">
{{if .Issue}}
{{template "shared/issueicon" .Issue}}
@ -67,7 +67,7 @@
{{TimeSinceUnix .UpdatedUnix ctx.Locale}}
{{end}}
</div>
<div class="notifications-buttons tw-items-center tw-justify-end gt-gap-2 gt-px-2">
<div class="notifications-buttons tw-items-center tw-justify-end tw-gap-1 gt-px-2">
{{if ne .Status 3}}
<form action="{{AppSubUrl}}/notifications/status" method="post">
{{$.CsrfTokenHtml}}

View File

@ -46,7 +46,7 @@
<form action="{{AppSubUrl}}/user/settings/account/email" class="ui form" method="post">
{{$.CsrfTokenHtml}}
<input name="_method" type="hidden" value="NOTIFICATION">
<div class="tw-flex tw-flex-wrap gt-gap-3">
<div class="tw-flex tw-flex-wrap tw-gap-2">
<div class="ui selection dropdown">
<input name="preference" type="hidden" value="{{.EmailNotificationsPreference}}">
{{svg "octicon-triangle-down" 14 "dropdown icon"}}

View File

@ -142,27 +142,6 @@ Gitea's private styles use `g-` prefix.
.gt-py-4 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.gt-py-5 { padding-top: 2rem !important; padding-bottom: 2rem !important; }
.gt-gap-0 { gap: 0 !important; }
.gt-gap-1 { gap: .125rem !important; }
.gt-gap-2 { gap: .25rem !important; }
.gt-gap-3 { gap: .5rem !important; }
.gt-gap-4 { gap: 1rem !important; }
.gt-gap-5 { gap: 2rem !important; }
.gt-gap-x-0 { column-gap: 0 !important; }
.gt-gap-x-1 { column-gap: .125rem !important; }
.gt-gap-x-2 { column-gap: .25rem !important; }
.gt-gap-x-3 { column-gap: .5rem !important; }
.gt-gap-x-4 { column-gap: 1rem !important; }
.gt-gap-x-5 { column-gap: 2rem !important; }
.gt-gap-y-0 { row-gap: 0 !important; }
.gt-gap-y-1 { row-gap: .125rem !important; }
.gt-gap-y-2 { row-gap: .25rem !important; }
.gt-gap-y-3 { row-gap: .5rem !important; }
.gt-gap-y-4 { row-gap: 1rem !important; }
.gt-gap-y-5 { row-gap: 2rem !important; }
/*
gt-hidden must win all other "display: xxx !important" classes to get the chance to "hide" an element.
do not use:

View File

@ -240,7 +240,7 @@ export default {
@click.meta.exact="commitClicked(commit.id, true)"
@click.shift.exact.stop.prevent="commitClickedShift(commit)"
>
<div class="tw-flex-1 tw-flex tw-flex-col gt-gap-2">
<div class="tw-flex-1 tw-flex tw-flex-col tw-gap-1">
<div class="gt-ellipsis commit-list-summary">
{{ commit.summary }}
</div>

View File

@ -384,7 +384,7 @@ export default {
<h4 v-else class="contributor-name">
{{ contributor.name }}
</h4>
<p class="tw-text-12 tw-flex gt-gap-2">
<p class="tw-text-12 tw-flex tw-gap-1">
<strong v-if="contributor.total_commits">{{ contributor.total_commits.toLocaleString() }} {{ locale.contributionType.commits }}</strong>
<strong v-if="contributor.total_additions" class="text green">{{ contributor.total_additions.toLocaleString() }}++ </strong>
<strong v-if="contributor.total_deletions" class="text red">