WordPress / wporg-main-2022

A block-based child theme for WordPress.org, plus local environment
64 stars 26 forks source link

Use chevron icon for local nav mobile menus #335

Closed adamwoodnz closed 10 months ago

adamwoodnz commented 10 months ago

Closes #334 Depends on https://github.com/WordPress/wporg-mu-plugins/pull/480

Changes the local navigation blocks to use the 'menu' (3 bar) icon on mobile, so that in conjunction with https://github.com/WordPress/wporg-mu-plugins/pull/480 the button changes from the word 'Menu' to a chevron icon.

Screenshots

Page:State Before After
About:Closed localhost_8888_about_domains_(Samsung Galaxy S20 Ultra) localhost_8888_about_domains_(Samsung Galaxy S20 Ultra) (2)
About:Open localhost_8888_about_domains_(Samsung Galaxy S20 Ultra) (1) localhost_8888_about_domains_(Samsung Galaxy S20 Ultra) (3)
Counter:Closed localhost_8888_download_counter_(Samsung Galaxy S20 Ultra) localhost_8888_download_counter_(Samsung Galaxy S20 Ultra) (2)
Counter:Open localhost_8888_download_counter_(Samsung Galaxy S20 Ultra) (1) localhost_8888_download_counter_(Samsung Galaxy S20 Ultra) (3)

How to test the changes in this Pull Request:

  1. Unsure your mu-plugins is on https://github.com/WordPress/wporg-mu-plugins/pull/480
  2. Open a page from each About sub section, eg. requirements, domains, and philosophy, plus the download counter
  3. Simulate mobile screen size
  4. Check that the icon in the mobile menu button is a chevron
  5. Open the menu
  6. Check the the chevron icon has been flipper vertically
  7. Close the menu
jasmussen commented 10 months ago

Change looks good!