diff --git a/src/web/HTMLOperation.js b/src/web/HTMLOperation.js
index ea0d4397..aae9f282 100755
--- a/src/web/HTMLOperation.js
+++ b/src/web/HTMLOperation.js
@@ -50,8 +50,8 @@ HTMLOperation.prototype.toStubHtml = function(removeIcon) {
let html = "
" + this.name;
diff --git a/src/web/OperationsWaiter.js b/src/web/OperationsWaiter.js
index 992b737e..78319a0e 100755
--- a/src/web/OperationsWaiter.js
+++ b/src/web/OperationsWaiter.js
@@ -155,7 +155,22 @@ OperationsWaiter.prototype.getSelectedOp = function(ops) {
*/
OperationsWaiter.prototype.opListCreate = function(e) {
this.manager.recipe.createSortableSeedList(e.target);
- $("[data-toggle=popover]").popover();
+ // Allows popover to gain focus for eg. pressing buttons/scrolling
+ $(".operation").popover({trigger: "manual", html: true, animation: true})
+ .on("mouseenter", function () {
+ const _this = this;
+ $(this).popover("show");
+ $(".popover").on("mouseleave", function () {
+ $(_this).popover("hide");
+ });
+ }).on("mouseleave", function () {
+ const _this = this;
+ setTimeout(function () {
+ if (!$(".popover:hover").length) {
+ $(_this).popover("hide");
+ }
+ }, 50);
+ });
};
diff --git a/src/web/stylesheets/utils/_overrides.css b/src/web/stylesheets/utils/_overrides.css
index 8957071a..36069cd5 100755
--- a/src/web/stylesheets/utils/_overrides.css
+++ b/src/web/stylesheets/utils/_overrides.css
@@ -142,6 +142,10 @@ optgroup {
border-color: var(--popover-border-colour);
}
+.popover-content {
+ max-height: 90vh;
+ overflow-y: auto;
+}
.popover.right>.arrow {
border-right-color: var(--popover-border-colour);