Skip to content

UI/UX issue with the country selector on mobile #34

Description

@therealchrisrock

What is the location of your example repository?

No response

Which package or tool is having this issue?

Hydrogen

What version of that package or tool are you using?

2024.01.01

What version of Remix are you using?

2.5.1

Steps to Reproduce

  1. go to the online demo store example
  2. Reduce screen size to mobile view width.
  3. Click the country selector in the footer
  4. Observe styling issue

Expected Behavior

Fly-out menu for countries should be fully visible.

The following updates may fix this:

  1. Fly-out menu should have a non-transparant backgrond.
  2. Fly-out menu opens above the trigger rather than below it.

Actual Behavior

  1. Fly-out menu is cut off, extending past bottom of the page.
  2. Fly-out menu has transparant background so menu items are obscured by the element behind it.

image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions