Openfoodnetwork: Enterprise Registration - Scroll on first step

[lin-d-hop]

Stage one of the enterprise registration is not intuitive.

On my 13" screen you cannot see the Continue button at all. It is totally hidden making it unclear to the user what the next step is after they tick the box.

Can this be changed so that there is NO scroll on this screen, such that the full red button is displayed to the user. Perhaps something like this....

[sauloperez]

I experience the same problem. Is there any reason why we placed the content in a fixed-height box in the first place? I'd remove the limitation of the light grey box and allow the content to fill the page as usual. Only on very small screens you would need to scroll down your browser window.

[daniellemoorhead]

I think it's fair to say that there wouldn't be a particularly good reason, so let's change it.

Could we but the angular for newbies label on this?

[sauloperez]

I'm not sure there's even angular there. It seems to be a CSS only thing

EDIT
Yes, after better looking at it is indeed an agular component (which I have no idea how it works).

[RachL]

Hi all ! I've noticed that on my tablet and my mobile the scroll inside this popin is not possible. When I switch the device position, my screen is not high enough to see the popin entirely and therefore I cannot access the button.
In my opinion, the popin should open as a new page / tab in the mobile/tablet browser rather than a popin. What do you think ? Shall I create another issue or can it be part of this one ? Thanks :)

[sauloperez]

Ok, I got tired of this issue :sweat_smile: I'm going to find the culprit and fix it.

[sauloperez]

I haven't got the chance to look at it yet, so anyone can take it.

[kristinalim]

I was able to reproduce the same issue which @RachL reported for small screens. The area is scrollable, but content is hidden beyond the bottom of the visible area:

Work is already in #2544, but the status of this issue needs to be checked with those changes.

[daniellemoorhead]

good pick up @kristinalim, I added this issue number to your PR #2544 explanation so we remember to close this again once the PR is merged. 😄

[kristinalim]

After #2544 is merged, the button in small screens will already be clickable, but the user would still have to scroll to see this.

Scrolling seems necessary if we keep the contents as they are. Here's the full length of the modal on an example small screen:

These would bring the button higher in the page:

1. Have two buttons instead of one for small screens: one above the "You'll need" text and retaining the existing one below.
2. Collapse the text under headings "What are the requirements?" and "What do I get?"

The first one would be easier, but the second one would give a better experience I think.

I'm not a UX expert. :grin: Do you have better ideas?

[sauloperez]

Option 2 sounds good to me.

[kirstenalarsen]

Option 3 - edit the text? Certainly the text under What do I Get seems excessive . .

On 10 Sep 2018, at 10:44 PM, Pau Pérez Fabregat [e-mail] wrote:

Option 2 sounds good to me.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub https://github.com/openfoodfoundation/openfoodnetwork/issues/1766#issuecomment-419899354, or mute the thread https://github.com/notifications/unsubscribe-auth/ACxryHuVeeJSw6H8lBBH8cFIEgWv2qvuks5uZl7IgaJpZM4O1aW_.

[sauloperez]

and what about a "See more" link to show that "What do I get" section (maybe rephrased)?

[myriamboure]

I was just testifying while a user was setting up in front of me a hub, that when reaching the page "add promo image" she couldn't see the "next" button and the scroll didn't appear, so she just couldn't move on, she had to use tabulation to randomly "find" the next button to move to last page of the registration modal. I guess this is link to that issue, right? We are running on v1.18 so maybe some recent fix did solve that... but the scroll bar seems to randomly not appear on some computers... (I have also seen that on producer modals on the map, on some screens, scroll was not appearing).

[jazzdragon]

I'm going to take this issue, and implement the second solution above, I agree that it seems like better UX.

@myriamboure I'm not sure but I think what you're describing might deserve it's own ticket.

I don't have write access to this board, so if someone with permissions sees this, please assign me and move this ticket to "in dev". Thanks.

[sigmundpetersen]

Hey @jazzdragon great thanks! I moved it along to In Dev. To be assigned you need to be added to the GH organization by an admin 👍 If you connect the upcoming PR to this issue we can follow them together either way.

[lin-d-hop]

@jazzdragon You should have an invite in your inbox. Once you accept you'll be able to assign yourself :-)