diff options
| author | Giteabot <teabot@gitea.io> | 2023-04-05 06:49:22 -0400 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-04-05 13:49:22 +0300 |
| commit | df74ee0376875007d8ab4d0271a679b9d1846325 (patch) | |
| tree | 998bfa889fee7ad7ce17338aee179411d13ecdee /web_src | |
| parent | 8d88f148d7799ef7ea2c5eba4434f776bce15580 (diff) | |
| download | gitea-df74ee0376875007d8ab4d0271a679b9d1846325.tar.gz gitea-df74ee0376875007d8ab4d0271a679b9d1846325.zip | |
Scroll collapsed file into view (#23702) (#23929)
Backport #23702 by @jpraet
Fixes #23701, #23515.
Alternate approach to #23604 using CSS scroll-margin-top, which is also
taken into account for direct links to files in a diff:
* On the PR diff, this currently shows the previous file first:
https://try.gitea.io/jpraet/test/pulls/13/files#diff-b94d08b409f9d05fb65b6cccaf7b3e4ecc7cc333
* On the commit diff, the first line of the linked file is currently
under the sticky header:
https://try.gitea.io/jpraet/test/commit/1a19e6b14e31d295b7372f3346580c3e85690ff5#diff-b94d08b409f9d05fb65b6cccaf7b3e4ecc7cc333
Co-authored-by: Jimmy Praet <jimmy.praet@ksz-bcss.fgov.be>
Diffstat (limited to 'web_src')
| -rw-r--r-- | web_src/css/repository.css | 7 | ||||
| -rw-r--r-- | web_src/css/review.css | 4 | ||||
| -rw-r--r-- | web_src/js/features/file-fold.js | 3 |
3 files changed, 12 insertions, 2 deletions
diff --git a/web_src/css/repository.css b/web_src/css/repository.css index 4bb49dc439..d67442b00a 100644 --- a/web_src/css/repository.css +++ b/web_src/css/repository.css @@ -1862,6 +1862,13 @@ .diff-file-box { border: 1px solid transparent; border-radius: var(--border-radius); + scroll-margin-top: 47px; /* match .repository .diff-detail-box */ +} + +@media (max-width: 991px) { + .diff-file-box { + scroll-margin-top: 77px; /* match .repository .diff-detail-box */ + } } /* TODO: this can potentially be made "global" by removing the class prefix */ diff --git a/web_src/css/review.css b/web_src/css/review.css index 7e628a9dfc..9e06ba133e 100644 --- a/web_src/css/review.css +++ b/web_src/css/review.css @@ -242,12 +242,12 @@ a.blob-excerpt:hover { display: none; } -.pull.files.diff [id] { +.pull.files.diff .comment { scroll-margin-top: 99px; } @media (max-width: 991px) { - .pull.files.diff [id] { + .pull.files.diff .comment { scroll-margin-top: 130px; } } diff --git a/web_src/js/features/file-fold.js b/web_src/js/features/file-fold.js index 0d5be7cf60..8321b9b19e 100644 --- a/web_src/js/features/file-fold.js +++ b/web_src/js/features/file-fold.js @@ -8,6 +8,9 @@ import {svg} from '../svg.js'; export function setFileFolding(fileContentBox, foldArrow, newFold) { foldArrow.innerHTML = svg(`octicon-chevron-${newFold ? 'right' : 'down'}`, 18); fileContentBox.setAttribute('data-folded', newFold); + if (newFold && fileContentBox.getBoundingClientRect().top < 0) { + fileContentBox.scrollIntoView(); + } } // Like `setFileFolding`, except that it automatically inverts the current file folding state. |