Opened 8 years ago

Closed 8 years ago

Last modified 8 years ago

#1795 closed defect (bug) (fixed)

Sub-navigation responsiveness

Reported by: samuelsidler's profile samuelsidler Owned by: pento's profile pento
Milestone: Priority: low
Component: Make (Get Involved) / P2 Keywords:


The sub-navigation has a few issues with responsiveness.

  1. At 1024x768 (iPad landscape), the items are visible but are not in the blue sub navigation. Instead, they're half in, half out (see screenshot).
  2. At smaller sizes, the sub-navigation should minimize into a drop down, exactly as we do on the plugin directory beta. Currently, sub-navigation disappears entirely.
  3. The site name (and icon) needs a bit more margin/padding on the left, to at least match where content starts.

Related, maybe should change the breakpoint? Right now, make/meta shows no items at 768x1024, but the subnav has enough room to show them. Can it be a flexible breakpoint depending on how many items are in the subnav (as that changes between sites)?

Attachments (1)

Screen Shot 2016-07-01 at 11.13.57 AM.png (160.0 KB) - added by samuelsidler 8 years ago.

Download all attachments as: .zip

Change History (6)

#1 @samuelsidler
8 years ago

  • Owner set to pento
  • Status changed from new to assigned

#2 @pento
8 years ago

[3619] makes the nav menu visible in the side bar.

#3 @pento
8 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 3632:

Breathe: Fix navigation responsiveness.

The nav bar needed some re-shuffling and CSS tweaks to make it responsive. This also fixes alignment issues when a viewport crosses back and forth between the threshold for moving the navigation to the sidebar.

Fixes #1795.

#4 @pento
8 years ago

In 3633:

Breathe: Align the menu correctly in the sidebar.

After [3632], the menu was aligned incorrectly on small screens.

See #1795.

#5 @samuelsidler
8 years ago

In 3641:

Breathe: Various style improvements to fix alignment issues.

See #1795.

Note: See TracTickets for help on using tickets.