[Mobile] No Navigation Bar

[psppwner300]

Logging in to the site with my Android tablet, there's no navigation bar on the top of the site. That means I can't check any of my messages or logout.

Anyone else notice this?

[Broscar]

You don't get a 'hamburger menu' at the top right?

[psppwner300]

Nope. No hamburger button either.

[wantfastcars]

Can confirm I get the same results on my Android phone and tablet.

I think Android Chrome is just doing a wonky this update, since it's been really weird and laggy on other sites, too.

[psppwner300]

I'm using Firefox.

[wantfastcars]

Maybe it is this website then.

[Broscar]

Edit: Damn, the css media rule which styles the mobile menu is a right mess.
I've written a new one and I'll bother Chris with updating it once the team gets back from GDC.

Thanks for the heads up.

Edit2: Would be neat if you guys could mention which device this happens on, so I can test specifically whether the new rule will fix the issue on your end.

[psppwner300]

NVIDIA Shield K1

[Similii]

Have this too on Asus Zenfone 2 (awesome phone btw)

[Chris_CE]

Got that CSS for me Broscar?

[Broscar]

styles/WoWDraenor/theme/menu.css
Line #237

Replace:

Code: Select all

@media (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), not all, not all, not all, only screen and (max-width: 1024px) and (min-resolution: 192dpi), only screen and (max-width: 1024px) and (min-resolution: 2dppx) {


With:

Code: Select all

@media only screen and (max-width: 1024px) and (min-resolution: 144dpi), only screen and (max-width: 800) {

This should work with most devices, including tablets. Might have an exception or two, but then you're looking at pre-2009 devices, which you don't wanna browse the modern web with anyway.

[wantfastcars]

Motorola Droid Turbo II

[Chris_CE]

http://forum.cagedelement.com/styles/WoWDraenor/theme/menu.css
Line #237

Replace:

Code: Select all

@media (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), not all, not all, not all, only screen and (max-width: 1024px) and (min-resolution: 192dpi), only screen and (max-width: 1024px) and (min-resolution: 2dppx) {


Only line I see like that is on #473 and is:

Code: Select all

@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {

[potterman28wxcv]

http://forum.cagedelement.com/styles/WoWDraenor/theme/menu.css
Line #237

Replace:

Code: Select all

@media (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), not all, not all, not all, only screen and (max-width: 1024px) and (min-resolution: 192dpi), only screen and (max-width: 1024px) and (min-resolution: 2dppx) {


Only line I see like that is on #473 and is:

Code: Select all

@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {

That's because you are miscounting the lines. Broscar has the right line - line #473 does not exist
Or maybe you are looking at a different .css than styles/WoWDraenor/theme/menu.css ?

[SuperLucas335]

I only get my navigation bar when the site has been maximised. If I have Chrome open in a smaller window the bar doesn't appear.

If it helps:
My screen resolution is 2736 x 1824
I increased the "size of text, apps and other items" by 200% (recommended)
I'm on a Surface Pro 4, which has Microsoft's take on Apple's Retina Display (pixels are 2x smaller)

It's nothing urgent - all I need to do is maximise the window. Hope this helps on the case!

[Broscar]

Hey dude. The css hasn't been updated yet, but once the changes are in, the forum should be less eager to switch to mobile display for desktops and more eager to display it for mobile devices.
As you know, the Surface Pro 4 is a sorta inbetween thing. This mixed with the zoom options and the quite unflexible nature of phpbb3 means there's only so much we can do. It should be fine, but I'll PM you to check for feedback once the changes have been implemented.
(Could take some time. They're hard workers, but there's only so many people to share the workload with)

[Falkerz]

Was this ever addressed? Only, my iPhone 5S running Safari or Chrome, and my Lenovo Tab s8-50f running Chrome still have no menu bar...

[Chris_CE]

edited the stylesheet. Please let me know if that helps, guys

[Broscar]

The conditions for having the mobile navigation bar pop up instead of the regular one are better, but the bar is still gone on (some) mobile browsers.
It's not related to the mobile-specific style rules, as it happens when you request the desktop site on mobile browsers as well. I'll try to track down what's going on, though any help with this would be neat, as it's a bit hit 'n miss to run Android browser debugging tools on Blackberry.

Edit: Was caused by new defaults set by both Chrome and Firefox which make it so that they refuse to proceed with any plain http requests if the site was loaded over https. This made it so that jquery was not loaded (and the theme maker wisely decided not to make a fallback for it), which as you all have probably figured out by now, was required to display the burger menu. I never ran into the issue because I was too stubborn to update my bookmark to the https version of the site

[Falkerz]

The conditions for having the mobile navigation bar pop up instead of the regular one are better, but the bar is still gone on (some) mobile browsers.
It's not related to the mobile-specific style rules, as it happens when you request the desktop site on mobile browsers as well. I'll try to track down what's going on, though any help with this would be neat, as it's a bit hit 'n miss to run Android browser debugging tools on Blackberry.

Edit: Was caused by new defaults set by both Chrome and Firefox which make it so that they refuse to proceed with any plain http requests if the site was loaded over https. This made it so that jquery was not loaded (and the theme maker wisely decided not to make a fallback for it), which as you all have probably figured out by now, was required to display the burger menu. I never ran into the issue because I was too stubborn to update my bookmark to the https version of the site

You da real MVP. I didn't actually spot I was requesting SSL when accessing the forums, but that certainly makes sense. Formatting is a bit skewed, but I'll settle for it instead of having to spend 5 minutes following difficult to find links in my profile, just to find my notifications feed.