krupa raj[:krupa] Reporter
	Description • 10 years ago

steps to reproduce:
1. Load https://marketplace-dev.allizom.org/
2. Sign in using persona

observed behavior:
Header navigation menu is broken. See screenshot

screenshot: https://www.dropbox.com/s/4fpmfnohinfankb/Screenshot%202014-10-16%2012.57.02.png?dl=0

	Christopher Van Wiemeersch [:cvan]
	Comment 1 • 10 years ago

Persona is disabled on -dev, so I can't reproduce (neither on stage). Logging in or logging out of the FxA, I don't see anything broken in Firefox:

https://www.dropbox.com/s/1gta2qls7tsim10/Screenshot%202014-10-17%2010.24.26.png?dl=0

	krupa raj[:krupa] Reporter
	Comment 2 • 10 years ago

I think this was caused by Rob turning on recommendations on dev.

	Rob Hudson [:robhudson]
	Comment 3 • 10 years ago

(In reply to krupa raj[:krupa] from comment #2)
> I think this was caused by Rob turning on recommendations on dev.

It is. And it's still a valid bug. It should work when recommendations are enabled.

	Christopher Van Wiemeersch [:cvan]
	Comment 4 • 10 years ago

Did you do a git bisect on this? If this was always the case since the Recommendations patch, nevermind me. But if I caused this regression with bug 1083625, feel free to revert and I'll re-push with fixed changes.

	Kevin Ngo [:ngoke] Assignee
	Comment 5 • 10 years ago

No, it changed with the fit-content stuff (which I can't get working in like Safari), and before then it was fixed percentage widths. Just need to spend some time on a patch that gives some more room to the navbar container.

	Christopher Van Wiemeersch [:cvan]
	Comment 6 • 10 years ago

(In reply to Kevin Ngo [:ngoke] from comment #5)
> No, it changed with the fit-content stuff (which I can't get working in like
> Safari), and before then it was fixed percentage widths. Just need to spend
> some time on a patch that gives some more room to the navbar container.

I was playing locally with flexbox (`flex-grow`) and it worked fantastically - all of the nav items were divided up equally. I was then able to remove the styles for waffle enabled vs. disabled.

http://philipwalton.github.io/solved-by-flexbox/demos/grids/

In my testing, perf was decent on simulator and on my 2.1 device. Even though the new flexbox landed in Firefox 20, I need to go back and check 1.1-1.3. And I'm not sure if we have to support 1.0 (which is stuck on Firefox 18, so we'd have to target old flexbox, but we already should since we do cross-platform; but we have Stylus mixins for this anyway).

	Kevin Ngo [:ngoke] Assignee
	Comment 8 • 10 years ago

1.1-1.3 wouldn't matter since mobile has a differently-styled navbar. You should be able to commit your flexbox stuff without issue.

	Christopher Van Wiemeersch [:cvan]
	Comment 9 • 10 years ago

(In reply to Kevin Ngo [:ngoke] from comment #8)
> 1.1-1.3 wouldn't matter since mobile has a differently-styled navbar. You
> should be able to commit your flexbox stuff without issue.

What do you mean? Even on 1.1-1.3, users are still using Yulelog, the iframe'd Marketplace. So any updates we make will affect those users, right? Or am I missing something?

	Kevin Ngo [:ngoke] Assignee
	Comment 10 • 10 years ago

This bug is about the navbar on the desktop. They will get the update, but the CSS won't apply to them.

	Christopher Van Wiemeersch [:cvan]
	Comment 11 • 10 years ago

Oh, I was going to apply to both mobile and desktop. But, clever idea! I could target only desktop. Luckily I don't think we had FxOS tablets on 1.1-13.

	Christopher Van Wiemeersch [:cvan]
	Comment 12 • 10 years ago

I'm working on this. Kevin, if you really want to work on it let me know. But I've got a patch locally.

	Kevin Ngo [:ngoke] Assignee
	Comment 13 • 10 years ago

A JS line-fitting solution: https://github.com/mozilla/fireplace/pull/806

	Iulian Timis
	Comment 14 • 10 years ago

Verified as fixed in https://marketplace-dev.allizom.org/ on FF 36 (Win 7, Android 4.2.1).
Postfix screencast http://screencast.com/t/OIE2lXXcZY
Closing bug.