Skip to content

Move pin button to be sibling of nav item link in new navigation

Scott de Jonge requested to merge super-sidebar-nav-item-button-outside into master

What does this MR do and why?

Move pin button to be sibling of nav item link in new navigation

  • Move <button> to be sibling of <nav-item> link element
  • Remove custom nav-item-link and nav-item-badge class usage and styles
  • Add show-on-focus-or-hover--control control class
  • Add hide-on-focus-or-hover context/control/target classes
  • Update disable_animations.scss usage of :not() selector to remove nav-item-link selector, opt for direct selector button.show-on-focus-or-hover--target

Screenshots or screen recordings

Before After
CleanShot_2023-09-06_at_15.49.36 CleanShot_2023-09-06_at_15.48.21
CleanShot_2023-09-06_at_15.56.01 CleanShot_2023-09-06_at_15.58.06

How to set up and validate locally

  1. Review nav item on page with pin-able items e.g. MR or Issue http://gdk.test:3000/flightjs/Flight/-/merge_requests/4
    1. Validate item with badge still renders pin button on :hover/:focus
  2. Open "Search or go to..." and validate frequent project/groups list still have remove "-" button display on :hover/:focus

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Scott de Jonge

Merge request reports