Remove max-width and add hide text overflow (#27359) (#27550)

Backport #27359 by @kdumontnu

Closes https://github.com/go-gitea/gitea/issues/27358

Co-authored-by: Kyle D <kdumontnu@gmail.com>
This commit is contained in:
Giteabot 2023-10-10 10:02:26 +08:00 committed by GitHub
parent 9a64a24f29
commit 71f091ef97
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 25 deletions

View file

@ -428,15 +428,15 @@
<div class="ui relaxed divided list"> <div class="ui relaxed divided list">
{{range .BlockingDependencies}} {{range .BlockingDependencies}}
<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb"> <div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb">
<div class="item-left gt-df gt-jc gt-fc gt-f1"> <div class="item-left gt-df gt-jc gt-fc gt-f1 gt-ellipsis">
<a class="title muted" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}"> <a class="title muted" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}">
#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}} #{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}
</a> </a>
<div class="text small"> <div class="text small gt-ellipsis" data-tooltip-content="{{.Repository.OwnerName}}/{{.Repository.Name}}">
{{.Repository.OwnerName}}/{{.Repository.Name}} {{.Repository.OwnerName}}/{{.Repository.Name}}
</div> </div>
</div> </div>
<div class="item-right gt-df gt-ac"> <div class="item-right gt-df gt-ac gt-m-2">
{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}} {{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
<a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blocking" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}"> <a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blocking" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
{{svg "octicon-trash" 16}} {{svg "octicon-trash" 16}}
@ -446,7 +446,7 @@
</div> </div>
{{end}} {{end}}
{{if .BlockingDependenciesNotPermitted}} {{if .BlockingDependenciesNotPermitted}}
<div class="item gt-df gt-ac gt-sb"> <div class="item gt-df gt-ac gt-sb gt-ellipsis">
<span>{{ctx.Locale.TrN (len .BlockingDependenciesNotPermitted) "repo.issues.dependency.no_permission_1" "repo.issues.dependency.no_permission_n" (len .BlockingDependenciesNotPermitted)}}</span> <span>{{ctx.Locale.TrN (len .BlockingDependenciesNotPermitted) "repo.issues.dependency.no_permission_1" "repo.issues.dependency.no_permission_n" (len .BlockingDependenciesNotPermitted)}}</span>
</div> </div>
{{end}} {{end}}
@ -460,15 +460,15 @@
<div class="ui relaxed divided list"> <div class="ui relaxed divided list">
{{range .BlockedByDependencies}} {{range .BlockedByDependencies}}
<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb"> <div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb">
<div class="item-left gt-df gt-jc gt-fc gt-f1"> <div class="item-left gt-df gt-jc gt-fc gt-f1 gt-ellipsis">
<a class="title muted" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}"> <a class="title muted" href="{{.Issue.Link}}" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}">
#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}} #{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}
</a> </a>
<div class="text small"> <div class="text small gt-ellipsis" data-tooltip-content="{{.Repository.OwnerName}}/{{.Repository.Name}}">
{{.Repository.OwnerName}}/{{.Repository.Name}} {{.Repository.OwnerName}}/{{.Repository.Name}}
</div> </div>
</div> </div>
<div class="item-right gt-df gt-ac"> <div class="item-right gt-df gt-ac gt-m-2">
{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}} {{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
<a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blockedBy" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}"> <a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blockedBy" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
{{svg "octicon-trash" 16}} {{svg "octicon-trash" 16}}
@ -480,18 +480,18 @@
{{if $.CanCreateIssueDependencies}} {{if $.CanCreateIssueDependencies}}
{{range .BlockedByDependenciesNotPermitted}} {{range .BlockedByDependenciesNotPermitted}}
<div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb"> <div class="item dependency{{if .Issue.IsClosed}} is-closed{{end}} gt-df gt-ac gt-sb">
<div class="item-left gt-df gt-jc gt-fc gt-f1"> <div class="item-left gt-df gt-jc gt-fc gt-f1 gt-ellipsis">
<div> <div class="gt-ellipsis">
<span data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.no_permission.can_remove"}}">{{svg "octicon-lock" 16}}</span> <span data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.no_permission.can_remove"}}">{{svg "octicon-lock" 16}}</span>
<span class="title" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}"> <span class="title" data-tooltip-content="#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}">
#{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}} #{{.Issue.Index}} {{.Issue.Title | RenderEmoji $.Context}}
</span> </span>
</div> </div>
<div class="text small"> <div class="text small gt-ellipsis" data-tooltip-content="{{.Repository.OwnerName}}/{{.Repository.Name}}">
{{.Repository.OwnerName}}/{{.Repository.Name}} {{.Repository.OwnerName}}/{{.Repository.Name}}
</div> </div>
</div> </div>
<div class="item-right gt-df gt-ac"> <div class="item-right gt-df gt-ac gt-m-2">
{{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}} {{if and $.CanCreateIssueDependencies (not $.Repository.IsArchived)}}
<a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blocking" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}"> <a class="delete-dependency-button ci muted" data-id="{{.Issue.ID}}" data-type="blocking" data-tooltip-content="{{ctx.Locale.Tr "repo.issues.dependency.remove_info"}}">
{{svg "octicon-trash" 16}} {{svg "octicon-trash" 16}}
@ -501,7 +501,7 @@
</div> </div>
{{end}} {{end}}
{{else if .BlockedByDependenciesNotPermitted}} {{else if .BlockedByDependenciesNotPermitted}}
<div class="item gt-df gt-ac gt-sb"> <div class="item gt-df gt-ac gt-sb gt-ellipsis">
<span>{{ctx.Locale.TrN (len .BlockedByDependenciesNotPermitted) "repo.issues.dependency.no_permission_1" "repo.issues.dependency.no_permission_n" (len .BlockedByDependenciesNotPermitted)}}</span> <span>{{ctx.Locale.TrN (len .BlockedByDependenciesNotPermitted) "repo.issues.dependency.no_permission_1" "repo.issues.dependency.no_permission_n" (len .BlockedByDependenciesNotPermitted)}}</span>
</div> </div>
{{end}} {{end}}

View file

@ -95,23 +95,10 @@
} }
.repository .issue-content-right .ui.list .title { .repository .issue-content-right .ui.list .title {
max-width: 200px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
@media (max-width: 1200px) {
.repository .issue-content-right .ui.list .title {
max-width: 150px;
}
}
@media (max-width: 1000px) {
.repository .issue-content-right .ui.list .title {
max-width: 100px;
}
}
.repository .issue-content-right #deadlineForm input { .repository .issue-content-right #deadlineForm input {
width: 12.8rem; width: 12.8rem;
border-radius: var(--border-radius) 0 0 var(--border-radius); border-radius: var(--border-radius) 0 0 var(--border-radius);