diff options
author | zeripath | 2021-10-21 20:38:29 +0100 |
---|---|---|
committer | GitHub | 2021-10-21 20:38:29 +0100 |
commit | cae8c63517d310b0f58820b4713a24e245b73aff (patch) | |
tree | b14b862dca58a421c7590d2ab91e2d7b154e84c1 | |
parent | 8ace5c1161c1d04e4698e2d9f98c6d8c2f303414 (diff) |
Fix SVG side by side comparison link (#17375) (#17391)
Backport #17375
Define unique names for image tabs in pull requests, in order to toggle tabs correctly when multiple are displayed on one page.
Fixes position of swipe-bar so it does not overlay other UI components when scrolling.
Signed-off-by: Mario Lubenka <mario.lubenka@googlemail.com>
Co-authored-by: Mario Lubenka <mario.lubenka@googlemail.com>
-rw-r--r-- | templates/repo/diff/image_diff.tmpl | 12 | ||||
-rw-r--r-- | web_src/less/features/imagediff.less | 1 |
2 files changed, 6 insertions, 7 deletions
diff --git a/templates/repo/diff/image_diff.tmpl b/templates/repo/diff/image_diff.tmpl index 33fa8c9e2..3d100ac99 100644 --- a/templates/repo/diff/image_diff.tmpl +++ b/templates/repo/diff/image_diff.tmpl @@ -6,15 +6,15 @@ <div class="image-diff" data-path-before="{{$imagePathOld}}" data-path-after="{{$imagePathNew}}"> <div class="ui secondary pointing tabular top attached borderless menu stackable new-menu"> <div class="new-menu-inner"> - <a class="item active" data-tab="diff-side-by-side">{{.root.i18n.Tr "repo.diff.image.side_by_side"}}</a> + <a class="item active" data-tab="diff-side-by-side-{{ .file.Index }}">{{.root.i18n.Tr "repo.diff.image.side_by_side"}}</a> {{if and .blobBase .blobHead}} - <a class="item" data-tab="diff-swipe">{{.root.i18n.Tr "repo.diff.image.swipe"}}</a> - <a class="item" data-tab="diff-overlay">{{.root.i18n.Tr "repo.diff.image.overlay"}}</a> + <a class="item" data-tab="diff-swipe-{{ .file.Index }}">{{.root.i18n.Tr "repo.diff.image.swipe"}}</a> + <a class="item" data-tab="diff-overlay-{{ .file.Index }}">{{.root.i18n.Tr "repo.diff.image.overlay"}}</a> {{end}} </div> </div> <div class="hide"> - <div class="ui bottom attached tab image-diff-container active" data-tab="diff-side-by-side"> + <div class="ui bottom attached tab image-diff-container active" data-tab="diff-side-by-side-{{ .file.Index }}"> <div class="diff-side-by-side"> {{if .blobBase }} <span class="side"> @@ -49,7 +49,7 @@ </div> </div> {{if and .blobBase .blobHead}} - <div class="ui bottom attached tab image-diff-container" data-tab="diff-swipe"> + <div class="ui bottom attached tab image-diff-container" data-tab="diff-swipe-{{ .file.Index }}"> <div class="diff-swipe"> <div class="swipe-frame"> <span class="before-container"><img class="image-before" /></span> @@ -63,7 +63,7 @@ </div> </div> </div> - <div class="ui bottom attached tab image-diff-container" data-tab="diff-overlay"> + <div class="ui bottom attached tab image-diff-container" data-tab="diff-overlay-{{ .file.Index }}"> <div class="diff-overlay"> <div class="overlay-frame"> <div class="ui centered"> diff --git a/web_src/less/features/imagediff.less b/web_src/less/features/imagediff.less index f38ea98d7..55a67c6ec 100644 --- a/web_src/less/features/imagediff.less +++ b/web_src/less/features/imagediff.less @@ -54,7 +54,6 @@ } .swipe-bar { - z-index: 100; position: absolute; height: 100%; top: 0; |