search

Xceptance / posters-demo-store

A simple e-commerce application for demoing load testing, test automation, and functional testing.
Apache License 2.0
4 stars 4 forks source link

Mobile: rearrange header #200

Open KFie opened 1 year ago

KFie commented 1 year ago

Environment: mobile devices

I see several issues regarding the current arrangement of the mobile header:

  1. The category navigation icon currently displays on the right-hand side which is not very common
  2. The store name and the category navigation display on the same line; on smaller screens (example here: example here: iPhone 12 mini, iOS 16.3.1), there is almost no padding between the store name and the category navigation icon. This will become even more prevailing with resolution of https://github.com/Xceptance/posters-demo-store/issues/185.
  3. The user and cart links are part of the main navigation menu which is not very user-friendly. The accessibility of these two needs to be improved.

Suggestions:

  1. Move category navigation icon to the left-hand side and let flyout also expand from the left-hand side
  2. Do not display the full store name but use the X icon only or "X Posters"
  3. Add account icon and cart icon to top navigation
  4. Tap on account opens page where user can either register or log in
  5. Tap on cart opens cart page

2023-08-11_13h08_27

freddyka commented 10 months ago

Issue not fixed for poster v2.1.

Note: -Do not display the full store name but use the X icon only or "X Posters" --> not fixed -Add account icon and cart icon to top navigation--> not fixed -Tap on account opens a page where user can either register or log in--> not fixed -Tap on cart opens cart page--> not fixed -also there is no search bar anymore -there is another issue (see #199) where the menu isn't working anymore (you can't click the menu button)