Bump

I was hoping someone could take a quick second to check this on their mobile phone in landscape. Today I was able to get some friends to check the Oregon starting pointhttp://oregon.fundamental.c5hub.com/... on their android phones and they also said the menu did not work when turned landscape.
c5hub, am I still eligible for support? I have the Arizona starting point with content above the nav, am I going to need to remove it?

Thank you

Would you be able to offer any more info why you think this does not work please? Tested on my iPhone 6 and the nav on all starting points appear to work. In landscape mode they do not turn in to the 'burger' mobile nav, is this what you are referring to?

This theme use foundation as its base - the mobile break point is a little lower than the slightly larger iPhone 6 screen when in landscape.

Hi, thank you for your reply

@Would you be able to offer any more info why you think this does not work please?

-I attached a screen shot from my Samsung Note 3 / Chrome
-I have also tested it ( http://oregon.fundamental.c5hub.com/... ) on a Motorola, LG and other Samsung phones and the landscape shows the hamburger nav icon, but it does not work.
This seems to only happen when adding blocks above the nav. Without blocks above the nav, the hamburger still shows in landscape but it works.

@Tested on my iPhone 6 and the nav on all starting points appear to work. In landscape mode they do not turn in to the 'burger' mobile nav, is this what you are referring to?

-Yes the hamburger nav icon shows on these mobile devices in landscape view, but it does nothing when touched.

@This theme use foundation as its base - the mobile break point is a little lower than the slightly larger iPhone 6 screen when in landscape.

-I would actually like to have the option to choose what size screen the hamburger shows on. I want the hamburger icon to show in both portrait and landscape on my Note 3 if my nav style does not fit well on it. If I purchase more Fundamental themes that I design differently, then the normal nav (in landscape) as you described on your Iphone 6 will work just fine.
Another example for this option is my Dell Venue 8 android tablet. In certain designs the option to use the hamburger icon vs full nav, might make the user's navigation easier and cleaner.
If you feel I am wrong, please let me know. You guys are very talented not only as developers but as designers also, so I value your advice.

You probably have used the Google Chrome's Inspect Element tool (right click on webpage). In there you can select the mobile icon in the top left and view in real time how multiple devices will emulate the website. Change the view to landscape and then select a device and you will see that the Iphone 6 renders full nav but the Note 3 (and others) shows the hamburger. If you try and click on it.... nothing.
https://developers.google.com/web/tools/chrome-devtools/...

Thank you

I seem to be stuck here...
Have you had a chance to look at this to see if anything can be changed? If not I will need need to figure out something different.
The company's logo and name is so long, I need to have it above the nav.

If I try and add it to the stack topbar_logo to go on nav, it causes the nav to drop on my tablet.
example: with custom class, show-for-medium-down
-------------------------------------------------------------------75px navigation height
@ A Long Logo540x74px.png
................................Home About Contact Portfolio Blog
--------------------------------------------------------------------
On my Dell tablet the "Top Bar Navigation set to your grid width" Fundamental option does not work so I must add transparent left padding to the png (making it wider) to move the logo off the screen's left edge. I tried to add padding in the stack image block but it did not work.

Thanks

May I ask, have you actually tested on all of the devices physically or just using emulation software? The reason I ask is that I have found this type of software to be unreliable.

The theme use the Foundation framework and I would be surprised if the navigation did not work on all of those devices as I am sure they would have considered this when they built it.

Changing the mobile breakpoint is possible but a little complicated; there is certainly no interface that jumps to mind when considering offering this as an option in the theme. Most of the changes require edits to the foundation.css file changing media queries etc. There is probably more info available on this on the foundation site itself.

Yes, as I noted in the 2nd post on Oct 22. I had other people check it on their phones.
I only added that emulation because it is mirroring what live test are actually doing in this situation.

Do you have access to any Android phones...... So you can can see it, test it?

Here is the list of actual phone test of landscape view for the hamburger menu on: http://oregon.fundamental.c5hub.com/...

Live phone test - NOT emulated
Landscape DOES NOT work
1. my Samsung Note 3 - Chrome, Firefox and stock browser
2. another Samsung Note - Chrome and stock browser
3. Motorola Electrify - stock browser
4. Galaxy S4 - stock browser
5. LG ?model - ?browser (I did not get phone details)
6. Galaxy S6 - Chrome, stock browser
7. Motorola Droid Turbo - stock browser

Landscape DOES work
1. iPhone 5c
2. Moto X - stock browser

I have several other people I am waiting on to get back to me with the test on their phone.
But what is the point.... It's not working.

I am not experienced enough to understand or fix this myself, besides it is your own c5hub site that does not work for these phones in landscape. When that is fixed, mine will work too.

There is something definitely wrong. Is there any chance there is something wrong in the Fundamental Theme - not Foundation?

I just want it to work. Where do we go from here?

Thanks for your further info and testing.

We only have Apple devices; iPhone, iPad, MacBook Pro, iMac so we can not test on the other physical devices unfortunately. However, based on your tests, the Chrome emulator seems pretty accurate so we will use this for now.

I have tested the Oregon starting point demo site in the Chrome emulator and can see that it does not appear to work in landscape. However, testing this starting point -http://newyork.fundamental.c5hub.com/... it does work! This leads me to think that the issue may not be blocks above the navigation but rather something more local to that specific starting point.

It would be helpful if you could test this URL -http://newyork.fundamental.c5hub.com/... and confirm whether this does indeed work for you too?

In the mean time we will conduct some further testing to see if we can find anything. We also want this working, so will always endeavor to find a fix were possible. We just need to ensure the issue is with the theme, hence my other questions in previous post.

Thanks

I think we may potentially have a fix for this...

When you get a chance could you once again check -http://oregon.fundamental.c5hub.com/... on your mobile device and confirm whether this now works for you?

If so, looks like the issue is where the navigation links are set to center. If this has now fixed the issue then we can get this added to the next production version.

Yes, the menu is now working, on my phone and it is showing center aligned.
Do the parent page links have to be centered on the menu drop down, can they be positioned left at all?
What happens to child page links "if" the parent links are centered?

Was the problem and the fix in the Topbar nav or areas above it?
It's just strange, I can style the Topbar nav in various ways inside the Sitewide Header Nav Area on any starting point and it works fine as long as there is nothing in the Areas above the Sitewide Header Nav Area. For example, in the Arizona starting point, add an image and content block in the Top Section Areas and the Sitewide Branding Areas (like the Oregon). Now the menu dropdown does NOT work in mobile landscape view. BUT if I add an image block to the Sitewide Header Nav Area above the Topbar nav (all in sitewide header nav) it works just fine on the mobile.
The problem only occurs after adding blocks to the Sitewide Top Section area and Sitewide Branding area. As long as no one uses those areas, everything should be just fine ;)

After some extensive debugging we tracked the error down to the fact that the top-bar navigation on the Oregon Starting Point was 'centered' in the link align options form the Fundamental themes settings page.

The CSS that relates to this had a float:none which seems to be the issue. The was within a media query that only takes effect on devices that have a certain screen size. This is why the issue was not spotted on iPhone for instance.

I can give you the fix if you like or you can wait until the next version release?

Are you saying just for the Oregon Starting Point? As I noted in my previous posts I was using the Arizona Starting Point with a similar Top Area layout as the Oregon. That is why I referenced the Oregon page on your site, because the Arizona page on your site does not have anything in the Top Areas, but mine does.

So.... will the CSS fix, affect ALL Starting Points that have blocks in the Top Areas?

Yes I can try the fix.
When is next update?

We can not specifically see any issue with having blocks above the navigation. The rpoblem we found was with some CSS for the top-bar nav. Testing this on both oregon and then arizona (with blocks above) they both work for us without issue with the fix in place.

Open this file - packages/fundamental/themes/fundamental/css/main.less then add the following...

This needs to go at around line 355. So the surrounding code will change from...

To...

We have made the same change to the package and will upload this as a new version.

Resolved. That fixed it.
Thank you