Uploaded image for project: 'Planet4'
  1. Planet4
  2. PLANET-6510

Navigation Bar: implement a tabs menu on mobile

XMLWordPrintable

    • Icon: Task Task
    • Resolution: Fixed
    • Icon: Should have Should have
    • 2.73.1
    • 2
    • Navigation
    • Sprint #177, Sprint #178
    • tavros

      Implement a tabs menu on mobile for the primary navigation in addition to the burger menu.

      Requirements

      • The tabs should lead to each parent/category page of the site.
      • They should have a selected state on the frontend regardless the level of hierarchy (example: Parent page > sub page).
      • To view all items users would be able to swipe horizontally.
      • The tabs menu should be sticky at the top and disappear when users start scrolling down the page.

      Feature Flag

      • Information Architecture > Enable mobile tabs menu.
        Since this is the first IA feature flag, lets's create a new WP option (eg. planet4_ia) and make sure these are not localized by WPML.

      To be refined

      • Investigate: exclude on Posts and special pages (Search, 404, etc). Create follow up ticket.
      • Look also into the native navigation block introduced in WP 5.9

      Designs (Sizes M and S)

        1. navigation bar.jpg
          753 kB
          Houssam Saleh
        2. Tabs_menu_animation.mp4
          610 kB
          Houssam Saleh

            fhernand Florent Hernandez (Inactive)
            mfatome Magali Fatome (Inactive)
            Houssam Saleh Houssam Saleh
            Maud Leray Maud Leray
            Votes:
            0 Vote for this issue
            Watchers:
            0 Start watching this issue

              Created:
              Updated:
              Resolved: