Skip to content

Commit b81c013

Browse files
Don't stack PR tab menu on small screens (#25789)
the stacking takes up screen space - display the tabs as the navigation bar. github uses the same layout. Screenshots (left before, right after): ![image](https://github.com/go-gitea/gitea/assets/1135157/d7e2aaec-c67b-403d-8d56-d4c824b04eed) ![image](https://github.com/go-gitea/gitea/assets/1135157/9e150881-c265-4074-afd7-407bb52e1934) Large screen: ![image](https://github.com/go-gitea/gitea/assets/1135157/d5cbdaa3-2962-4c4f-9595-5938981ff99e)
1 parent e53390d commit b81c013

File tree

2 files changed

+32
-22
lines changed

2 files changed

+32
-22
lines changed

templates/repo/pulls/tab_menu.tmpl

Lines changed: 24 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,26 @@
1-
<div class="ui top attached pull tabular stackable menu">
2-
<a class="item {{if .PageIsPullConversation}}active{{end}}" href="{{.Issue.Link}}">
3-
{{svg "octicon-comment-discussion"}}
4-
{{$.locale.Tr "repo.pulls.tab_conversation"}}
5-
<span class="ui small label">{{.Issue.NumComments}}</span>
6-
</a>
7-
<a class="item {{if .PageIsPullCommits}}active{{end}}" {{if .NumCommits}}href="{{.Issue.Link}}/commits"{{end}}>
8-
{{svg "octicon-git-commit"}}
9-
{{$.locale.Tr "repo.pulls.tab_commits"}}
10-
<span class="ui small label">{{if .NumCommits}}{{.NumCommits}}{{else}}-{{end}}</span>
11-
</a>
12-
<a class="item {{if .PageIsPullFiles}}active{{end}}" href="{{.Issue.Link}}/files">
13-
{{svg "octicon-diff"}}
14-
{{$.locale.Tr "repo.pulls.tab_files"}}
15-
<span class="ui small label">{{if .NumFiles}}{{.NumFiles}}{{else}}-{{end}}</span>
16-
</a>
17-
<span class="item gt-ml-auto gt-pr-0 gt-font-bold gt-df gt-ac gt-gap-3">
18-
<span><span class="text green">{{if .Diff.TotalAddition}}+{{.Diff.TotalAddition}}{{end}}</span> <span class="text red">{{if .Diff.TotalDeletion}}-{{.Diff.TotalDeletion}}{{end}}</span></span>
19-
<span class="diff-stats-bar">
20-
<div class="diff-stats-add-bar" style="width: {{Eval 100 "*" .Diff.TotalAddition "/" "(" .Diff.TotalAddition "+" .Diff.TotalDeletion "+" 0.0 ")"}}%"></div>
1+
<div class="ui pull tabs container">
2+
<div class="ui top attached pull tabular menu">
3+
<a class="item {{if .PageIsPullConversation}}active{{end}}" href="{{.Issue.Link}}">
4+
{{svg "octicon-comment-discussion"}}
5+
{{$.locale.Tr "repo.pulls.tab_conversation"}}
6+
<span class="ui small label">{{.Issue.NumComments}}</span>
7+
</a>
8+
<a class="item {{if .PageIsPullCommits}}active{{end}}" {{if .NumCommits}}href="{{.Issue.Link}}/commits"{{end}}>
9+
{{svg "octicon-git-commit"}}
10+
{{$.locale.Tr "repo.pulls.tab_commits"}}
11+
<span class="ui small label">{{if .NumCommits}}{{.NumCommits}}{{else}}-{{end}}</span>
12+
</a>
13+
<a class="item {{if .PageIsPullFiles}}active{{end}}" href="{{.Issue.Link}}/files">
14+
{{svg "octicon-diff"}}
15+
{{$.locale.Tr "repo.pulls.tab_files"}}
16+
<span class="ui small label">{{if .NumFiles}}{{.NumFiles}}{{else}}-{{end}}</span>
17+
</a>
18+
<span class="item gt-ml-auto gt-pr-0 gt-font-bold gt-df gt-ac gt-gap-3">
19+
<span><span class="text green">{{if .Diff.TotalAddition}}+{{.Diff.TotalAddition}}{{end}}</span> <span class="text red">{{if .Diff.TotalDeletion}}-{{.Diff.TotalDeletion}}{{end}}</span></span>
20+
<span class="diff-stats-bar">
21+
<div class="diff-stats-add-bar" style="width: {{Eval 100 "*" .Diff.TotalAddition "/" "(" .Diff.TotalAddition "+" .Diff.TotalDeletion "+" 0.0 ")"}}%"></div>
22+
</span>
2123
</span>
22-
</span>
24+
</div>
25+
<div class="ui tabs divider"></div>
2326
</div>

web_src/css/repo.css

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -747,8 +747,15 @@
747747
right: 1px;
748748
}
749749

750+
.repository.view.issue .pull.tabs.container {
751+
width: 100%;
752+
max-width: 100%;
753+
}
754+
750755
.repository.view.issue .pull.tabular.menu {
751-
margin-bottom: 1rem;
756+
margin-bottom: 0;
757+
overflow-x: auto;
758+
overflow-y: hidden;
752759
}
753760

754761
.repository.view.issue .pull.tabular.menu .svg {

0 commit comments

Comments
 (0)