diff --git a/src/web/stylesheets/components/operations/_operations.css b/src/web/stylesheets/components/operations/_operations.css index cfdaed9f..4e10f13d 100644 --- a/src/web/stylesheets/components/operations/_operations.css +++ b/src/web/stylesheets/components/operations/_operations.css @@ -35,6 +35,7 @@ @media only screen and ( min-width: 768px ){ #operations-dropdown { border-bottom: none; + border-top: 1px solid var(--primary-border-colour); } /* On desktop UI, the categories are always visible */ diff --git a/src/web/waiters/WindowWaiter.mjs b/src/web/waiters/WindowWaiter.mjs index c30938a6..616d7500 100755 --- a/src/web/waiters/WindowWaiter.mjs +++ b/src/web/waiters/WindowWaiter.mjs @@ -53,6 +53,9 @@ class WindowWaiter { onResizeToDesktop() { this.app.setDesktopUI(false); + // disable app popovers on li.operation elements + $(document.querySelectorAll("li.operation")).popover("enable"); + // if a window is resized past breakpoint while #recipe or #input is maximised, close these maxed panes ["recipe", "input"].forEach(paneId => this.manager.controls.setPaneMaximised(paneId, false)); @@ -66,6 +69,9 @@ class WindowWaiter { onResizeToMobile() { this.app.setMobileUI(); + // disable app popovers on li.operation elements + $(document.querySelectorAll("li.operation")).popover("disable"); + // when mobile devices' keyboards pop up, it triggers a window resize event. Here // we keep the maximised panes open until the minimise button is clicked / tapped ["recipe", "input", "output"]