extern/easydiffusion
1
0
Fork 1
mirror of https://github.com/easydiffusion/easydiffusion.git synced 2024-11-25 17:55:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

CSS only initimg hover, 'use as input' button

Browse Source
This commit is contained in:
JeLuF 2022-12-17 01:30:30 +01:00
parent 7eb29fa91b
commit 3b01e65e11
2 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1068,7 +1068,19 @@ div.task-initimg > img {
}
div.task-fs-initimage {
display: none;
# position: absolute;
}
div.task-initimg:hover div.task-fs-initimage {
display: block;
position: absolute;
z-index: 9999;
box-shadow: 0 0 30px #000;
margin-top:-64px;
}
div.top-right {
position: absolute;
top: 8px;
right: 8px;
}
button#save-system-settings-btn {

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

@ -743,23 +743,11 @@ async function onTaskStart(task) {
/* Hover effect for the init image in the task list */
function createInitImageHover(taskEntry) {
var $tooltip = $( taskEntry.querySelector('.task-fs-initimage') )
$( taskEntry.querySelector('div.task-initimg > img') ).on('mouseenter', function() {
var img = this,
$img = $(img),
offset = $img.offset();
$tooltip
.css({
'top': offset.top,
'left': offset.left,
'z-index': 99999,
'display': 'block'
})
.append($img.clone().css({width:"", height:""}));
})
$tooltip.on('mouseleave', function() {
$tooltip.empty().addClass('hidden');
});
var img = document.createElement('img')
img.src = taskEntry.querySelector('div.task-initimg > img').src
$tooltip.append(img)
$tooltip.append(`<div class="top-right"><button>Use as Input</button></div>`)
$tooltip.find('button').on('click', (e) => { onUseAsInputClick(null,img) } )
}
function createTask(task) {