mirror of
https://github.com/go-gitea/gitea
synced 2025-07-22 18:28:37 +00:00
Improve Image Diff UI (#26696)
1. Use `is-loading` instead of `ui loader` 2. Introduce class name `image-diff-tabs`, instead of searching `gt-hidden`, which is fragile 3. Align the UI elements, see the screenshots.
This commit is contained in:
@@ -1,6 +1,14 @@
|
||||
.image-diff-tabs {
|
||||
min-height: 60px;
|
||||
|
||||
}
|
||||
.image-diff-tabs.is-loading .tab {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.image-diff-container {
|
||||
text-align: center;
|
||||
padding: 1em 0;
|
||||
padding: 0.5em 0 1em;
|
||||
}
|
||||
|
||||
.image-diff-container img {
|
||||
@@ -31,6 +39,7 @@
|
||||
|
||||
.image-diff-container .diff-swipe {
|
||||
margin: auto;
|
||||
padding: 1em 0;
|
||||
}
|
||||
|
||||
.image-diff-container .diff-swipe .swipe-frame {
|
||||
@@ -89,7 +98,7 @@
|
||||
}
|
||||
|
||||
.image-diff-container .diff-overlay .overlay-frame {
|
||||
margin: 0 auto;
|
||||
margin: 1em auto 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user