feat: repositioned shabox and view history button

- now the shabox copy the sha value into clipboard when clicked upon it in mobile layout
- moved the view history button as well
This commit is contained in:
iamyaash 2025-06-21 13:08:17 +05:30
commit 57d5e6c76e
2 changed files with 54 additions and 39 deletions

View file

@ -45,7 +45,7 @@
</div>
</div>
<div class="tw-text-left">
<div class="shabox">
{{$class := "ui sha label"}}
{{if .Signature}}
{{$class = (print $class " isSigned")}}
@ -68,37 +68,50 @@
</a>
</div>
<div class="mobile-shabox">
{{$class := "ui sha label"}}
{{if .Signature}}
{{$class = (print $class " isSigned")}}
{{if .Verification.Verified}}
{{if eq .Verification.TrustStatus "trusted"}}
{{$class = (print $class " isVerified")}}
{{else if eq .Verification.TrustStatus "untrusted"}}
{{$class = (print $class " isVerifiedUntrusted")}}
{{else}}
{{$class = (print $class " isVerifiedUnmatched")}}
{{end}}
{{else if .Verification.Warning}}
{{$class = (print $class " isWarning")}}
{{end}}
{{end}}
{{$commitShaLink := (printf "%s/pulls/%d/commits/%s" $commitRepoLink $.Issue.Index (PathEscape .ID.String))}}
<button data-clipboard-text="{{.ID}}" class="{{$class}}">
<span class="tw-ml-2">{{svg "octicon-copy"}} {{ctx.Locale.Tr "copy"}}</span>
<span class="shortsha">{{ShortSha .ID.String}}</span>
</button>
</div>
<div class="mobile-history-button">
{{if not $.PageIsWiki}}
{{if $.FileName}}
<button
class="interact-bg tw-p-2"
href="{{printf "%s/commit/%s?files=%s" $commitRepoLink (PathEscape .ID.String) (PathEscapeSegments $.FileName)}}">
{{svg "octicon-file-diff"}} {{ctx.Locale.Tr "repo.commits.view_single_diff"}}
</button>
{{end}}
<button
class="interact-bg tw-p-2"
href="{{if $.FileName}}{{printf "%s/src/commit/%s/%s" $commitRepoLink (PathEscape .ID.String) (PathEscapeSegments $.FileName)}}{{else}}{{printf "%s/src/commit/%s" $commitRepoLink (PathEscape .ID.String)}}{{end}}">
{{svg "octicon-file-code"}} {{ctx.Locale.Tr "repo.commits.view_path"}}
</button>
{{end}}
</div>
<div class="date tw-flex-1 tw-text-right tw-pr-4">
{{if .Committer}}{{DateUtils.TimeSince .Committer.When}}{{else}}{{DateUtils.TimeSince .Author.When}}{{end}}
</div>
<div class="mobile-btn">
<div class="item ui dropdown " aria-label="{{ctx.Locale.Tr "toggle_menu"}}">
{{svg "octicon-kebab-horizontal"}}
<div class="menu">
<span class="interact item" data-clipboard-text="{{.ID}}">
{{svg "octicon-copy"}} {{ctx.Locale.Tr "copy_hash"}}
</span>
{{if not $.PageIsWiki}}
{{if $.FileName}}
<a
class="interact item"
rdata-tooltip-content="{{ctx.Locale.Tr "repo.commits.view_single_diff"}}"
href="{{printf "%s/commit/%s?files=%s" $commitRepoLink (PathEscape .ID.String) (PathEscapeSegments $.FileName)}}">
{{svg "octicon-file-diff"}}
</a>
{{end}}
<a
class="interact item"
data-tooltip-content="{{ctx.Locale.Tr "repo.commits.view_path"}}"
href="{{if $.FileName}}{{printf "%s/src/commit/%s/%s" $commitRepoLink (PathEscape .ID.String) (PathEscapeSegments $.FileName)}}{{else}}{{printf "%s/src/commit/%s" $commitRepoLink (PathEscape .ID.String)}}{{end}}">
{{svg "octicon-file-code"}} {{ctx.Locale.Tr "repo.commits.view_path"}}
</a>
{{end}}
</div>
</div>
</div>
<div class="btn">
<button class="interact-bg tw-p-2" data-tooltip-content="{{ctx.Locale.Tr "copy_hash"}}" data-clipboard-text="{{.ID}}">{{svg "octicon-copy"}}</button>
{{if not $.PageIsWiki}}

View file

@ -2777,29 +2777,25 @@ tbody.commit-list {
grid-template-columns: minmax(8ch, 15%) 1fr minmax(20ch, 1%) minmax(10ch, 10%) auto;
align-items: center;
.author {margin-right: 10%}
.mobile-btn {display: none;} /*hiding the button in desktop view, only accessible in mobile view*/
.mobile-shabox {display: none;} /*hiding the button in desktop view, only accessible in mobile view*/
.mobile-history-button {display: none;}
}
@media (max-width: 640px) {
.commit-timeline {
grid-template-columns: 1fr 1fr;
}
/* manual div allocation in grid cols, since it uses a new layout for mobile */
/* manual div allocation in grid cols, since it uses a new layout for mobile */
.commit-timeline .author {
grid-row: 1;
grid-column: 1;
}
.commit-timeline .mobile-btn {
.commit-timeline .date {
grid-row: 1;
grid-column: 2;
justify-self: end;
padding-inline: 0.5rem;
display: flex;
}
.commit-timeline .btn { display: none;} /* manually hiding it, but we need to write this in a better way, */
.commit-timeline .message {
grid-row: 2;
grid-column: 1 / span 2;
@ -2807,13 +2803,19 @@ tbody.commit-list {
}
.commit-timeline .ui.sha.label {
.commit-timeline .shabox {display: none;}
.commit-timeline .mobile-history-button {
display: block;
grid-row: 3;
grid-column: 1;
}
.commit-timeline .timeline {
grid-row: 3;
.commit-timeline .mobile-shabox {
display: block;
grid-row:3;
grid-column: 2;
}
.commit-timeline .btn {display: none;}
}