From b4a7b5d52098e007aeeb2287cd7948d9fe30e72a Mon Sep 17 00:00:00 2001 From: Reece Browne <74901996+reecebrowne@users.noreply.github.com> Date: Sat, 5 Jul 2025 16:01:40 +0100 Subject: [PATCH] dropdown fixes (#3879) # Description of Changes Please provide a summary of the changes, including: - What was changed - Why the change was made - Any challenges encountered Closes #(issue_number) --- ## Checklist ### General - [ ] I have read the [Contribution Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md) - [ ] I have read the [Stirling-PDF Developer Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/DeveloperGuide.md) (if applicable) - [ ] I have read the [How to add new languages to Stirling-PDF](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/HowToAddNewLanguage.md) (if applicable) - [ ] I have performed a self-review of my own code - [ ] My changes generate no new warnings ### Documentation - [ ] I have updated relevant docs on [Stirling-PDF's doc repo](https://github.com/Stirling-Tools/Stirling-Tools.github.io/blob/main/docs/) (if functionality has heavily changed) - [ ] I have read the section [Add New Translation Tags](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/HowToAddNewLanguage.md#add-new-translation-tags) (for new translation tags only) ### UI Changes (if applicable) - [ ] Screenshots or videos demonstrating the UI changes are attached (e.g., as comments or direct attachments in the PR) ### Testing (if applicable) - [ ] I have tested my changes locally. Refer to the [Testing Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/DeveloperGuide.md#6-testing) for more details. --------- Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> --- .../src/main/resources/static/css/navbar.css | 14 +------------- .../main/resources/templates/fragments/common.html | 11 ++++++++++- 2 files changed, 11 insertions(+), 14 deletions(-) diff --git a/stirling-pdf/src/main/resources/static/css/navbar.css b/stirling-pdf/src/main/resources/static/css/navbar.css index 384d54186..018727776 100644 --- a/stirling-pdf/src/main/resources/static/css/navbar.css +++ b/stirling-pdf/src/main/resources/static/css/navbar.css @@ -384,19 +384,7 @@ html[dir="rtl"] .dropdown-menu { right: auto; } -html[dir="ltr"] .dropdown-menu[data-bs-popper] { - top: auto; - left: auto; - right: 0; - margin-top: 0 !important; -} - -html[dir="rtl"] .dropdown-menu[data-bs-popper] { - top: auto; - left: 0; - right: auto; - margin-top: 0 !important; -} +/* Bootstrap Popper positioning overrides removed - dropdowns now position naturally relative to their buttons */ .dropdown-menu-wrapper { padding: 1.5rem 0; diff --git a/stirling-pdf/src/main/resources/templates/fragments/common.html b/stirling-pdf/src/main/resources/templates/fragments/common.html index 0f9db7b76..1bda883d2 100644 --- a/stirling-pdf/src/main/resources/templates/fragments/common.html +++ b/stirling-pdf/src/main/resources/templates/fragments/common.html @@ -85,7 +85,16 @@ const dropdowns = document.querySelectorAll('.dropdown-menu'); dropdowns.forEach(dropdown => { dropdown.style.transform = `scale(${dropdownScale})`; - dropdown.style.transformOrigin = 'top center'; + + // Use different transform origins based on dropdown position + const parentItem = dropdown.closest('.nav-item'); + const navbar = dropdown.closest('.navbar-nav'); + + // Check if this is a right-aligned dropdown (language, favorites, search, etc.) + const isRightAligned = navbar && navbar.classList.contains('flex-nowrap') && + !parentItem?.closest('.dropdown-mega'); + + dropdown.style.transformOrigin = isRightAligned ? 'top right' : 'top left'; }); console.log('Applied dropdown scale:', dropdownScale);