test1234/gitea
1
0
Fork 0
forked from gitea/gitea
Code Pull Requests Activity

Fix file table overflows (#12603)

Browse Source 
- Fix overflow regression from https://github.com/go-gitea/gitea/pull/12553.
- Fix submodule columns stretching the table
- Refactor template to share more HTML nodes
- Introduce CSS helper classes

Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
This commit is contained in:
silverwind 2020-08-26 17:52:44 +02:00 committed by GitHub
parent 69b3dd6362
commit 7d14d6c1c1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 52 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
integrations/repo_test.go
View File

@ -148,7 +148,7 @@ func TestViewRepoWithSymlinks(t *testing.T) {
resp := session.MakeRequest(t, req, http.StatusOK)
htmlDoc := NewHTMLParser(t, resp.Body)
files := htmlDoc.doc.Find("#repo-files-table > TBODY > TR > TD.name")
files := htmlDoc.doc.Find("#repo-files-table > TBODY > TR > TD.name > SPAN.truncate")
items := files.Map(func(i int, s *goquery.Selection) string {
cls, _ := s.Find("SVG").Attr("class")
file := strings.Trim(s.Find("A").Text(), " \t\n")

58
templates/repo/view_list.tmpl
View File

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

19
web_src/less/_repository.less
View File

@ -361,14 +361,23 @@
width: 120px;
}
> a {
width: calc(100% - 8px); /* prevent overflow into adjacant cell */
display: inline-block;
padding-top: 8px;
padding-bottom: 8px;
.truncate {
display: inline-flex;
align-items: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
}
a {
padding-top: 8px;
padding-bottom: 8px;
}
.at {
margin-left: 3px;
margin-right: 3px;
}
> * {

6
web_src/less/helpers.less Normal file
View File

@ -0,0 +1,6 @@
.flex-0 {
flex: 0;
}
.flex-1 {
flex: 1;
}

1
web_src/less/index.less
View File

@ -1,5 +1,6 @@
@import "~font-awesome/css/font-awesome.css";
@import "./helpers.less";
@import "./features/gitgraph.less";
@import "./features/animations.less";
@import "./markdown/mermaid.less";