TRKJ/gitea
2
0
Fork 0
mirror of https://gitee.com/gitea/gitea synced 2025-11-04 08:30:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

Improve Image Diff UI (#26696)

Browse Source 
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:
wxiaoguang
2023-08-24 20:13:23 +08:00
committed by GitHub
parent 4de2244697
commit 09faf43ef8
3 changed files with 16 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
web_src/css/features/imagediff.css
View File

@@ -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;
}