feat: moved copy sha & browse history into ellipsis in mobile view

- added ellipsis under div tag and moved Copy Sha & Browse History of repo into the ellipsis dropdown
- added a separate div tag for this ellipsis, but it's hidden in desktop but visible only on mobile view
This commit is contained in:
iamyaash 2025-06-19 21:36:47 +05:30
commit 574be03294
2 changed files with 37 additions and 3 deletions

View file

@ -79,6 +79,36 @@
{{if .Committer}}{{DateUtils.TimeSince .Committer.When}}{{else}}{{DateUtils.TimeSince .Author.When}}{{end}}
</div>
<div class="mobile-btn">
<div class="item ui dropdown " data-tooltip-content="{{ctx.Locale.Tr "repo.more_operations"}}" 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 class="{{$class}}">
{{ShortSha .ID.String}}
</span>
</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,6 +2777,7 @@ 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*/
}
@media (max-width: 640px) {
@ -2789,13 +2790,16 @@ tbody.commit-list {
grid-column: 1;
}
.commit-ui-redesign .btn {
.commit-ui-redesign .mobile-btn {
grid-row: 1;
grid-column: 2;
justify-self: end;
padding-inline: 0.5rem;
display: flex;
}
.commit-ui-redesign .btn { display: none;} /* manually hiding it, but we need to write this in a better way, */
.commit-ui-redesign .message {
grid-row: 2;
grid-column: 1 / span 2;