Start cleaning the messy ".ui.left / .ui.right", improve label list page, fix stackable menu (#24393)

Since 2015/2016, there is a global pollution: ".ui.left" / ".ui.right".

Fomantic UI doesn't work this way, it just conflicts with many Fomantic
definitions.

This PR starts the cleaning work of such techinical debts.

And, the "label list" page has been quite messy for long time, for
example, why "li" appears in "div" ......

And fix #24296

<details>


![image](https://user-images.githubusercontent.com/2114189/235051281-54c5374c-b5fd-4b5f-9aa2-02d4bb2d9112.png)


![image](https://user-images.githubusercontent.com/2114189/235055703-2ba042e0-4db7-4e63-8646-02f390d496b5.png)


![image](https://user-images.githubusercontent.com/2114189/235056310-4f6ffdc2-5758-4927-8fb8-314d9fb72a6b.png)


![image](https://user-images.githubusercontent.com/2114189/235058400-dab1c9ec-3325-4671-8345-aee6b0b68042.png)


![image](https://user-images.githubusercontent.com/2114189/235058424-85509532-b9bc-43ad-b00f-a87184c60f22.png)

</details>
This commit is contained in:
wxiaoguang 2023-04-29 19:35:59 +08:00 committed by GitHub
parent 72e956b79a
commit 5a5ab8ef5a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
19 changed files with 168 additions and 162 deletions

View File

@ -23,51 +23,51 @@
<tbody> <tbody>
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.delete_inactive_accounts"}}</td> <td>{{.locale.Tr "admin.dashboard.delete_inactive_accounts"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="delete_inactive_accounts">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="delete_inactive_accounts">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.delete_repo_archives"}}</td> <td>{{.locale.Tr "admin.dashboard.delete_repo_archives"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="delete_repo_archives">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="delete_repo_archives">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.delete_missing_repos"}}</td> <td>{{.locale.Tr "admin.dashboard.delete_missing_repos"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="delete_missing_repos">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="delete_missing_repos">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.git_gc_repos"}}</td> <td>{{.locale.Tr "admin.dashboard.git_gc_repos"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="git_gc_repos">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="git_gc_repos">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
{{if and (not .SSH.Disabled) (not .SSH.StartBuiltinServer)}} {{if and (not .SSH.Disabled) (not .SSH.StartBuiltinServer)}}
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.resync_all_sshkeys"}}<br> <td>{{.locale.Tr "admin.dashboard.resync_all_sshkeys"}}<br>
{{.locale.Tr "admin.dashboard.resync_all_sshkeys.desc"}}</td> {{.locale.Tr "admin.dashboard.resync_all_sshkeys.desc"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="resync_all_sshkeys">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="resync_all_sshkeys">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.resync_all_sshprincipals"}}<br> <td>{{.locale.Tr "admin.dashboard.resync_all_sshprincipals"}}<br>
{{.locale.Tr "admin.dashboard.resync_all_sshprincipals.desc"}}</td> {{.locale.Tr "admin.dashboard.resync_all_sshprincipals.desc"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="resync_all_sshprincipals">{{svg "octicon-play" 16}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="resync_all_sshprincipals">{{svg "octicon-play" 16}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
{{end}} {{end}}
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.resync_all_hooks"}}</td> <td>{{.locale.Tr "admin.dashboard.resync_all_hooks"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="resync_all_hooks">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="resync_all_hooks">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.reinit_missing_repos"}}</td> <td>{{.locale.Tr "admin.dashboard.reinit_missing_repos"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="reinit_missing_repos">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="reinit_missing_repos">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.sync_external_users"}}</td> <td>{{.locale.Tr "admin.dashboard.sync_external_users"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="sync_external_users">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="sync_external_users">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.repo_health_check"}}</td> <td>{{.locale.Tr "admin.dashboard.repo_health_check"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="repo_health_check">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="repo_health_check">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
<tr> <tr>
<td>{{.locale.Tr "admin.dashboard.delete_generated_repository_avatars"}}</td> <td>{{.locale.Tr "admin.dashboard.delete_generated_repository_avatars"}}</td>
<td><button type="submit" class="ui green button right" name="op" value="delete_generated_repository_avatars">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td> <td class="text right"><button type="submit" class="ui green button" name="op" value="delete_generated_repository_avatars">{{svg "octicon-play"}} {{.locale.Tr "admin.dashboard.operation_run"}}</button></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>

View File

@ -1,5 +1,5 @@
<footer role="group" aria-label="{{.locale.Tr "aria.footer"}}"> <footer class="page-footer" role="group" aria-label="{{.locale.Tr "aria.footer"}}">
<div class="ui left" role="contentinfo" aria-label="{{.locale.Tr "aria.footer.software"}}"> <div class="left-links" role="contentinfo" aria-label="{{.locale.Tr "aria.footer.software"}}">
<a target="_blank" rel="noopener noreferrer" href="https://gitea.io">{{.locale.Tr "powered_by" "Gitea"}}</a> <a target="_blank" rel="noopener noreferrer" href="https://gitea.io">{{.locale.Tr "powered_by" "Gitea"}}</a>
{{if (or .ShowFooterVersion .PageIsAdmin)}} {{if (or .ShowFooterVersion .PageIsAdmin)}}
{{.locale.Tr "version"}}: {{.locale.Tr "version"}}:
@ -14,7 +14,7 @@
{{.locale.Tr "template"}}{{if .TemplateName}} {{.TemplateName}}{{end}}: <strong>{{call .TemplateLoadTimes}}</strong> {{.locale.Tr "template"}}{{if .TemplateName}} {{.TemplateName}}{{end}}: <strong>{{call .TemplateLoadTimes}}</strong>
{{end}} {{end}}
</div> </div>
<div class="ui right links" role="group" aria-label="{{.locale.Tr "aria.footer.links"}}"> <div class="right-links" role="group" aria-label="{{.locale.Tr "aria.footer.links"}}">
<div class="ui dropdown upward language"> <div class="ui dropdown upward language">
<span>{{svg "octicon-globe"}} {{.locale.LangName}}</span> <span>{{svg "octicon-globe"}} {{.locale.LangName}}</span>
<div class="menu language-menu"> <div class="menu language-menu">

View File

@ -83,7 +83,7 @@
{{template "custom/body_inner_pre" .}} {{template "custom/body_inner_pre" .}}
{{if not .PageIsInstall}} {{if not .PageIsInstall}}
<div class="ui top secondary stackable main menu following bar light no-vertical-tabs"> <div class="ui top secondary stackable main menu following bar light">
{{template "base/head_navbar" .}} {{template "base/head_navbar" .}}
</div><!-- end bar --> </div><!-- end bar -->
{{end}} {{end}}

View File

@ -50,12 +50,12 @@
<div class="ui bottom attached table segment members"> <div class="ui bottom attached table segment members">
{{range .Invites}} {{range .Invites}}
<div class="item"> <div class="item">
{{.Email}}
<form action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/remove_invite" method="post"> <form action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/remove_invite" method="post">
{{$.CsrfTokenHtml}} {{$.CsrfTokenHtml}}
<input type="hidden" name="iid" value="{{.ID}}"> <input type="hidden" name="iid" value="{{.ID}}">
<button class="ui red button right">{{$.locale.Tr "org.members.remove"}}</button> <button class="ui red button gt-float-right">{{$.locale.Tr "org.members.remove"}}</button>
</form> </form>
{{.Email}}
</div> </div>
{{end}} {{end}}
</div> </div>

View File

@ -25,8 +25,8 @@
</div> </div>
<div class="inline ui field right"> <div class="inline ui field right">
<form class="ui form" id="repo-multiple-form" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/repositories" method="post"> <form class="ui form" id="repo-multiple-form" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/repositories" method="post">
<button class="ui red button delete-button right" data-modal-id="org-team-remove-all-repo" data-url="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/removeall">{{.locale.Tr "remove_all"}}</button> <button class="ui green button add-all-button" data-modal-id="org-team-add-all-repo" data-url="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/addall">{{.locale.Tr "add_all"}}</button>
<button class="ui green button add-all-button right" data-modal-id="org-team-add-all-repo" data-url="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/addall">{{.locale.Tr "add_all"}}</button> <button class="ui red button delete-button" data-modal-id="org-team-remove-all-repo" data-url="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/repo/removeall">{{.locale.Tr "remove_all"}}</button>
</form> </form>
</div> </div>
</div> </div>

View File

@ -3,7 +3,7 @@
{{.locale.Tr "repo.cite_this_repo"}} {{.locale.Tr "repo.cite_this_repo"}}
</div> </div>
<div class="content"> <div class="content">
<div class="ui stackable secondary menu mobile--margin-between-items mobile--no-negative-margins no-vertical-tabs"> <div class="ui stackable secondary menu">
<div class="fitted item"> <div class="fitted item">
<div class="ui action input" id="citation-panel"> <div class="ui action input" id="citation-panel">
{{template "repo/cite/cite_buttons" .}} {{template "repo/cite/cite_buttons" .}}

View File

@ -9,11 +9,11 @@
<b>{{$resolveDoer.Name}}</b> {{$.locale.Tr "repo.issues.review.resolved_by"}} <b>{{$resolveDoer.Name}}</b> {{$.locale.Tr "repo.issues.review.resolved_by"}}
</div> </div>
<div> <div>
<button id="show-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="ui tiny right labeled button show-outdated gt-df gt-ac"> <button id="show-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="ui tiny labeled button show-outdated gt-df gt-ac">
{{svg "octicon-unfold" 16 "gt-mr-3"}} {{svg "octicon-unfold" 16 "gt-mr-3"}}
{{$.locale.Tr "repo.issues.review.show_resolved"}} {{$.locale.Tr "repo.issues.review.show_resolved"}}
</button> </button>
<button id="hide-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="ui tiny right labeled button hide-outdated gt-df gt-ac gt-hidden"> <button id="hide-outdated-{{(index .comments 0).ID}}" data-comment="{{(index .comments 0).ID}}" class="ui tiny labeled button hide-outdated gt-df gt-ac gt-hidden">
{{svg "octicon-fold" 16 "gt-mr-3"}} {{svg "octicon-fold" 16 "gt-mr-3"}}
{{$.locale.Tr "repo.issues.review.hide_resolved"}} {{$.locale.Tr "repo.issues.review.hide_resolved"}}
</button> </button>

View File

@ -151,7 +151,7 @@
{{end}} {{end}}
<div class="ui tabs container"> <div class="ui tabs container">
{{if not (or .Repository.IsBeingCreated .Repository.IsBroken)}} {{if not (or .Repository.IsBeingCreated .Repository.IsBroken)}}
<div class="ui tabular stackable menu navbar"> <div class="ui tabular menu navbar gt-overflow-x-auto gt-overflow-y-hidden">
{{if .Permission.CanRead $.UnitTypeCode}} {{if .Permission.CanRead $.UnitTypeCode}}
<a class="{{if .PageIsViewCode}}active {{end}}item" href="{{.RepoLink}}{{if (ne .BranchName .Repository.DefaultBranch)}}/src/{{.BranchNameSubURL}}{{end}}"> <a class="{{if .PageIsViewCode}}active {{end}}item" href="{{.RepoLink}}{{if (ne .BranchName .Repository.DefaultBranch)}}/src/{{.BranchNameSubURL}}{{end}}">
{{svg "octicon-code"}} {{.locale.Tr "repo.code"}} {{svg "octicon-code"}} {{.locale.Tr "repo.code"}}
@ -236,20 +236,16 @@
{{template "custom/extra_tabs" .}} {{template "custom/extra_tabs" .}}
{{if .Permission.IsAdmin}} {{if .Permission.IsAdmin}}
<div class="right menu"> <a class="{{if .PageIsRepoSettings}}active {{end}}right item" href="{{.RepoLink}}/settings">
<a class="{{if .PageIsRepoSettings}}active {{end}}item" href="{{.RepoLink}}/settings"> {{svg "octicon-tools"}} {{.locale.Tr "repo.settings"}}
{{svg "octicon-tools"}} {{.locale.Tr "repo.settings"}} </a>
</a>
</div>
{{end}} {{end}}
</div> </div>
{{else if .Permission.IsAdmin}} {{else if .Permission.IsAdmin}}
<div class="ui tabular stackable menu navbar"> <div class="ui tabular menu navbar gt-overflow-x-auto gt-overflow-y-hidden">
<div class="right menu"> <a class="{{if .PageIsRepoSettings}}active {{end}}right item" href="{{.RepoLink}}/settings">
<a class="{{if .PageIsRepoSettings}}active {{end}}item" href="{{.RepoLink}}/settings"> {{svg "octicon-tools"}} {{.locale.Tr "repo.settings"}}
{{svg "octicon-tools"}} {{.locale.Tr "repo.settings"}} </a>
</a>
</div>
</div> </div>
{{end}} {{end}}
</div> </div>

View File

@ -1,58 +1,59 @@
<h4 class="ui top attached header"> <h4 class="ui top attached header">
{{.locale.Tr "repo.issues.label_count" .NumLabels}} {{.locale.Tr "repo.issues.label_count" .NumLabels}}
<div class="ui right"> <div class="ui right">
<div class="ui right floated secondary filter menu"> <div class="ui right floated secondary filter menu">
<!-- Sort --> <!-- Sort -->
<div class="ui dropdown type jump item"> <div class="ui dropdown type jump item">
<span class="text"> <span class="text">
{{.locale.Tr "repo.issues.filter_sort"}} {{.locale.Tr "repo.issues.filter_sort"}}
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
</span> </span>
<div class="menu"> <div class="menu">
<a class="{{if or (eq .SortType "alphabetically") (not .SortType)}}active {{end}}item" href="{{$.Link}}?sort=alphabetically&state={{$.State}}">{{.locale.Tr "repo.issues.label.filter_sort.alphabetically"}}</a> <a class="{{if or (eq .SortType "alphabetically") (not .SortType)}}active {{end}}item" href="{{$.Link}}?sort=alphabetically&state={{$.State}}">{{.locale.Tr "repo.issues.label.filter_sort.alphabetically"}}</a>
<a class="{{if eq .SortType "reversealphabetically"}}active {{end}}item" href="{{$.Link}}?sort=reversealphabetically&state={{$.State}}">{{.locale.Tr "repo.issues.label.filter_sort.reverse_alphabetically"}}</a> <a class="{{if eq .SortType "reversealphabetically"}}active {{end}}item" href="{{$.Link}}?sort=reversealphabetically&state={{$.State}}">{{.locale.Tr "repo.issues.label.filter_sort.reverse_alphabetically"}}</a>
<a class="{{if eq .SortType "leastissues"}}active {{end}}item" href="{{$.Link}}?sort=leastissues&state={{$.State}}">{{.locale.Tr "repo.milestones.filter_sort.least_issues"}}</a> <a class="{{if eq .SortType "leastissues"}}active {{end}}item" href="{{$.Link}}?sort=leastissues&state={{$.State}}">{{.locale.Tr "repo.milestones.filter_sort.least_issues"}}</a>
<a class="{{if eq .SortType "mostissues"}}active {{end}}item" href="{{$.Link}}?sort=mostissues&state={{$.State}}">{{.locale.Tr "repo.milestones.filter_sort.most_issues"}}</a> <a class="{{if eq .SortType "mostissues"}}active {{end}}item" href="{{$.Link}}?sort=mostissues&state={{$.State}}">{{.locale.Tr "repo.milestones.filter_sort.most_issues"}}</a>
</div>
</div> </div>
</div> </div>
</div> <!-- filter menu --> </div>
</div> <!-- filter menu -->
</h4> </h4>
<div class="ui attached segment"> <div class="ui attached segment">
<div class="labelspage"> {{if and (not $.PageIsOrgSettingsLabels) (or $.CanWriteIssues $.CanWritePulls) (eq .NumLabels 0) (not $.Repository.IsArchived)}}
{{if and (not $.PageIsOrgSettingsLabels) (or $.CanWriteIssues $.CanWritePulls) (eq .NumLabels 0) (not $.Repository.IsArchived)}} {{template "repo/issue/labels/label_load_template" .}}
{{template "repo/issue/labels/label_load_template" .}} <div class="ui divider"></div>
<div class="ui divider"></div> {{else if and ($.PageIsOrgSettingsLabels) (eq .NumLabels 0)}}
{{else if and ($.PageIsOrgSettingsLabels) (eq .NumLabels 0)}} {{template "repo/issue/labels/label_load_template" .}}
{{template "repo/issue/labels/label_load_template" .}} <div class="ui divider"></div>
{{end}} {{end}}
<ul class="issue-label-list">
{{range .Labels}} {{range .Labels}}
<li class="item"> <li class="item">
<div class="ui grid middle aligned"> <div class="label-title">
<div class="eight wide column"> {{RenderLabel $.Context .}}
{{RenderLabel $.Context .}} {{if .Description}}<br><small class="desc">{{.Description | RenderEmoji $.Context}}</small>{{end}}
{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji $.Context}}</small>{{end}}
</div>
<div class="five wide column">
{{if $.PageIsOrgSettingsLabels}}
<a class="ui left open-issues" href="{{AppSubUrl}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
{{else}}
<a class="ui left open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
{{end}}
</div>
<div class="three wide column">
{{if and (not $.PageIsOrgSettingsLabels) (not $.Repository.IsArchived) (or $.CanWriteIssues $.CanWritePulls)}}
<a class="ui right delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
<a class="ui right edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
{{else if $.PageIsOrgSettingsLabels}}
<a class="ui right delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
<a class="ui right edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
{{end}}
</div>
</div> </div>
</li> <div class="label-issues">
{{if $.PageIsOrgSettingsLabels}}
<a class="open-issues" href="{{AppSubUrl}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
{{else}}
<a class="open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenIssues}}</a>
{{end}}
</div>
<div class="label-operation">
{{if and (not $.PageIsOrgSettingsLabels) (not $.Repository.IsArchived) (or $.CanWriteIssues $.CanWritePulls)}}
<a class="edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
<a class="delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
{{else if $.PageIsOrgSettingsLabels}}
<a class="edit-label-button" href="#" data-id="{{.ID}}" data-title="{{.Name}}" {{if .Exclusive}}data-exclusive{{end}} data-num-issues="{{.NumIssues}}" data-description="{{.Description}}" data-color={{.Color}}>{{svg "octicon-pencil"}} {{$.locale.Tr "repo.issues.label_edit"}}</a>
<a class="delete-button" href="#" data-url="{{$.Link}}/delete" data-id="{{.ID}}">{{svg "octicon-trash"}} {{$.locale.Tr "repo.issues.label_delete"}}</a>
{{end}}
</div>
</li>
{{end}} {{end}}
{{if and (not .PageIsOrgSettingsLabels) (.OrgLabels)}} {{if and (not .PageIsOrgSettingsLabels) (.OrgLabels)}}
<li class="item"> <li class="item">
<div class="ui grid middle aligned"> <div class="ui grid middle aligned">
@ -64,25 +65,19 @@
</div> </div>
</div> </div>
</li> </li>
{{if (not $.PageIsOrgSettingsLabels)}}
<div class="orglabel"> {{range .OrgLabels}}
{{range .OrgLabels}} <li class="item org-label">
<li class="item"> <div class="label-title">
<div class="ui grid middle aligned"> {{RenderLabel $.Context .}}
<div class="nine wide column"> {{if .Description}}<br><small class="desc">{{.Description | RenderEmoji $.Context}}</small>{{end}}
{{RenderLabel $.Context .}}
{{if .Description}}<br><small class="desc">{{.Description | RenderEmoji $.Context}}</small>{{end}}
</div>
<div class="four wide column">
<a class="ui left open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenRepoIssues}}</a>
</div>
<div class="three wide column">
</div>
</div>
</li>
{{end}}
</div> </div>
<div class="label-issues">
<a class="open-issues" href="{{$.RepoLink}}/issues?labels={{.ID}}">{{svg "octicon-issue-opened"}} {{$.locale.Tr "repo.issues.label_open_issues" .NumOpenRepoIssues}}</a>
</div>
<div class="label-operation"></div>
</li>
{{end}} {{end}}
{{end}} {{end}}
</div> </ul>
</div> </div>

View File

@ -34,7 +34,7 @@
{{template "repo/issue/openclose" .}} {{template "repo/issue/openclose" .}}
</div> </div>
<div class="ten wide right aligned column"> <div class="ten wide right aligned column">
<div class="ui secondary filter stackable menu labels"> <div class="ui secondary filter menu labels gt-overflow-x-auto gt-overflow-y-hidden">
<!-- Label --> <!-- Label -->
<div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item label-filter" style="margin-left: auto"> <div class="ui {{if not .Labels}}disabled{{end}} dropdown jump item label-filter" style="margin-left: auto">
<span class="text"> <span class="text">

View File

@ -1,5 +1,5 @@
<div class="dashboard-navbar"> <div class="dashboard-navbar">
<div class="ui secondary stackable menu"> <div class="ui secondary stackable menu g-menu-stackable-scrollable">
<div class="item"> <div class="item">
<div class="ui floating dropdown jump"> <div class="ui floating dropdown jump">
<span class="text truncated-item-container"> <span class="text truncated-item-container">

View File

@ -1472,10 +1472,12 @@ img.ui.avatar,
color: var(--color-gold) !important; color: var(--color-gold) !important;
} }
/* FIXME: this is a serious pollution, do not use this for "float: left" anymore */
.ui.left:not(.action) { .ui.left:not(.action) {
float: left; float: left;
} }
/* FIXME: this is a serious pollution, do not use this for "float: right" anymore */
.ui.right:not(.action) { .ui.right:not(.action) {
float: right; float: right;
} }
@ -2660,38 +2662,6 @@ table th[data-sortt-desc] .svg {
background: var(--color-secondary-dark-1) !important; background: var(--color-secondary-dark-1) !important;
} }
.labelspage {
list-style: none;
padding-top: 0;
}
.labelspage .item {
border-bottom: 1px solid var(--color-secondary);
border-top: none;
}
.labelspage .item a {
font-size: 12px;
padding-right: 10px;
color: var(--color-text-light);
}
.labelspage .item a:hover {
color: var(--color-primary-light-2);
}
.labelspage .item a.open-issues {
margin-right: 30px;
}
.labelspage .item:last-child {
border-bottom: none;
padding-bottom: 0;
}
.labelspage .orglabel {
opacity: 0.7;
}
/* https://github.com/go-gitea/gitea/pull/11486 */ /* https://github.com/go-gitea/gitea/pull/11486 */
.ui.sub.header { .ui.sub.header {
@ -2796,21 +2766,16 @@ table th[data-sortt-desc] .svg {
height: 15px; height: 15px;
} }
@media (max-width: 767px) { .g-menu-stackable-scrollable {
.ui.stackable.menu:not(.no-vertical-tabs) { overflow-y: hidden;
overflow-y: hidden; overflow-x: auto;
overflow-x: auto; }
flex-direction: row;
flex-wrap: nowrap !important; @media (max-width: 767.98px) {
} /* also respect Fomantic's "stackable" definition, use the same breakpoint to reset our styles */
.ui.stackable.menu:not(.no-vertical-tabs) .item { .g-menu-stackable-scrollable {
width: initial !important; overflow-x: unset;
} overflow-y: unset;
.ui.stackable.menu:not(.no-vertical-tabs) > .dropdown.item {
position: initial;
}
.ui.stackable.menu:not(.no-vertical-tabs) .menu {
flex-direction: row;
} }
} }

View File

@ -68,16 +68,22 @@ Gitea's private styles use `g-` prefix.
.gt-cursor-default { cursor: default !important; } .gt-cursor-default { cursor: default !important; }
.gt-invisible { visibility: hidden !important; } .gt-invisible { visibility: hidden !important; }
.gt-items-start { align-items: flex-start !important; } .gt-items-start { align-items: flex-start !important; }
.gt-overflow-x-scroll { overflow-x: scroll !important; }
.gt-pointer-events-none { pointer-events: none !important; } .gt-pointer-events-none { pointer-events: none !important; }
.gt-relative { position: relative !important; } .gt-relative { position: relative !important; }
.gt-whitespace-nowrap { white-space: nowrap !important; } .gt-whitespace-nowrap { white-space: nowrap !important; }
.gt-whitespace-pre { white-space: pre !important; } .gt-whitespace-pre { white-space: pre !important; }
.gt-whitespace-pre-wrap { white-space: pre-wrap !important; } .gt-whitespace-pre-wrap { white-space: pre-wrap !important; }
.gt-overflow-x-auto { overflow-x: auto !important; }
.gt-overflow-x-scroll { overflow-x: scroll !important; }
.gt-overflow-y-hidden { overflow-y: hidden !important; }
.gt-w-screen { width: 100vw !important; } .gt-w-screen { width: 100vw !important; }
.gt-h-screen { height: 100vh !important; } .gt-h-screen { height: 100vh !important; }
.gt-float-left { float: left !important; }
.gt-float-right { float: right !important; }
.gt-rounded { border-radius: var(--border-radius) !important; } .gt-rounded { border-radius: var(--border-radius) !important; }
.gt-rounded-top { border-radius: var(--border-radius) var(--border-radius) 0 0 !important; } .gt-rounded-top { border-radius: var(--border-radius) var(--border-radius) 0 0 !important; }
.gt-rounded-bottom { border-radius: 0 0 var(--border-radius) var(--border-radius) !important; } .gt-rounded-bottom { border-radius: 0 0 var(--border-radius) var(--border-radius) !important; }

View File

@ -43,39 +43,38 @@
color: var(--color-green); color: var(--color-green);
} }
footer { .page-footer {
display: flex;
background-color: var(--color-footer); background-color: var(--color-footer);
border-top: 1px solid var(--color-secondary); border-top: 1px solid var(--color-secondary);
line-height: 39px; line-height: 39px;
flex-basis: 40px;
color: var(--color-text-light);
padding: 0 20px; padding: 0 20px;
} }
footer .right.links { .page-footer .left-links {
flex: 1;
}
.page-footer .right-links {
min-width: 180px; /* make sure the menu dropdown doesn't overflow horizontally when language name is short */ min-width: 180px; /* make sure the menu dropdown doesn't overflow horizontally when language name is short */
} }
footer .right.links > a { .page-footer .right-links > a {
border-left: 1px solid var(--color-secondary-dark-1); border-left: 1px solid var(--color-secondary-dark-1);
padding-left: 8px; padding-left: 8px;
margin-left: 5px; margin-left: 5px;
} }
footer .ui.dropdown.language .menu { .page-footer .ui.dropdown.language .menu {
height: 500px; height: 500px;
max-height: calc(100vh - 60px); max-height: calc(100vh - 60px);
overflow-y: auto; overflow-y: auto;
margin-bottom: 10px; margin-bottom: 10px;
} }
@media (max-width: 880px) { @media (max-width: 880px) {
footer .ui.left, .page-footer {
footer .ui.right {
width: 100%;
display: block; display: block;
text-align: center; text-align: center;
float: none;
} }
} }

View File

@ -30,9 +30,10 @@
@import "./install.css"; @import "./install.css";
@import "./form.css"; @import "./form.css";
@import "./repository.css"; @import "./repository.css";
@import "./repository-release-tag.css"; @import "./repository/release-tag.css";
@import "./repository/issue-label.css";
@import "./editor.css"; @import "./editor.css";
@import "./editor-markdown.css"; @import "./editor/combomarkdowneditor.css";
@import "./organization.css"; @import "./organization.css";
@import "./user.css"; @import "./user.css";
@import "./dashboard.css"; @import "./dashboard.css";

View File

@ -160,7 +160,7 @@
} }
.repository .ui.tabs.divider { .repository .ui.tabs.divider {
margin-top: 0; margin-top: -1px;
margin-bottom: 20px; margin-bottom: 20px;
} }

View File

@ -0,0 +1,44 @@
.issue-label-list {
list-style: none;
padding: 0;
margin: 0;
}
.issue-label-list .item {
border-bottom: 1px solid var(--color-secondary);
display: flex;
padding: 1em 0;
margin: 0;
}
.issue-label-list .item:first-child {
padding-top: 0;
}
.issue-label-list .item:last-child {
border-bottom: none;
padding-bottom: 0;
}
.issue-label-list .item .label-title {
width: 33%;
}
.issue-label-list .item .label-issues {
width: 33%;
}
.issue-label-list .item .label-operation {
width: 33%;
text-align: right;
}
.issue-label-list .item a {
font-size: 12px;
padding-right: 10px;
color: var(--color-text-light);
}
.issue-label-list .item.org-label {
opacity: 0.7;
}