Skip to content

Allow end-positioning a drop-down menu#5061

Merged
EreMaijala merged 4 commits intovufind-org:devfrom
maccabeelevine:menu-button-position
Feb 9, 2026
Merged

Allow end-positioning a drop-down menu#5061
EreMaijala merged 4 commits intovufind-org:devfrom
maccabeelevine:menu-button-position

Conversation

@maccabeelevine
Copy link
Member

If the content of a menu item is wide, it can force the menu off the screen (creating a horizontal scroll bar):

menu left-aligned with header, extending past the edge of the window

This allows setting bootstrap classes on the dropdown-menu such as dropdown-menu-end, to right-align the menu.

In HeaderBar-allLangs.phtml:

'menuClass' => 'dropdown-menu-end',

menu right-aligned with header, so it stays within viewport

@maccabeelevine
Copy link
Member Author

FWIW in bootstrap3, the menus were end-aligned by default. Not sure if the change was intentional, I think largely it was a good change. But for menus on the right edge of the screen (we have an extra menu) it's a problem.

@maccabeelevine maccabeelevine marked this pull request as ready for review February 5, 2026 22:10
Copy link
Contributor

@EreMaijala EreMaijala left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

While I'm fine with adding the menuClass parameter it would be framework-specific, which is a thing to avoid when possible. So I think that alignment should be a top-level parameter to keep it framework-agnostic, or in other words to keep the implementation more opaque. Internally it would set the relevant bootstrap classes.

?>

<ul class="dropdown-menu">
<ul class="dropdown-menu <?=$this->menuClass ?? '' ?>">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe use htmlAttributes helper for all attributes so that we can avoid any extra whitespace etc.

@maccabeelevine
Copy link
Member Author

@EreMaijala I made both changes. Usage now

'menuAlign' => 'end',

@demiankatz demiankatz requested a review from EreMaijala February 6, 2026 15:07
Copy link
Member

@demiankatz demiankatz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks reasonable to me, but I'll wait for @EreMaijala's final confirmation before merging. :-)

@demiankatz demiankatz added this to the 11.1 milestone Feb 6, 2026
@EreMaijala
Copy link
Contributor

Looks good to me too. :)

@EreMaijala EreMaijala merged commit b1584d4 into vufind-org:dev Feb 9, 2026
6 checks passed
@maccabeelevine maccabeelevine deleted the menu-button-position branch February 9, 2026 18:23
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants

Comments