frodovdr
/
node-red
mirror of https://github.com/node-red/node-red.git
1
0
Fork 0
Code Issues Releases Wiki Activity

[popover] Allow hover-type popovers to contain buttons

This commit is contained in:
Nick O'Leary 2020-05-06 16:12:07 +01:00
parent 9fbfc3d677
commit 010e20989a
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
2 changed files with 31 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
packages/node_modules/@node-red/editor-client/src/js/ui/common/popover.js vendored
View File

@ -136,6 +136,23 @@ RED.popover = (function() {
closePopup(true);
});
}
if (trigger === 'hover' && options.interactive) {
div.on('mouseenter', function(e) {
clearTimeout(timer);
active = true;
})
div.on('mouseleave', function(e) {
if (timer) {
clearTimeout(timer);
}
if (active) {
timer = setTimeout(function() {
active = false;
closePopup();
},delay.hide);
}
})
}
if (instant) {
div.show();
} else {
@ -163,8 +180,10 @@ RED.popover = (function() {
if (trigger === 'hover') {
target.on('mouseenter',function(e) {
clearTimeout(timer);
active = true;
timer = setTimeout(openPopup,delay.show);
if (!active) {
active = true;
timer = setTimeout(openPopup,delay.show);
}
});
target.on('mouseleave disabled', function(e) {
if (timer) {

10
packages/node_modules/@node-red/editor-client/src/sass/popover.scss vendored
View File

@ -150,6 +150,16 @@
.red-ui-popover a.red-ui-button,
.red-ui-popover button.red-ui-button {
&:not(.primary) {
border-color: $popover-button-border-color;
background: $popover-background;
color: $popover-color !important;
}
&:not(.primary):not(.disabled):not(.ui-button-disabled):hover {
border-color: $popover-button-border-color-hover;
}
&.primary {
border-color: $popover-button-border-color;
}