diff options
| author | silverwind <me@silverwind.io> | 2023-04-03 17:11:34 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-04-03 11:11:34 -0400 |
| commit | d0c406a86f7b59af761fb7fe5047aeaf6e506f43 (patch) | |
| tree | c1438010ce9f5e939f8e0c7b8527200287c3104f | |
| parent | 6eb856c614e4ff589b9373670ae26a1cea50339b (diff) | |
| download | gitea-d0c406a86f7b59af761fb7fe5047aeaf6e506f43.tar.gz gitea-d0c406a86f7b59af761fb7fe5047aeaf6e506f43.zip | |
Fix review box viewport overflow issue (#23800)
Fix regression that came likely from
https://github.com/go-gitea/gitea/pull/23271:
Long lines of text currently cause the review box's CodeMirror element
to resize which apparently is not recognized by [popper's resize
detection](https://popper.js.org/docs/v2/modifiers/event-listeners/) and
which causes the element to go partially out of viewport until a reflow
happens:
Fix this by setting the element to a static width derived from viewport
width and remove the previously clumsy media queries.
| -rw-r--r-- | web_src/css/review.css | 26 |
1 files changed, 4 insertions, 22 deletions
diff --git a/web_src/css/review.css b/web_src/css/review.css index 913a7e9df2..724e68ebb7 100644 --- a/web_src/css/review.css +++ b/web_src/css/review.css @@ -224,28 +224,10 @@ a.blob-excerpt:hover { max-height: calc(100vh - 360px); } -@media (max-width: 767px) { - .review-box-panel .CodeMirror-scroll { - max-width: calc(100vw - 70px); - } -} - -@media (min-width: 768px) and (max-width: 991px) { - .review-box-panel .CodeMirror-scroll { - max-width: 700px; - } -} - -@media (min-width: 992px) and (max-width: 1200px) { - .review-box-panel .CodeMirror-scroll { - max-width: 800px; - } -} - -@media (min-width: 1201px) { - .review-box-panel .CodeMirror-scroll { - max-width: 900px; - } +.review-box-panel .editor-toolbar, +.review-box-panel .CodeMirror-scroll { + width: min(calc(100vw - 2em), 800px); + max-width: none; } .review-box-panel .combo-markdown-editor textarea { |