extern/easydiffusion
1
0
Fork 1
mirror of https://github.com/easydiffusion/easydiffusion.git synced 2025-02-22 21:32:03 +01:00
Code Issues Packages Projects Releases Wiki Activity

Show the image dimensions on mouse over

Browse Source
This commit is contained in:
cmdr2 2023-03-01 15:17:27 +05:30
parent b425b43d3e
commit 24cce08580
3 changed files with 11 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/index.html
View File

@ -70,7 +70,7 @@
<div id="init_image_preview_container" class="image_preview_container">
<div id="init_image_wrapper">
<img id="init_image_preview" src="" />
<span id="init_image_size_box"></span>
<span id="init_image_size_box" class="img_bottom_label"></span>
<button class="init_image_clear image_clear_btn"><i class="fa-solid fa-xmark"></i></button>
</div>
<div id="init_image_buttons">

10
ui/media/css/main.css
View File

@ -123,6 +123,9 @@ code {
.imgPreviewItemClearBtn {
opacity: 0;
}
.imgContainer .img_bottom_label {
opacity: 0;
}
.imgPreviewItemClearBtn:hover {
background: rgb(177, 27, 0);
}
@ -132,6 +135,9 @@ code {
.imgContainer:hover > .imgPreviewItemClearBtn {
opacity: 1;
}
.imgContainer:hover > .img_bottom_label {
opacity: 60%;
}
.imgItemInfo * {
margin-bottom: 7px;
}
@ -601,6 +607,9 @@ div.img-preview img {
} */
#init_image_size_box {
border-radius: 6px 0px;
}
.img_bottom_label {
position: absolute;
right: 0px;
bottom: 0px;
@ -610,7 +619,6 @@ div.img-preview img {
text-shadow: 0px 0px 4px black;
opacity: 60%;
font-size: 12px;
border-radius: 6px 0px;
}
#editor-settings {

1
ui/media/js/main.js
View File

@ -269,6 +269,7 @@ function showImages(reqBody, res, outputContainer, livePreview) {
<span class="imgSeedLabel"></span>
</div>
<button class="imgPreviewItemClearBtn image_clear_btn"><i class="fa-solid fa-xmark"></i></button>
<span class="img_bottom_label">${imageWidth} x ${imageHeight}</span>
</div>
`
outputContainer.appendChild(imageItemElem)