diff --git a/frappe/public/js/frappe/form/controls/link.js b/frappe/public/js/frappe/form/controls/link.js index 0a292cb406..3bef4b1e42 100644 --- a/frappe/public/js/frappe/form/controls/link.js +++ b/frappe/public/js/frappe/form/controls/link.js @@ -287,6 +287,16 @@ frappe.ui.form.ControlLink = class ControlLink extends frappe.ui.form.ControlDat // hide link arrow to doctype if none is set me.$link.toggle(false); } + + const dropdown = this.awesomplete.ul; + const dropdownRect = dropdown.getBoundingClientRect(); + const viewportWidth = window.innerWidth; + + if (dropdownRect.right > viewportWidth) { + dropdown.classList.add("awesomplete-align-right"); + } else { + dropdown.classList.remove("awesomplete-align-right"); + } }); this.$input.on("awesomplete-close", (e) => { diff --git a/frappe/public/scss/common/awesomeplete.scss b/frappe/public/scss/common/awesomeplete.scss index 23a28e2c48..328286ee96 100644 --- a/frappe/public/scss/common/awesomeplete.scss +++ b/frappe/public/scss/common/awesomeplete.scss @@ -35,6 +35,11 @@ z-index: 4; min-width: 250px; + &.awesomplete-align-right { + left: auto; + right: 0; + } + & > li, & > [role="option"] { &:has(p[title="filter_description__link_option"]) {