Nulo/gitea
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Activity

Fix ellipsis in files table (#12617)

Browse source 
Turns out text ellispsis does not work in combination with flexbox and
while wrapping in a display:block can help in some cases, I could not
get this to work properly so this changes the truncate to inline-block
again and reduces the clickable area to just vertical expansion from the
links.
This commit is contained in:
silverwind 2020-08-27 22:45:37 +02:00 committed by GitHub
parent e25d4867be
commit f8601f3f09
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
templates/repo/view_list.tmpl
View file

@ -49,7 +49,7 @@
{{svg "octicon-file-submodule" 16}} {{svg "octicon-file-submodule" 16}}
{{$refURL := $commit.RefURL AppUrl $.Repository.FullName}} {{$refURL := $commit.RefURL AppUrl $.Repository.FullName}}
{{if $refURL}} {{if $refURL}}
<a class="flex-0" href="{{$refURL}}">{{$entry.Name}}</a><span class="at">@</span><a class="flex-1" href="{{$refURL}}/commit/{{$commit.RefID}}">{{ShortSha $commit.RefID}}</a> <a href="{{$refURL}}">{{$entry.Name}}</a><span class="at">@</span><a href="{{$refURL}}/commit/{{$commit.RefID}}">{{ShortSha $commit.RefID}}</a>
{{else}} {{else}}
{{$entry.Name}}<span class="at">@</span>{{ShortSha $commit.RefID}} {{$entry.Name}}<span class="at">@</span>{{ShortSha $commit.RefID}}
{{end}} {{end}}
@ -58,7 +58,7 @@
{{$subJumpablePathName := $entry.GetSubJumpablePathName}} {{$subJumpablePathName := $entry.GetSubJumpablePathName}}
{{$subJumpablePath := SubJumpablePath $subJumpablePathName}} {{$subJumpablePath := SubJumpablePath $subJumpablePathName}}
{{svg "octicon-file-directory" 16}} {{svg "octicon-file-directory" 16}}
<a class="flex-1" href="{{EscapePound $.TreeLink}}/{{EscapePound $subJumpablePathName}}" title="{{$subJumpablePathName}}"> <a href="{{EscapePound $.TreeLink}}/{{EscapePound $subJumpablePathName}}" title="{{$subJumpablePathName}}">
{{if eq (len $subJumpablePath) 2}} {{if eq (len $subJumpablePath) 2}}
<span class="jumpable-path">{{index $subJumpablePath 0}}</span>{{index $subJumpablePath 1}} <span class="jumpable-path">{{index $subJumpablePath 0}}</span>{{index $subJumpablePath 1}}
{{else}} {{else}}
@ -67,14 +67,14 @@
</a> </a>
{{else}} {{else}}
{{svg (printf "octicon-%s" (EntryIcon $entry)) 16}} {{svg (printf "octicon-%s" (EntryIcon $entry)) 16}}
<a class="flex-1" href="{{EscapePound $.TreeLink}}/{{EscapePound $entry.Name}}" title="{{$entry.Name}}">{{$entry.Name}}</a> <a href="{{EscapePound $.TreeLink}}/{{EscapePound $entry.Name}}" title="{{$entry.Name}}">{{$entry.Name}}</a>
{{end}} {{end}}
{{end}} {{end}}
</span> </span>
</td> </td>
<td class="message nine wide"> <td class="message nine wide">
<span class="truncate"> <span class="truncate">
<a class="flex-1" href="{{$.RepoLink}}/commit/{{$commit.ID}}" title="{{$commit.Summary}}">{{$commit.Summary | RenderEmoji}}</a> <a href="{{$.RepoLink}}/commit/{{$commit.ID}}" title="{{$commit.Summary}}">{{$commit.Summary | RenderEmoji}}</a>
</span> </span>
</td> </td>
<td class="text right age three wide">{{TimeSince $commit.Committer.When $.Lang}}</td> <td class="text right age three wide">{{TimeSince $commit.Committer.When $.Lang}}</td>

5
web_src/less/_repository.less
View file

@ -362,12 +362,13 @@
} }
.truncate { .truncate {
display: inline-flex; display: inline-block;
align-items: center;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
width: 100%; width: 100%;
padding-top: 8px;
padding-bottom: 8px;
} }
a { a {