diff options
21 files changed, 116 insertions, 128 deletions
diff --git a/templates/devtest/fomantic-dropdown.tmpl b/templates/devtest/fomantic-dropdown.tmpl index d41a161e86..a10dc890ce 100644 --- a/templates/devtest/fomantic-dropdown.tmpl +++ b/templates/devtest/fomantic-dropdown.tmpl @@ -75,12 +75,12 @@ <h2>Selection</h2> <div> {{/* the "selection" class is optional, it will be added by JS automatically */}} - <select class="ui dropdown selection ellipsis-items-nowrap"> + <select class="ui dropdown selection ellipsis-text-items"> <option>a</option> <option>abcdefuvwxyz</option> <option>loooooooooooooooooooooooooooooooooooooooooooooooooooooooooong</option> </select> - <select class="ui dropdown ellipsis-items-nowrap tw-max-w-[8em]"> + <select class="ui dropdown ellipsis-text-items tw-max-w-[8em]"> <option>loooooooooooooooooooooooooooooooooooooooooooooooooooooooooong</option> <option>abcdefuvwxyz</option> <option>a</option> diff --git a/templates/repo/actions/workflow_dispatch.tmpl b/templates/repo/actions/workflow_dispatch.tmpl index 55fe122419..540bbe9162 100644 --- a/templates/repo/actions/workflow_dispatch.tmpl +++ b/templates/repo/actions/workflow_dispatch.tmpl @@ -10,7 +10,7 @@ <span class="ui inline required field"> <label>{{ctx.Locale.Tr "actions.workflow.from_ref"}}:</label> </span> - <div class="ui inline field dropdown button select-branch branch-selector-dropdown ellipsis-items-nowrap"> + <div class="ui inline field dropdown button select-branch branch-selector-dropdown ellipsis-text-items"> <input type="hidden" name="ref" hx-sync="this:replace" hx-target="#runWorkflowDispatchModalInputs" hx-swap="innerHTML" hx-get="{{$.Link}}/workflow-dispatch-inputs?workflow={{$.CurWorkflow}}" hx-trigger="change" value="refs/heads/{{index .Branches 0}}"> {{svg "octicon-git-branch" 14}} <div class="default text">{{index .Branches 0}}</div> diff --git a/templates/repo/branch_dropdown.tmpl b/templates/repo/branch_dropdown.tmpl index f679b8744b..261d0ea409 100644 --- a/templates/repo/branch_dropdown.tmpl +++ b/templates/repo/branch_dropdown.tmpl @@ -46,7 +46,7 @@ Search "repo/branch_dropdown" in the template directory to find all occurrences. data-enable-feed="{{ctx.RootData.EnableFeed}}" > {{/* show dummy elements before Vue componment is mounted, this code must match the code in BranchTagSelector.vue */}} - <div class="ui dropdown custom branch-selector-dropdown ellipsis-items-nowrap"> + <div class="ui dropdown custom branch-selector-dropdown ellipsis-text-items"> <div class="ui button branch-dropdown-button"> <span class="flex-text-block gt-ellipsis"> {{if not .DropdownFixedText}} diff --git a/templates/repo/create.tmpl b/templates/repo/create.tmpl index a90c26b423..ada7e0c092 100644 --- a/templates/repo/create.tmpl +++ b/templates/repo/create.tmpl @@ -12,23 +12,23 @@ <div id="create-repo-error-message" class="ui negative message tw-text-center tw-hidden"></div> <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection dropdown" id="repo_owner_dropdown"> + <div class="ui selection dropdown ellipsis-text-items" id="repo_owner_dropdown"> <input type="hidden" name="uid" value="{{.ContextUser.ID}}"> - <span class="text truncated-item-name"></span> + <span class="text"></span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}" + <div class="item" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}" {{if not .CanCreateRepoInDoer}} data-create-repo-disallowed-prompt="{{ctx.Locale.TrN .MaxCreationLimit "repo.form.reach_limit_of_creation_1" "repo.form.reach_limit_of_creation_n" .MaxCreationLimitOfDoer}}" {{end}} > {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar . 28 "mini"}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/issue/branch_selector_field.tmpl b/templates/repo/issue/branch_selector_field.tmpl index 9183b7b46a..c8b67490ac 100644 --- a/templates/repo/issue/branch_selector_field.tmpl +++ b/templates/repo/issue/branch_selector_field.tmpl @@ -14,7 +14,7 @@ Still needs to figure out: */}} {{if and (not .Issue.IsPull) (not .PageIsComparePull)}} <input id="ref_selector" name="ref" type="hidden" value="{{.Reference}}"> -<div class="ui dropdown select-branch branch-selector-dropdown ellipsis-items-nowrap {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}}" +<div class="ui dropdown select-branch branch-selector-dropdown ellipsis-text-items {{if not .HasIssuesOrPullsWritePermission}}disabled{{end}}" data-no-results="{{ctx.Locale.Tr "no_results_found"}}" {{if and .Issue (or .IsIssueWriter .HasIssuesOrPullsWritePermission)}}data-url-update-issueref="{{$.RepoLink}}/issues/{{.Issue.Index}}/ref"{{end}} > diff --git a/templates/repo/issue/view_content/reference_issue_dialog.tmpl b/templates/repo/issue/view_content/reference_issue_dialog.tmpl index f6ffeef26d..c5b860d48e 100644 --- a/templates/repo/issue/view_content/reference_issue_dialog.tmpl +++ b/templates/repo/issue/view_content/reference_issue_dialog.tmpl @@ -7,7 +7,7 @@ {{.CsrfTokenHtml}} <div class="field"> <label><strong>{{ctx.Locale.Tr "repository"}}</strong></label> - <div class="ui search selection dropdown issue_reference_repository_search ellipsis-items-nowrap"> + <div class="ui search selection dropdown issue_reference_repository_search ellipsis-text-items"> <div class="default text gt-ellipsis">{{.Repository.FullName}}</div> <div class="menu"></div> </div> diff --git a/templates/repo/migrate/codebase.tmpl b/templates/repo/migrate/codebase.tmpl index d4ca269f02..f4de8ff236 100644 --- a/templates/repo/migrate/codebase.tmpl +++ b/templates/repo/migrate/codebase.tmpl @@ -60,22 +60,22 @@ <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu" title="{{.SignedUser.Name}}"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}"> + <div class="item" data-value="{{.SignedUser.ID}}"> {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar . 28 "mini"}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/migrate/codecommit.tmpl b/templates/repo/migrate/codecommit.tmpl index 53ca7dda3d..275a2aef09 100644 --- a/templates/repo/migrate/codecommit.tmpl +++ b/templates/repo/migrate/codecommit.tmpl @@ -61,22 +61,22 @@ <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu" title="{{.SignedUser.Name}}"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}"> + <div class="item" data-value="{{.SignedUser.ID}}"> {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar . 28 "mini"}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/migrate/git.tmpl b/templates/repo/migrate/git.tmpl index 3f447f76eb..41139d4fd6 100644 --- a/templates/repo/migrate/git.tmpl +++ b/templates/repo/migrate/git.tmpl @@ -34,22 +34,22 @@ <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu" title="{{.SignedUser.Name}}"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}"> + <div class="item" data-value="{{.SignedUser.ID}}"> {{ctx.AvatarUtils.Avatar .SignedUser}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar .}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/migrate/gitbucket.tmpl b/templates/repo/migrate/gitbucket.tmpl index 559988951b..c89aa6c744 100644 --- a/templates/repo/migrate/gitbucket.tmpl +++ b/templates/repo/migrate/gitbucket.tmpl @@ -76,22 +76,22 @@ <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu" title="{{.SignedUser.Name}}"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}"> + <div class="item" data-value="{{.SignedUser.ID}}"> {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar . 28 "mini"}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/migrate/gitea.tmpl b/templates/repo/migrate/gitea.tmpl index 3d692129d5..55cf61a77f 100644 --- a/templates/repo/migrate/gitea.tmpl +++ b/templates/repo/migrate/gitea.tmpl @@ -72,22 +72,22 @@ <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu" title="{{.SignedUser.Name}}"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}"> + <div class="item" data-value="{{.SignedUser.ID}}"> {{ctx.AvatarUtils.Avatar .SignedUser}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar .}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/migrate/github.tmpl b/templates/repo/migrate/github.tmpl index 850a2b3c71..86b585b861 100644 --- a/templates/repo/migrate/github.tmpl +++ b/templates/repo/migrate/github.tmpl @@ -74,22 +74,22 @@ <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu" title="{{.SignedUser.Name}}"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}"> + <div class="item" data-value="{{.SignedUser.ID}}"> {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar . 28 "mini"}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/migrate/gitlab.tmpl b/templates/repo/migrate/gitlab.tmpl index 9bafa122f1..edd69f0027 100644 --- a/templates/repo/migrate/gitlab.tmpl +++ b/templates/repo/migrate/gitlab.tmpl @@ -71,22 +71,22 @@ <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu" title="{{.SignedUser.Name}}"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}"> + <div class="item" data-value="{{.SignedUser.ID}}"> {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar . 28 "mini"}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/migrate/gogs.tmpl b/templates/repo/migrate/gogs.tmpl index 0495ce67fb..9149c43239 100644 --- a/templates/repo/migrate/gogs.tmpl +++ b/templates/repo/migrate/gogs.tmpl @@ -74,22 +74,22 @@ <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu" title="{{.SignedUser.Name}}"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}"> + <div class="item" data-value="{{.SignedUser.ID}}"> {{ctx.AvatarUtils.Avatar .SignedUser}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar .}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/migrate/onedev.tmpl b/templates/repo/migrate/onedev.tmpl index 55945154ef..a25ccf9438 100644 --- a/templates/repo/migrate/onedev.tmpl +++ b/templates/repo/migrate/onedev.tmpl @@ -61,22 +61,22 @@ <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu" title="{{.SignedUser.Name}}"> - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}"> + <div class="item" data-value="{{.SignedUser.ID}}"> {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar . 28 "mini"}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> diff --git a/templates/repo/pulls/fork.tmpl b/templates/repo/pulls/fork.tmpl index 879e5328f2..9a6c44077f 100644 --- a/templates/repo/pulls/fork.tmpl +++ b/templates/repo/pulls/fork.tmpl @@ -10,24 +10,24 @@ {{.CsrfTokenHtml}} <div class="inline required field {{if .Err_Owner}}error{{end}}"> <label>{{ctx.Locale.Tr "repo.owner"}}</label> - <div class="ui selection owner dropdown"> + <div class="ui selection owner dropdown ellipsis-text-items"> <input type="hidden" id="uid" name="uid" value="{{.ContextUser.ID}}" required> - <span class="text truncated-item-container" title="{{.ContextUser.Name}}"> + <span class="text" title="{{.ContextUser.Name}}"> {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + {{.ContextUser.ShortName 40}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu"> {{if .CanForkToUser}} - <div class="item truncated-item-container" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}"> + <div class="item" data-value="{{.SignedUser.ID}}" title="{{.SignedUser.Name}}"> {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + {{.SignedUser.ShortName 40}} </div> {{end}} {{range .Orgs}} - <div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> + <div class="item" data-value="{{.ID}}" title="{{.Name}}"> {{ctx.AvatarUtils.Avatar . 28 "mini"}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + {{.ShortName 40}} </div> {{end}} </div> @@ -52,10 +52,10 @@ </div> <div class="inline field"> <label>{{ctx.Locale.Tr "repo.fork_branch"}}</label> - <div class="ui selection dropdown ellipsis-items-nowrap"> + <div class="ui selection dropdown ellipsis-text-items"> <input type="hidden" id="fork_single_branch" name="fork_single_branch" value="" required> <div class="text" title="{{ctx.Locale.Tr "repo.all_branches"}}"> - <span class="truncated-item-name">{{ctx.Locale.Tr "repo.all_branches"}}</span> + {{ctx.Locale.Tr "repo.all_branches"}} </div> {{svg "octicon-triangle-down" 14 "dropdown icon"}} <div class="menu"> diff --git a/templates/repo/settings/githooks.tmpl b/templates/repo/settings/githooks.tmpl index 1a603f9fe8..9b17af1406 100644 --- a/templates/repo/settings/githooks.tmpl +++ b/templates/repo/settings/githooks.tmpl @@ -4,18 +4,14 @@ {{ctx.Locale.Tr "repo.settings.githooks"}} </h4> <div class="ui attached segment"> - <div class="ui list"> + <div class="ui list flex-items-block"> + <div class="item"><span>{{ctx.Locale.Tr "repo.settings.githooks_desc"}}</span></div> + {{range .Hooks}} <div class="item"> - {{ctx.Locale.Tr "repo.settings.githooks_desc"}} + <span class="text {{if .IsActive}}green{{else}}grey{{end}}">{{svg "octicon-dot-fill" 22}}</span> + <span class="gt-ellipsis tw-flex-1">{{.Name}}</span> + <a class="muted tw-p-2" href="{{$.RepoLink}}/settings/hooks/git/{{.Name|PathEscape}}">{{svg "octicon-pencil"}}</a> </div> - {{range .Hooks}} - <div class="item truncated-item-container"> - <span class="text {{if .IsActive}}green{{else}}grey{{end}} tw-mr-2">{{svg "octicon-dot-fill" 22}}</span> - <span class="text truncate tw-flex-1 tw-mr-2">{{.Name}}</span> - <a class="muted tw-float-right tw-p-2" href="{{$.RepoLink}}/settings/hooks/git/{{.Name|PathEscape}}"> - {{svg "octicon-pencil"}} - </a> - </div> {{end}} </div> </div> diff --git a/templates/repo/settings/webhook/base_list.tmpl b/templates/repo/settings/webhook/base_list.tmpl index 36e75a7eb5..a63771b97e 100644 --- a/templates/repo/settings/webhook/base_list.tmpl +++ b/templates/repo/settings/webhook/base_list.tmpl @@ -8,14 +8,12 @@ </div> </h4> <div class="ui attached segment"> - <div class="ui list"> - <div class="item"> - {{.Description}} - </div> + <div class="ui list flex-items-block"> + <div class="item"><span>{{.Description}}</span></div> {{range .Webhooks}} - <div class="item truncated-item-container"> - <span class="text {{if eq .LastStatus 1}}green{{else if eq .LastStatus 2}}red{{else}}grey{{end}} tw-mr-2">{{svg "octicon-dot-fill" 22}}</span> - <div class="text truncate tw-flex-1 tw-mr-2"> + <div class="item"> + <span class="text {{if eq .LastStatus 1}}green{{else if eq .LastStatus 2}}red{{else}}grey{{end}}">{{svg "octicon-dot-fill" 22}}</span> + <div class="gt-ellipsis tw-flex-1"> <a title="{{.URL}}" href="{{$.BaseLink}}/{{.ID}}">{{.URL}}</a> </div> <a class="muted tw-p-2" href="{{$.BaseLink}}/{{.ID}}">{{svg "octicon-pencil"}}</a> diff --git a/templates/user/dashboard/navbar.tmpl b/templates/user/dashboard/navbar.tmpl index a828bc90e4..2774ec5da2 100644 --- a/templates/user/dashboard/navbar.tmpl +++ b/templates/user/dashboard/navbar.tmpl @@ -2,32 +2,32 @@ <div class="ui secondary stackable menu"> <div class="item"> <div class="ui floating dropdown jump"> - <span class="text truncated-item-container"> + <span class="text"> {{ctx.AvatarUtils.Avatar .ContextUser 24 "tw-mr-1"}} - <span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> + <span class="gt-ellipsis">{{.ContextUser.ShortName 40}}</span> <span class="org-visibility"> {{if .ContextUser.Visibility.IsLimited}}<div class="ui basic tiny horizontal label">{{ctx.Locale.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}} {{if .ContextUser.Visibility.IsPrivate}}<div class="ui basic tiny horizontal label">{{ctx.Locale.Tr "org.settings.visibility.private_shortname"}}</div>{{end}} </span> {{svg "octicon-triangle-down" 14 "dropdown icon tw-ml-1"}} </span> - <div class="context user overflow menu"> + <div class="menu context-user-switch"> <div class="header"> {{ctx.Locale.Tr "home.switch_dashboard_context"}} </div> - <div class="scrolling menu items"> - <a class="{{if eq .ContextUser.ID .SignedUser.ID}}active selected{{end}} item truncated-item-container" href="{{AppSubUrl}}/{{if .PageIsIssues}}issues{{else if .PageIsPulls}}pulls{{else if .PageIsMilestonesDashboard}}milestones{{end}}"> + <div class="scrolling menu"> + <a class="{{if eq .ContextUser.ID .SignedUser.ID}}active selected{{end}} item" href="{{AppSubUrl}}/{{if .PageIsIssues}}issues{{else if .PageIsPulls}}pulls{{else if .PageIsMilestonesDashboard}}milestones{{end}}"> {{ctx.AvatarUtils.Avatar .SignedUser}} - <span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> + <span class="gt-ellipsis">{{.SignedUser.ShortName 40}}</span> <span class="org-visibility"> {{if .SignedUser.Visibility.IsLimited}}<div class="ui basic tiny horizontal label">{{ctx.Locale.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}} {{if .SignedUser.Visibility.IsPrivate}}<div class="ui basic tiny horizontal label">{{ctx.Locale.Tr "org.settings.visibility.private_shortname"}}</div>{{end}} </span> </a> {{range .Orgs}} - <a class="{{if eq $.ContextUser.ID .ID}}active selected{{end}} item truncated-item-container" title="{{.Name}}" href="{{.OrganisationLink}}/{{if $.PageIsIssues}}issues{{else if $.PageIsPulls}}pulls{{else if $.PageIsMilestonesDashboard}}milestones{{else}}dashboard{{end}}"> + <a class="{{if eq $.ContextUser.ID .ID}}active selected{{end}} item" title="{{.Name}}" href="{{.OrganisationLink}}/{{if $.PageIsIssues}}issues{{else if $.PageIsPulls}}pulls{{else if $.PageIsMilestonesDashboard}}milestones{{else}}dashboard{{end}}"> {{ctx.AvatarUtils.Avatar .}} - <span class="truncated-item-name">{{.ShortName 40}}</span> + <span class="gt-ellipsis">{{.ShortName 40}}</span> <span class="org-visibility"> {{if .Visibility.IsLimited}}<div class="ui basic tiny horizontal label">{{ctx.Locale.Tr "org.settings.visibility.limited_shortname"}}</div>{{end}} {{if .Visibility.IsPrivate}}<div class="ui basic tiny horizontal label">{{ctx.Locale.Tr "org.settings.visibility.private_shortname"}}</div>{{end}} diff --git a/web_src/css/base.css b/web_src/css/base.css index 98eb32bc13..f276ced596 100644 --- a/web_src/css/base.css +++ b/web_src/css/base.css @@ -347,6 +347,7 @@ a.label, .ui.dropdown .menu > .item { color: var(--color-text); + line-height: var(--line-height-default); } .ui.dropdown .menu > .item:hover { @@ -646,10 +647,11 @@ img.ui.avatar, border: 1px solid; } -.ui.floating.dropdown .overflow.menu .scrolling.menu.items { +.ui.dropdown .menu.context-user-switch .scrolling.menu { border-radius: 0 !important; box-shadow: none !important; border-bottom: 1px solid var(--color-secondary); + max-width: 80vw; } .user-menu > .item { @@ -1028,11 +1030,6 @@ table th[data-sortt-desc] .svg { text-align: left; } -.truncated-item-container { - display: flex !important; - align-items: center; -} - .ellipsis-button { padding: 0 5px 8px !important; display: inline-block !important; @@ -1041,15 +1038,6 @@ table th[data-sortt-desc] .svg { vertical-align: middle !important; } -.truncated-item-name { - line-height: 2; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - margin-top: -0.5em; - margin-bottom: -0.5em; -} - .precolors { display: flex; flex-direction: column; @@ -1166,14 +1154,20 @@ the "!important" is necessary to override Fomantic UI menu item styles, meanwhil margin: 0; /* use gap, but not margin */ } -.ui.dropdown.ellipsis-items-nowrap > .text { +.ui.dropdown.ellipsis-text-items { + /* reset y padding and use the line-height below instead, to avoid the "overflow: hidden" clips the larger image in the "text" element */ + padding-top: 0; + padding-bottom: 0; +} + +.ui.dropdown.ellipsis-text-items > .text { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; + line-height: 2.71; /* matches fomantic dropdown's default min-height */ } -.ellipsis-items-nowrap > .item, -.ui.dropdown.ellipsis-items-nowrap .menu > .item { +.ui.dropdown.ellipsis-text-items .menu > .item { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; diff --git a/web_src/js/components/RepoBranchTagSelector.vue b/web_src/js/components/RepoBranchTagSelector.vue index 820e69d9ab..99ccdfaa6d 100644 --- a/web_src/js/components/RepoBranchTagSelector.vue +++ b/web_src/js/components/RepoBranchTagSelector.vue @@ -216,7 +216,7 @@ export default defineComponent({ }); </script> <template> - <div class="ui dropdown custom branch-selector-dropdown ellipsis-items-nowrap"> + <div class="ui dropdown custom branch-selector-dropdown ellipsis-text-items"> <div tabindex="0" class="ui button branch-dropdown-button" @click="menuVisible = !menuVisible"> <span class="flex-text-block gt-ellipsis"> <template v-if="dropdownFixedText">{{ dropdownFixedText }}</template> |