Skip to content

Remove align-items: center override on dropdown wrapper - #838

Merged
jjroelofs merged 1 commit into
8.xfrom
jur/8.x/837-fix-dropdown-caret-height
Jul 29, 2026
Merged

Remove align-items: center override on dropdown wrapper#838
jjroelofs merged 1 commit into
8.xfrom
jur/8.x/837-fix-dropdown-caret-height

Conversation

@jjroelofs

Copy link
Copy Markdown
Collaborator

Linked issues

Solution

The theme's .nav > li > .bs-dropdown-wrapper rule in dxpr-theme-header--top.scss set align-items: center, overriding the bs-dropdown-extended plugin's align-items: stretch. This caused the caret <button> to collapse to the intrinsic height of its triangle icon (~12px) instead of stretching to the full menu bar height.

The fix removes align-items: center from the wrapper rule, allowing the plugin's stretch to take effect. Both the nav link and the caret button now fill the full wrapper height, restoring WCAG AAA compliant touch target sizing.

The affix/scroll state (line 104) is unaffected because its wildcard selector .bs-dropdown-wrapper > * already sets explicit height on all children including the caret.

The mobile mode has no align-items overrides on wrapper elements and is not affected.

Checklist

  • I have read the CONTRIBUTING.md document.
  • My commit messages follow the contributing standards and style of this project.
  • My code follows the coding standards and style of this project.
  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to change)
  • Need to run update.php after code changes
  • Requires a change to end-user documentation.
  • Requires a change to developer documentation.
  • Requires a change to QA tests.
  • Requires a new QA test.
  • I have updated the documentation accordingly.
  • All new and existing tests passed.

The theme's .bs-dropdown-wrapper rule set align-items: center, which
overrode the bs-dropdown-extended plugin's align-items: stretch. This
caused the caret button to collapse to the intrinsic height of its
triangle icon instead of stretching to the full menu bar height,
reducing the clickable area well below WCAG AAA touch target size.

Fixes: #837
@jjroelofs
jjroelofs merged commit fd5116f into 8.x Jul 29, 2026
5 checks passed
@jjroelofs
jjroelofs deleted the jur/8.x/837-fix-dropdown-caret-height branch July 29, 2026 06:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant