mirror of
https://codeberg.org/forgejo/forgejo.git
synced 2024-12-04 11:18:19 +00:00
Improve ellipsis buttons (#17773)
* Improve ellipsis buttons - Remove icon font usage - Add aria-expanded attribute * rename function to match Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
parent
e595986458
commit
9450410ff7
6 changed files with 18 additions and 7 deletions
|
@ -67,7 +67,7 @@
|
|||
{{end}}
|
||||
</span>
|
||||
{{if IsMultilineCommitMessage .Message}}
|
||||
<button class="basic compact mini ui icon button commit-button"><i class="ellipsis horizontal icon"></i></button>
|
||||
<button class="ui button ellipsis-button" aria-expanded="false">...</button>
|
||||
{{end}}
|
||||
{{template "repo/commit_statuses" dict "Status" .Status "Statuses" .Statuses "root" $}}
|
||||
{{if IsMultilineCommitMessage .Message}}
|
||||
|
|
|
@ -49,7 +49,7 @@
|
|||
{{ $commitLink:= printf "%s/commit/%s" $.comment.Issue.PullRequest.BaseRepo.Link (PathEscape .ID.String) }}
|
||||
<span class="mono commit-summary {{if gt .ParentCount 1}} grey text{{end}}" title="{{.Summary}}">{{RenderCommitMessageLinkSubject .Message ($.comment.Issue.PullRequest.BaseRepo.Link|Escape) $commitLink $.comment.Issue.PullRequest.BaseRepo.ComposeMetas}}</span>
|
||||
{{if IsMultilineCommitMessage .Message}}
|
||||
<button class="basic compact mini ui icon button commit-button"><i class="ellipsis horizontal icon"></i></button>
|
||||
<button class="ui button ellipsis-button" aria-expanded="false">...</button>
|
||||
{{end}}
|
||||
{{if IsMultilineCommitMessage .Message}}
|
||||
<pre class="commit-body" style="display: none;">{{RenderCommitBody .Message ($.comment.Issue.PullRequest.BaseRepo.Link|Escape) $.comment.Issue.PullRequest.BaseRepo.ComposeMetas}}</pre>
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
{{ $commitLink:= printf "%s/commit/%s" .RepoLink (PathEscape .LatestCommit.ID.String) }}
|
||||
<span class="grey commit-summary" title="{{.LatestCommit.Summary}}"><span class="message-wrapper">{{RenderCommitMessageLinkSubject .LatestCommit.Message $.RepoLink $commitLink $.Repository.ComposeMetas}}</span>
|
||||
{{if IsMultilineCommitMessage .LatestCommit.Message}}
|
||||
<button class="basic compact mini ui icon button commit-button"><i class="ellipsis horizontal icon"></i></button>
|
||||
<button class="ui button ellipsis-button" aria-expanded="false">...</button>
|
||||
<pre class="commit-body" style="display: none;">{{RenderCommitBody .LatestCommit.Message $.RepoLink $.Repository.ComposeMetas}}</pre>
|
||||
{{end}}
|
||||
</span>
|
||||
|
|
|
@ -1,9 +1,11 @@
|
|||
const {csrfToken} = window.config;
|
||||
|
||||
export function initRepoCommitButton() {
|
||||
$('.commit-button').on('click', function (e) {
|
||||
export function initRepoEllipsisButton() {
|
||||
$('.ellipsis-button').on('click', function (e) {
|
||||
e.preventDefault();
|
||||
const expanded = $(this).attr('aria-expanded') === 'true';
|
||||
$(this).parent().find('.commit-body').toggle();
|
||||
$(this).attr('aria-expanded', String(!expanded));
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
@ -36,7 +36,7 @@ import {
|
|||
initRepoPullRequestMergeInstruction,
|
||||
initRepoPullRequestReview,
|
||||
} from './features/repo-issue.js';
|
||||
import {initRepoCommitButton, initRepoCommitLastCommitLoader} from './features/repo-commit.js';
|
||||
import {initRepoEllipsisButton, initRepoCommitLastCommitLoader} from './features/repo-commit.js';
|
||||
import {
|
||||
initFootLanguageMenu,
|
||||
initGlobalButtonClickOnEnter,
|
||||
|
@ -132,7 +132,7 @@ $(document).ready(() => {
|
|||
initRepoBranchButton();
|
||||
initRepoCodeView();
|
||||
initRepoCommentForm();
|
||||
initRepoCommitButton();
|
||||
initRepoEllipsisButton();
|
||||
initRepoCommitLastCommitLoader();
|
||||
initRepoDiffConversationForm();
|
||||
initRepoDiffFileViewToggle();
|
||||
|
|
|
@ -2104,6 +2104,15 @@ table th[data-sortt-desc] {
|
|||
display: flex !important;
|
||||
}
|
||||
|
||||
.ellipsis-button {
|
||||
padding: 0 5px 8px !important;
|
||||
display: inline-block !important;
|
||||
user-select: none !important;
|
||||
font-weight: 600 !important;
|
||||
line-height: 6px !important;
|
||||
vertical-align: middle !important;
|
||||
}
|
||||
|
||||
.truncated-item-name {
|
||||
line-height: 2em;
|
||||
white-space: nowrap;
|
||||
|
|
Loading…
Reference in a new issue