Skip to content

Riverbank v1.0.16 mobile menu links align left after navigation item width change #109

@pirate-bot

Description

@pirate-bot

Bug Description

A customer reports that after updating Riverbank to the latest version, mobile menu items that previously appeared right-aligned now appear left-aligned, with no apparent setting to restore the previous alignment.

Expected: a header navigation block configured with right alignment continues to present mobile menu links consistently with that alignment.

Actual: in the open mobile navigation overlay, individual navigation items are styled as full viewport-width flex rows. For items without a submenu toggle, the lone link remains at the inline start, so menu items appear left-aligned.

Impact: sites using Riverbank’s default/right-aligned header navigation can show a visible mobile layout regression after updating to 1.0.16.

Code reference

  • parts/header.html:9 defines the header core/navigation block with "justifyContent":"right".
  • assets/css/src/blocks/_navigation.scss:28-38 applies item-level flex layout, padding, and width: 100vw inside the open mobile navigation overlay.
  • style.css:10 identifies the current theme version as 1.0.16.

Customer Context

  • Source: WordPress.org forum thread, HelpScout conversation 3325160332.
  • Product: Riverbank theme.
  • Customer wording: “with the latest version of the theme mobile menu items are now aligned to the left” and asks how to move them “back to the right as they appeared before.”
  • No site URL, browser/device details, or screenshot were included in the transcript.

Reproduction Notes

Known reproduction path from repo inspection:

  1. Use Riverbank 1.0.16.
  2. Use the default header navigation from parts/header.html, which includes "justifyContent":"right".
  3. Open the site at a mobile viewport where the navigation renders as the responsive overlay menu.
  4. Open the mobile menu.
  5. Observe that plain top-level menu links render at the left/start side of the full-width navigation item row.

Missing from customer transcript: live site URL, screenshot, exact viewport/device, browser, and whether the header template was customized.

Investigation report

Conclusion

Riverbank v1.0.16 introduced mobile navigation styling that plausibly explains the reported regression. The theme’s default header navigation is configured as right-aligned, but the open mobile overlay now gives each .wp-block-navigation-item a full viewport width and uses a row flex layout. A menu item with only one link child naturally appears at the left/start edge of that full-width row.

Where this likely occurs

  • assets/css/src/blocks/_navigation.scss:28-38, .wp-block-navigation__responsive-container-content .wp-block-navigation-item: applies display: flex, justify-content: space-between, padding, width: 100vw, and box-sizing: border-box to every mobile overlay navigation item.
  • assets/css/src/blocks/_navigation.scss:40-53, .wp-block-navigation__submenu-container and .is-submenu-open: related submenu display rules added in the same mobile overlay block.
  • parts/header.html:9, core/navigation: the default header navigation block declares "justifyContent":"right", giving evidence that right alignment is part of the shipped template configuration.
  • style.css:10, theme header Version: current checkout is 1.0.16, matching the customer’s “latest version” report.
  • CHANGELOG.md:1, Version 1.0.16: confirms the latest release date and comparison range.

Engineering considerations

  • The v1.0.15..v1.0.16 diff adds the item-level mobile navigation styles in assets/css/src/blocks/_navigation.scss; the previous v1.0.15 stylesheet did not contain the full-width .wp-block-navigation-item block.
  • The same release history includes commits labeled fix: make navigation block responsive, fix: add box-sizing to navigation item for consistent layout, and fix: navigation block in mobile view, so this behavior appears connected to a targeted mobile navigation change rather than an unrelated dependency-only update.
  • Existing GitHub issue status is unknown because the local environment does not have the gh executable available for duplicate search.

What to verify or explore next

  • Browser reproduction on a Riverbank 1.0.16 site using the default header/navigation template and a mobile viewport.
  • Visual comparison against v1.0.15 for the same menu markup.
  • Behavior when menu items include submenu toggles versus plain top-level links, since space-between affects those cases differently.

Unknowns / follow-up

  • Customer’s exact WordPress version, active plugins, device/browser, and site URL were not provided.
  • Whether a user-edited header template contains additional navigation block alignment settings is unknown.

Triage Reasoning

Confirmed as a likely Riverbank v1.0.16 regression. The latest release added mobile navigation item styling that makes each menu item full viewport width; single-link items then render at the inline start, which matches the customer’s report that mobile menu items moved from right-aligned to left-aligned.


Source: HelpScout #3325160332
Generated by bug-report-triage workflow (ID: bug-report-triage_6a09d806cd13f0.87611754)

Metadata

Metadata

Type

No fields configured for Bug.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions