Skip to content

Commit

Permalink
Rework blame template and styling (#11885)
Browse files Browse the repository at this point in the history 
* Rework blame template and styling

* cleanup template and add missing NumLines

Co-authored-by: techknowlogick <techknowlogick@gitea.io>
  • Loading branch information
@CirnoT @techknowlogick
CirnoT and techknowlogick authored Jun 15, 2020
1 parent a7f7d13 commit c878098
Show file tree
Hide file tree
Showing 5 changed files with 54 additions and 73 deletions.
30 changes: 8 additions & 22 deletions routers/repo/blame.go
View file
Original file line number Diff line number Diff line change
Expand Up @@ -118,29 +118,15 @@ func RefBlame(ctx *context.Context) {

ctx.Data["IsBlame"] = true

if ctx.Repo.CanEnableEditor() {
// Check LFS Lock
lfsLock, err := ctx.Repo.Repository.GetTreePathLock(ctx.Repo.TreePath)
if err != nil {
ctx.ServerError("GetTreePathLock", err)
return
}
if lfsLock != nil && lfsLock.OwnerID != ctx.User.ID {
ctx.Data["CanDeleteFile"] = false
ctx.Data["DeleteFileTooltip"] = ctx.Tr("repo.editor.this_file_locked")
} else {
ctx.Data["CanDeleteFile"] = true
ctx.Data["DeleteFileTooltip"] = ctx.Tr("repo.editor.delete_this_file")
}
} else if !ctx.Repo.IsViewBranch {
ctx.Data["DeleteFileTooltip"] = ctx.Tr("repo.editor.must_be_on_a_branch")
} else if !ctx.Repo.CanWrite(models.UnitTypeCode) {
ctx.Data["DeleteFileTooltip"] = ctx.Tr("repo.editor.must_have_write_access")
}

ctx.Data["FileSize"] = blob.Size()
ctx.Data["FileName"] = blob.Name()

ctx.Data["NumLines"], err = blob.GetBlobLineCount()
if err != nil {
ctx.NotFound("GetBlobLineCount", err)
return
}

blameReader, err := git.CreateBlameReader(models.RepoPath(userName, repoName), commitID, fileName)
if err != nil {
ctx.NotFound("CreateBlameReader", err)
Expand Down Expand Up @@ -245,9 +231,9 @@ func renderBlame(ctx *context.Context, blameParts []git.BlamePart, commitNames m

//Line number
if len(part.Lines)-1 == index && len(blameParts)-1 != pi {
lineNumbers.WriteString(fmt.Sprintf(`<span id="L%d" class="bottom-line">%d</span>`, i, i))
lineNumbers.WriteString(fmt.Sprintf(`<span id="L%d" data-line-number="%d" class="bottom-line"></span>`, i, i))
} else {
lineNumbers.WriteString(fmt.Sprintf(`<span id="L%d">%d</span>`, i, i))
lineNumbers.WriteString(fmt.Sprintf(`<span id="L%d" data-line-number="%d"></span>`, i, i))
}

//Code line
Expand Down
74 changes: 30 additions & 44 deletions templates/repo/blame.tmpl
View file
Original file line number Diff line number Diff line change
@@ -1,51 +1,37 @@
<div class="tab-size-8 non-diff-file-content">

<h4 class="ui top attached header" id="repo-read-file">
<div class="ui stackable grid">
<div class="eight wide column">
<i class="file text outline icon ui left"></i>
<strong>{{.FileName}}</strong> <span class="text grey normal">{{FileSize .FileSize}}{{if .IsLFSFile}} ({{.i18n.Tr "repo.stored_lfs"}}){{end}}</span>
<div class="{{TabSizeClass .Editorconfig .FileName}} non-diff-file-content">
<h4 class="file-header ui top attached header">
<div class="file-header-left">
<div class="file-info text grey normal mono">
<div class="file-info-entry">
{{.NumLines}} {{.i18n.Tr (TrN .i18n.Lang .NumLines "repo.line" "repo.lines") }}
</div>
<div class="file-info-entry">{{FileSize .FileSize}}</div>
</div>
<div class="eight wide right aligned column">
<div class="ui right file-actions">
<div class="ui buttons">
<a class="ui button" href="{{EscapePound $.RawFileLink}}">{{.i18n.Tr "repo.file_raw"}}</a>
{{if not .IsViewCommit}}
<a class="ui button" href="{{.RepoLink}}/src/commit/{{.CommitID}}/{{EscapePound .TreePath}}">{{.i18n.Tr "repo.file_permalink"}}</a>
{{end}}
<a class="ui button" href="{{.RepoLink}}/src/{{EscapePound .BranchNameSubURL}}/{{EscapePound .TreePath}}">{{.i18n.Tr "repo.normal_view"}}</a>
<a class="ui button" href="{{.RepoLink}}/commits/{{EscapePound .BranchNameSubURL}}/{{EscapePound .TreePath}}">{{.i18n.Tr "repo.file_history"}}</a>
</div>
{{if .Repository.CanEnableEditor}}
{{if .CanEditFile}}
<a href="{{.RepoLink}}/_edit/{{EscapePound .BranchName}}/{{EscapePound .TreePath}}"><span class="btn-octicon poping up" data-content="{{.EditFileTooltip}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-pencil" 16}}</span></a>
{{else}}
<span class="btn-octicon poping up disabled" data-content="{{.EditFileTooltip}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-pencil" 16}}</span>
{{end}}
{{if .CanDeleteFile}}
<a href="{{.RepoLink}}/_delete/{{EscapePound .BranchName}}/{{EscapePound .TreePath}}"><span class="btn-octicon btn-octicon-danger poping up" data-content="{{.DeleteFileTooltip}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-trashcan" 16}}</span></a>
{{else}}
<span class="btn-octicon poping up disabled" data-content="{{.DeleteFileTooltip}}" data-position="bottom center" data-variation="tiny inverted">{{svg "octicon-trashcan" 16}}</span>
{{end}}
{{end}}
</div>
</div>
<div class="file-header-right">
<div class="ui right file-actions">
<div class="ui buttons">
<a class="ui button" href="{{EscapePound $.RawFileLink}}">{{.i18n.Tr "repo.file_raw"}}</a>
{{if not .IsViewCommit}}
<a class="ui button" href="{{.RepoLink}}/src/commit/{{.CommitID}}/{{EscapePound .TreePath}}">{{.i18n.Tr "repo.file_permalink"}}</a>
{{end}}
<a class="ui button" href="{{.RepoLink}}/src/{{EscapePound .BranchNameSubURL}}/{{EscapePound .TreePath}}">{{.i18n.Tr "repo.normal_view"}}</a>
<a class="ui button" href="{{.RepoLink}}/commits/{{EscapePound .BranchNameSubURL}}/{{EscapePound .TreePath}}">{{.i18n.Tr "repo.file_history"}}</a>
</div>
</div>
</div>
</h4>

<div class="ui attached table unstackable segment">
<div class="file-view code-view">
<table>
<tbody>
<tr>
<td class="lines-commit">{{.BlameCommitInfo}}</td>
<td class="lines-num">{{.BlameLineNums}}</td>
<td class="lines-code"><pre><code class="{{.HighlightClass}}"><ol class="linenums">{{.BlameContent}}</ol></code></pre></td>
</tr>
</tbody>
</table>
</div>
<div class="file-view code-view">
<table>
<tbody>
<tr>
<td class="lines-commit">{{.BlameCommitInfo}}</td>
<td class="lines-num">{{.BlameLineNums}}</td>
<td class="lines-code"><pre><code class="{{.HighlightClass}}"><ol class="linenums">{{.BlameContent}}</ol></code></pre></td>
</tr>
</tbody>
</table>
</div>
</div>


</div>
2 changes: 1 addition & 1 deletion templates/repo/home.tmpl
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{{template "base/head" .}}
<div class="repository file list">
<div class="repository file list {{if .IsBlame}}blame{{end}}">
{{template "repo/header" .}}
<div class="ui container">
{{template "base/alert" .}}
Expand Down
13 changes: 9 additions & 4 deletions web_src/less/_base.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1069,15 +1069,20 @@ i.icons {
}

.lines-num {
vertical-align: top;
text-align: right !important;
color: #999999;
background: #f5f5f5;
width: 1%;
user-select: none;

span {
&:before {
&.bottom-line {
&:after {
border-bottom: 1px solid #eaecef;
}
}

&:after {
content: attr(data-line-number);
line-height: 20px !important;
padding: 0 10px;
Expand All @@ -1090,6 +1095,7 @@ i.icons {
.lines-num,
.lines-code {
padding: 0 !important;
vertical-align: top;

pre,
ol,
Expand All @@ -1101,7 +1107,7 @@ i.icons {
li {
display: block;
width: calc(100% - 1ch);
margin-left: 1ch;
padding-left: 1ch;
}
}
}
Expand Down Expand Up @@ -1149,7 +1155,6 @@ i.icons {
}
}

.lines-num,
.lines-code,
.lines-commit {
.bottom-line {
Expand Down
8 changes: 6 additions & 2 deletions web_src/less/_repository.less
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
.repository {

padding-top: 15px;

.repo-header {
Expand Down Expand Up @@ -246,6 +245,12 @@
}

&.file.list {
&.blame {
.ui.container:not(.flex) {
width: 98%;
}
}

.repo-description {
display: flex;
justify-content: space-between;
Expand Down Expand Up @@ -1646,7 +1651,6 @@
width: 1%;
min-width: 50px;
user-select: none;
vertical-align: top;

span.fold {
display: block;
Expand Down

0 comments on commit c878098

Please sign in to comment.