diff options
| author | silverwind <me@silverwind.io> | 2022-10-14 11:43:25 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-10-14 17:43:25 +0800 |
| commit | 9dc264a2eebbd30bbff483c26bf27f0406677f77 (patch) | |
| tree | 8714d4910155ab0b91da722be11f57dc59b5bdfd | |
| parent | 4de48d5252e4482610e197264695078378321fb1 (diff) | |
| download | gitea-9dc264a2eebbd30bbff483c26bf27f0406677f77.tar.gz gitea-9dc264a2eebbd30bbff483c26bf27f0406677f77.zip | |
Diff file tree tweaks (#21446)
- Left-align the diff stat line again like previously.
- Default the file tree to collapsed view, which means the tree will
rendered initially collapsed and it may "pop in" via JS if enabled. I
think this is more desirable than having the empty space for the tree
"pop out" like it currently does.
- Mute the icon, removing color unless hovered.
- Increase icon size and vertically center it.
Before:
<img width="1271" alt="image"
src="https://user-images.githubusercontent.com/115237/195666451-55771595-0525-42b8-be1b-d03cc1cb2961.png">
After:
<img width="1280" alt="image"
src="https://user-images.githubusercontent.com/115237/195666385-c91fd0de-6dcc-4d9c-89ff-7581828fcf14.png">
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
| -rw-r--r-- | templates/repo/diff/box.tmpl | 18 | ||||
| -rw-r--r-- | web_src/less/_repository.less | 4 |
2 files changed, 12 insertions, 10 deletions
diff --git a/templates/repo/diff/box.tmpl b/templates/repo/diff/box.tmpl index 264a04f6df..15eff81099 100644 --- a/templates/repo/diff/box.tmpl +++ b/templates/repo/diff/box.tmpl @@ -14,13 +14,15 @@ {{else}} <div> <div class="diff-detail-box diff-box sticky df sb ac fw"> - <a class="diff-toggle-file-tree-button"> - {{/* the icon meaning is reversed here, "octicon-sidebar-collapse" means show the file tree */}} - {{svg "octicon-sidebar-collapse" 16 "icon hide"}} - {{svg "octicon-sidebar-expand" 16 "icon"}} - </a> - <div class="diff-detail-stats df ac"> - {{svg "octicon-diff" 16 "mr-2"}}{{.locale.Tr "repo.diff.stats_desc" .Diff.NumFiles .Diff.TotalAddition .Diff.TotalDeletion | Str2html}} + <div class="df ac fw"> + <a class="diff-toggle-file-tree-button muted df ac"> + {{/* the icon meaning is reversed here, "octicon-sidebar-collapse" means show the file tree */}} + {{svg "octicon-sidebar-collapse" 20 "icon hide"}} + {{svg "octicon-sidebar-expand" 20 "icon"}} + </a> + <div class="diff-detail-stats df ac ml-3"> + {{svg "octicon-diff" 16 "mr-2"}}{{.locale.Tr "repo.diff.stats_desc" .Diff.NumFiles .Diff.TotalAddition .Diff.TotalDeletion | Str2html}} + </div> </div> <div class="diff-detail-actions df ac"> {{if and .PageIsPullFiles $.SignedUserID (not .IsArchived)}} @@ -65,7 +67,7 @@ </script> <div id="diff-file-list"></div> <div id="diff-container"> - <div id="diff-file-tree"></div> + <div id="diff-file-tree" class="hide"></div> <div id="diff-file-boxes" class="sixteen wide column"> {{range $i, $file := .Diff.Files}} {{/*notice: the index of Diff.Files should not be used for element ID, because the index will be restarted from 0 when doing load-more for PRs with a lot of files*/}} diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index c5d2a5f50a..5dee3fccdd 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -3099,11 +3099,11 @@ td.blob-excerpt { @media @mediaMdAndDown { #diff-file-tree { - display: none; + display: none !important; } .diff-toggle-file-tree-button { - display: none; + display: none !important; } } |