Fix Show/hide filetree button on small displays (#27881)

the gt-df's display:flex !important did override the display:none on small displays

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
sebastian-sauer 2023-11-17 19:35:51 +01:00 committed by GitHub
parent f63b116697
commit e31c6cfe6e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 2 additions and 22 deletions

View file

@ -3,7 +3,7 @@
<div class="diff-detail-box diff-box"> <div class="diff-detail-box diff-box">
<div class="gt-df gt-ac gt-fw"> <div class="gt-df gt-ac gt-fw">
{{if $showFileTree}} {{if $showFileTree}}
<button class="diff-toggle-file-tree-button gt-df gt-ac not-mobile" data-show-text="{{ctx.Locale.Tr "repo.diff.show_file_tree"}}" data-hide-text="{{ctx.Locale.Tr "repo.diff.hide_file_tree"}}"> <button class="diff-toggle-file-tree-button not-mobile btn interact-fg" data-show-text="{{ctx.Locale.Tr "repo.diff.show_file_tree"}}" data-hide-text="{{ctx.Locale.Tr "repo.diff.hide_file_tree"}}">
{{/* the icon meaning is reversed here, "octicon-sidebar-collapse" means show the file tree */}} {{/* the icon meaning is reversed here, "octicon-sidebar-collapse" means show the file tree */}}
{{svg "octicon-sidebar-collapse" 20 "icon gt-hidden"}} {{svg "octicon-sidebar-collapse" 20 "icon gt-hidden"}}
{{svg "octicon-sidebar-expand" 20 "icon gt-hidden"}} {{svg "octicon-sidebar-expand" 20 "icon gt-hidden"}}
@ -89,7 +89,7 @@
{{end}} {{end}}
<div id="diff-container"> <div id="diff-container">
{{if $showFileTree}} {{if $showFileTree}}
<div id="diff-file-tree" class="gt-hidden"></div> <div id="diff-file-tree" class="gt-hidden not-mobile"></div>
<script> <script>
if (diffTreeVisible) document.getElementById('diff-file-tree').classList.remove('gt-hidden'); if (diffTreeVisible) document.getElementById('diff-file-tree').classList.remove('gt-hidden');
</script> </script>

View file

@ -2743,26 +2743,6 @@ tbody.commit-list {
overflow-y: auto; overflow-y: auto;
} }
.diff-toggle-file-tree-button {
background: none;
border: none;
user-select: none;
color: inherit;
}
.diff-toggle-file-tree-button:hover {
color: var(--color-primary);
}
@media (max-width: 991.98px) {
#diff-file-tree {
display: none !important;
}
.diff-toggle-file-tree-button {
display: none !important;
}
}
.ui.message.unicode-escape-prompt { .ui.message.unicode-escape-prompt {
margin-bottom: 0; margin-bottom: 0;
border-radius: 0; border-radius: 0;