(issue) Mobile header menu button off screen on phones

[ulternate]

I'll submit screenshot when at computer, but basically. The menu button is off screen when on my phone

Android Chrome browser.

Dan

[ulternate]

On the buy page it wraps to the bottom.

Standard practice on phones is to place hamburger in top right, replacing any logo or nav menu (as how it's done in bootstrap and semantic docs)

Suggest showing left of logo on mobiles, rather than on right side. Especially considering the menu is shown on left side of screen.

Dan

[ulternate]

FYI, this is prod

[ulternate]

I assume it's because the container they are in doesn't have the 100% fix we discussed on Thursday (that I put on my sell page container)

[jayden2]

Yeah, I have be on a mobile to replicate this I think, on desktop the last time I tested it worked fine

[ulternate]

it works in the emulator for me. But not on a real device.

Moving menu to left, and/or setting container width for the menu to 100% should be good.

There's also an issue on the buy page with the menu icon wrapping below the logo

[ulternate]

Like this

[jayden2]

224 changes the header significantly and this shouldn't happen

havent been able to test on a mobile device, so leave open until confirmed fixed @ulternate

[ulternate]

So close! I can see the menu button, but the logo still wraps around. I think we still need the container to be global 100% on mobiles/tablets.

Also, the arrow under favourites gets cut off.

The featured and Twitter's something stack.

Foot is still not grey for the whole thing.

Cheers,

Daniel.

Here's the pictures.

[ulternate]

Such a weird issue. When I view on my phone with the dev server running rails s -b 0.0.0.0 -p 3000 and go to it on my local network, then all these issues are fixed.

For some reason going to prod stuffs this up?

Is it something to do with caching? @slehmann36, @jayden2, should we write something to invalidate cache after a build?

I'm going to clear cache for this site and try again on my phone.

Will post back in a second

[ulternate]

Issue persisted after clearing cache on my phone. I'm not really sure about this one... I'm going to suggest we chuck in a mobile rule for container width and see how that goes when it's pulled into master.

I might sneak it into what I'm working on today.

Dan

[jayden2]

If you're able to fix this for your device then awesome, I am unable to recreate this issue. Featured properties looks strange, that should be stacked in you view! On your phone you're getting the tablet to small screen view rather than mobile, so it's even stranger

[ulternate]

@jayden2 hoping merge #226 fixes this. Will report back when it's live. And close this issue if it was fixed

[ulternate]

Can confirm #227 and #226 fixed this issue (mainly #227 though).

I will turn on my iphone and test and if it's good close this issue.

Image below from Android phone, see how the nav bar is properly contained now (looks like my dropdowns still look crap, but that's a separate issue).

[ulternate]

Confirmed it looks ok on iphone too, closing issue