public/gitea
1
0
Fork 0
mirror of https://github.com/go-gitea/gitea.git synced 2025-10-31 21:28:11 +09:00
Code Issues Packages Projects Releases Wiki Activity

Refactor dropdown ellipsis (#34123)

Browse Source 
Remove legacy `truncated-item-container` and `truncated-item-name`.
This commit is contained in:
wxiaoguang
2025-04-05 11:21:11 +08:00
committed by GitHub
parent 7a09bc904a
commit ee6929d96b
21 changed files with 117 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
templates/devtest/fomantic-dropdown.tmpl
View File

@@ -75,12 +75,12 @@
<h2>Selection</h2> <h2>Selection</h2>
<div> <div>
{{/* the "selection" class is optional, it will be added by JS automatically */}} {{/* 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>a</option>
<option>abcdefuvwxyz</option> <option>abcdefuvwxyz</option>
<option>loooooooooooooooooooooooooooooooooooooooooooooooooooooooooong</option> <option>loooooooooooooooooooooooooooooooooooooooooooooooooooooooooong</option>
</select> </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>loooooooooooooooooooooooooooooooooooooooooooooooooooooooooong</option>
<option>abcdefuvwxyz</option> <option>abcdefuvwxyz</option>
<option>a</option> <option>a</option>

2
templates/repo/actions/workflow_dispatch.tmpl
View File

@@ -10,7 +10,7 @@
<span class="ui inline required field"> <span class="ui inline required field">
<label>{{ctx.Locale.Tr "actions.workflow.from_ref"}}:</label> <label>{{ctx.Locale.Tr "actions.workflow.from_ref"}}:</label>
</span> </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}}"> <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}} {{svg "octicon-git-branch" 14}}
<div class="default text">{{index .Branches 0}}</div> <div class="default text">{{index .Branches 0}}</div>

2
templates/repo/branch_dropdown.tmpl
View File

@@ -46,7 +46,7 @@ Search "repo/branch_dropdown" in the template directory to find all occurrences.
data-enable-feed="{{ctx.RootData.EnableFeed}}" data-enable-feed="{{ctx.RootData.EnableFeed}}"
> >
{{/* show dummy elements before Vue componment is mounted, this code must match the code in BranchTagSelector.vue */}} {{/* 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"> <div class="ui button branch-dropdown-button">
<span class="flex-text-block gt-ellipsis"> <span class="flex-text-block gt-ellipsis">
{{if not .DropdownFixedText}} {{if not .DropdownFixedText}}

12
templates/repo/create.tmpl
View File

@@ -12,23 +12,23 @@
<div id="create-repo-error-message" class="ui negative message tw-text-center tw-hidden"></div> <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}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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}}"> <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"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu"> <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}} {{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}}" 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}} {{end}}
> >
{{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}} {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{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"}} {{ctx.AvatarUtils.Avatar . 28 "mini"}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

2
templates/repo/issue/branch_selector_field.tmpl
View File

@@ -14,7 +14,7 @@ Still needs to figure out:
*/}} */}}
{{if and (not .Issue.IsPull) (not .PageIsComparePull)}} {{if and (not .Issue.IsPull) (not .PageIsComparePull)}}
<input id="ref_selector" name="ref" type="hidden" value="{{.Reference}}"> <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"}}" 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}} {{if and .Issue (or .IsIssueWriter .HasIssuesOrPullsWritePermission)}}data-url-update-issueref="{{$.RepoLink}}/issues/{{.Issue.Index}}/ref"{{end}}
> >

2
templates/repo/issue/view_content/reference_issue_dialog.tmpl
View File

@@ -7,7 +7,7 @@
{{.CsrfTokenHtml}} {{.CsrfTokenHtml}}
<div class="field"> <div class="field">
<label><strong>{{ctx.Locale.Tr "repository"}}</strong></label> <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="default text gt-ellipsis">{{.Repository.FullName}}</div>
<div class="menu"></div> <div class="menu"></div>
</div> </div>

14
templates/repo/migrate/codebase.tmpl
View File

@@ -60,22 +60,22 @@
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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"}} {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu" title="{{.SignedUser.Name}}"> <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"}} {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{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"}} {{ctx.AvatarUtils.Avatar . 28 "mini"}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

14
templates/repo/migrate/codecommit.tmpl
View File

@@ -61,22 +61,22 @@
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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"}} {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu" title="{{.SignedUser.Name}}"> <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"}} {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{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"}} {{ctx.AvatarUtils.Avatar . 28 "mini"}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

14
templates/repo/migrate/git.tmpl
View File

@@ -34,22 +34,22 @@
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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}} {{ctx.AvatarUtils.Avatar .ContextUser}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu" title="{{.SignedUser.Name}}"> <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}} {{ctx.AvatarUtils.Avatar .SignedUser}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{range .Orgs}}
<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> <div class="item" data-value="{{.ID}}" title="{{.Name}}">
{{ctx.AvatarUtils.Avatar .}} {{ctx.AvatarUtils.Avatar .}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

14
templates/repo/migrate/gitbucket.tmpl
View File

@@ -76,22 +76,22 @@
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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"}} {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu" title="{{.SignedUser.Name}}"> <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"}} {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{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"}} {{ctx.AvatarUtils.Avatar . 28 "mini"}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

14
templates/repo/migrate/gitea.tmpl
View File

@@ -72,22 +72,22 @@
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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}} {{ctx.AvatarUtils.Avatar .ContextUser}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu" title="{{.SignedUser.Name}}"> <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}} {{ctx.AvatarUtils.Avatar .SignedUser}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{range .Orgs}}
<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> <div class="item" data-value="{{.ID}}" title="{{.Name}}">
{{ctx.AvatarUtils.Avatar .}} {{ctx.AvatarUtils.Avatar .}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

14
templates/repo/migrate/github.tmpl
View File

@@ -74,22 +74,22 @@
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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"}} {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu" title="{{.SignedUser.Name}}"> <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"}} {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{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"}} {{ctx.AvatarUtils.Avatar . 28 "mini"}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

14
templates/repo/migrate/gitlab.tmpl
View File

@@ -71,22 +71,22 @@
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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"}} {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu" title="{{.SignedUser.Name}}"> <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"}} {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{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"}} {{ctx.AvatarUtils.Avatar . 28 "mini"}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

14
templates/repo/migrate/gogs.tmpl
View File

@@ -74,22 +74,22 @@
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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}} {{ctx.AvatarUtils.Avatar .ContextUser}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu" title="{{.SignedUser.Name}}"> <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}} {{ctx.AvatarUtils.Avatar .SignedUser}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{range .Orgs}}
<div class="item truncated-item-container" data-value="{{.ID}}" title="{{.Name}}"> <div class="item" data-value="{{.ID}}" title="{{.Name}}">
{{ctx.AvatarUtils.Avatar .}} {{ctx.AvatarUtils.Avatar .}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

14
templates/repo/migrate/onedev.tmpl
View File

@@ -61,22 +61,22 @@
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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"}} {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu" title="{{.SignedUser.Name}}"> <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"}} {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{range .Orgs}} {{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"}} {{ctx.AvatarUtils.Avatar . 28 "mini"}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>

18
templates/repo/pulls/fork.tmpl
View File

@@ -10,24 +10,24 @@
{{.CsrfTokenHtml}} {{.CsrfTokenHtml}}
<div class="inline required field {{if .Err_Owner}}error{{end}}"> <div class="inline required field {{if .Err_Owner}}error{{end}}">
<label>{{ctx.Locale.Tr "repo.owner"}}</label> <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> <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"}} {{ctx.AvatarUtils.Avatar .ContextUser 28 "mini"}}
<span class="truncated-item-name">{{.ContextUser.ShortName 40}}</span> {{.ContextUser.ShortName 40}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu"> <div class="menu">
{{if .CanForkToUser}} {{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"}} {{ctx.AvatarUtils.Avatar .SignedUser 28 "mini"}}
<span class="truncated-item-name">{{.SignedUser.ShortName 40}}</span> {{.SignedUser.ShortName 40}}
</div> </div>
{{end}} {{end}}
{{range .Orgs}} {{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"}} {{ctx.AvatarUtils.Avatar . 28 "mini"}}
<span class="truncated-item-name">{{.ShortName 40}}</span> {{.ShortName 40}}
</div> </div>
{{end}} {{end}}
</div> </div>
@@ -52,10 +52,10 @@
</div> </div>
<div class="inline field"> <div class="inline field">
<label>{{ctx.Locale.Tr "repo.fork_branch"}}</label> <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> <input type="hidden" id="fork_single_branch" name="fork_single_branch" value="" required>
<div class="text" title="{{ctx.Locale.Tr "repo.all_branches"}}"> <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> </div>
{{svg "octicon-triangle-down" 14 "dropdown icon"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}}
<div class="menu"> <div class="menu">

18
templates/repo/settings/githooks.tmpl
View File

@@ -4,18 +4,14 @@
{{ctx.Locale.Tr "repo.settings.githooks"}} {{ctx.Locale.Tr "repo.settings.githooks"}}
</h4> </h4>
<div class="ui attached segment"> <div class="ui attached segment">
<div class="ui list"> <div class="ui list flex-items-block">
<div class="item"> <div class="item"><span>{{ctx.Locale.Tr "repo.settings.githooks_desc"}}</span></div>
{{ctx.Locale.Tr "repo.settings.githooks_desc"}}
</div>
{{range .Hooks}} {{range .Hooks}}
<div class="item truncated-item-container"> <div class="item">
<span class="text {{if .IsActive}}green{{else}}grey{{end}} tw-mr-2">{{svg "octicon-dot-fill" 22}}</span> <span class="text {{if .IsActive}}green{{else}}grey{{end}}">{{svg "octicon-dot-fill" 22}}</span>
<span class="text truncate tw-flex-1 tw-mr-2">{{.Name}}</span> <span class="gt-ellipsis tw-flex-1">{{.Name}}</span>
<a class="muted tw-float-right tw-p-2" href="{{$.RepoLink}}/settings/hooks/git/{{.Name|PathEscape}}"> <a class="muted tw-p-2" href="{{$.RepoLink}}/settings/hooks/git/{{.Name|PathEscape}}">{{svg "octicon-pencil"}}</a>
{{svg "octicon-pencil"}} </div>
</a>
</div>
{{end}} {{end}}
</div> </div>
</div> </div>

12
templates/repo/settings/webhook/base_list.tmpl
View File

@@ -8,14 +8,12 @@
</div> </div>
</h4> </h4>
<div class="ui attached segment"> <div class="ui attached segment">
<div class="ui list"> <div class="ui list flex-items-block">
<div class="item"> <div class="item"><span>{{.Description}}</span></div>
{{.Description}}
</div>
{{range .Webhooks}} {{range .Webhooks}}
<div class="item truncated-item-container"> <div class="item">
<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> <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="text truncate tw-flex-1 tw-mr-2"> <div class="gt-ellipsis tw-flex-1">
<a title="{{.URL}}" href="{{$.BaseLink}}/{{.ID}}">{{.URL}}</a> <a title="{{.URL}}" href="{{$.BaseLink}}/{{.ID}}">{{.URL}}</a>
</div> </div>
<a class="muted tw-p-2" href="{{$.BaseLink}}/{{.ID}}">{{svg "octicon-pencil"}}</a> <a class="muted tw-p-2" href="{{$.BaseLink}}/{{.ID}}">{{svg "octicon-pencil"}}</a>

16
templates/user/dashboard/navbar.tmpl
View File

@@ -2,32 +2,32 @@
<div class="ui secondary stackable menu"> <div class="ui secondary stackable menu">
<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">
{{ctx.AvatarUtils.Avatar .ContextUser 24 "tw-mr-1"}} {{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"> <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.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}} {{if .ContextUser.Visibility.IsPrivate}}<div class="ui basic tiny horizontal label">{{ctx.Locale.Tr "org.settings.visibility.private_shortname"}}</div>{{end}}
</span> </span>
{{svg "octicon-triangle-down" 14 "dropdown icon tw-ml-1"}} {{svg "octicon-triangle-down" 14 "dropdown icon tw-ml-1"}}
</span> </span>
<div class="context user overflow menu"> <div class="menu context-user-switch">
<div class="header"> <div class="header">
{{ctx.Locale.Tr "home.switch_dashboard_context"}} {{ctx.Locale.Tr "home.switch_dashboard_context"}}
</div> </div>
<div class="scrolling menu items"> <div class="scrolling menu">
<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}}"> <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}} {{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"> <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.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}} {{if .SignedUser.Visibility.IsPrivate}}<div class="ui basic tiny horizontal label">{{ctx.Locale.Tr "org.settings.visibility.private_shortname"}}</div>{{end}}
</span> </span>
</a> </a>
{{range .Orgs}} {{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 .}} {{ctx.AvatarUtils.Avatar .}}
<span class="truncated-item-name">{{.ShortName 40}}</span> <span class="gt-ellipsis">{{.ShortName 40}}</span>
<span class="org-visibility"> <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.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}} {{if .Visibility.IsPrivate}}<div class="ui basic tiny horizontal label">{{ctx.Locale.Tr "org.settings.visibility.private_shortname"}}</div>{{end}}

30
web_src/css/base.css
View File

@@ -347,6 +347,7 @@ a.label,
.ui.dropdown .menu > .item { .ui.dropdown .menu > .item {
color: var(--color-text); color: var(--color-text);
line-height: var(--line-height-default);
} }
.ui.dropdown .menu > .item:hover { .ui.dropdown .menu > .item:hover {
@@ -646,10 +647,11 @@ img.ui.avatar,
border: 1px solid; border: 1px solid;
} }
.ui.floating.dropdown .overflow.menu .scrolling.menu.items { .ui.dropdown .menu.context-user-switch .scrolling.menu {
border-radius: 0 !important; border-radius: 0 !important;
box-shadow: none !important; box-shadow: none !important;
border-bottom: 1px solid var(--color-secondary); border-bottom: 1px solid var(--color-secondary);
max-width: 80vw;
} }
.user-menu > .item { .user-menu > .item {
@@ -1028,11 +1030,6 @@ table th[data-sortt-desc] .svg {
text-align: left; text-align: left;
} }
.truncated-item-container {
display: flex !important;
align-items: center;
}
.ellipsis-button { .ellipsis-button {
padding: 0 5px 8px !important; padding: 0 5px 8px !important;
display: inline-block !important; display: inline-block !important;
@@ -1041,15 +1038,6 @@ table th[data-sortt-desc] .svg {
vertical-align: middle !important; 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 { .precolors {
display: flex; display: flex;
flex-direction: column; 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 */ 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; overflow: hidden;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
line-height: 2.71; /* matches fomantic dropdown's default min-height */
} }
.ellipsis-items-nowrap > .item, .ui.dropdown.ellipsis-text-items .menu > .item {
.ui.dropdown.ellipsis-items-nowrap .menu > .item {
white-space: nowrap !important; white-space: nowrap !important;
overflow: hidden !important; overflow: hidden !important;
text-overflow: ellipsis !important; text-overflow: ellipsis !important;

2
web_src/js/components/RepoBranchTagSelector.vue
View File

@@ -216,7 +216,7 @@ export default defineComponent({
}); });
</script> </script>
<template> <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"> <div tabindex="0" class="ui button branch-dropdown-button" @click="menuVisible = !menuVisible">
<span class="flex-text-block gt-ellipsis"> <span class="flex-text-block gt-ellipsis">
<template v-if="dropdownFixedText">{{ dropdownFixedText }}</template> <template v-if="dropdownFixedText">{{ dropdownFixedText }}</template>