Fix ellipsis in files table (#12617)
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.release/v1.15
parent
e25d4867be
commit
f8601f3f09
|
@ -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>
|
||||||
|
|
|
@ -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 {
|
||||||
|
|
Loading…
Reference in New Issue