Admin Bar: double arrows with WP 4.7 trunk

[Offereins]

Using WP 4.7 trunk BP's admin bar menu displays arrows on both sides of the admin bar profile menu items. Haven't looked what the issue could be.

See the image posted in ​#buddypress Slack.

[hnla]

I see those too. Are you running twentyseventeen?

Not sure where the issue lies but they borked my bloody work with templates in Nouveau, looks like they may have removed the arrangement they had for two column switching of 'page' layouts while introducing something they should never have added an open ended text area to add CSS, I made a comment on core-theme about that as did others but it still goes in!

[slaFFik]

In my opinion this should be fixed before 4.7 release, so basically in BuddyPress 2.7.1 or 2.7.2 (if we go that far with 2.7 branch).

Would be nice to get milestone feedback from core devs, and @mercime

[mercime]

The arrows are welcome on small screens but not in screen widths larger than 600px. One way to fix these new right arrows from showing up in large screens is by adding the following styles in admin-bar.css:

#wpadminbar .wp-admin-bar-arrow-right {
	display: none;
}

@media screen and (max-width: 600px) {
	#wpadminbar .wp-admin-bar-arrow-right {
	     display: block;
	}
}

This works in IE 11 below as well as in modern browsers.

[hnla]

More importantly why are these appearing what was the intended purpose of them ( look to be a rtl affectation to me on, but haven't delved deeper into this).

I'm not sure we should add styles to fix something that is either intended for a reason or that is a error which needs to be corrected at some other level.

Can we have an explanation of what these are before we add any supposed 'fixes'?

[hnla]

Ok ignore the above I see the point of them now commit the fix @mercime, one question is this copying WP's use of max-width media query, as the alternative and perhaps more usual query approach is min-widths so hiding the arrows down to.

[mercime]

In my opinion this should be fixed before 4.7 release, so basically in BuddyPress 2.7.1 ...

Thanks @slaFFik :) Doing this for 2.7.1.

one question is this copying WP's use of max-width media query, as the alternative and perhaps more usual query approach is min-widths so hiding the arrows down to.

Thanks @hnla. Understood, mobile-first approach would be better. Thing is, we're still supporting IE 8/9 on the back end.

[mercime]

In 11215:

Remove additional arrows from appearing on the BuddyPress' my_account_menu.

The new arrow icons introduced in WP 4.7 trunk caused additional arrows to show
up on the right side of the toolbar menu links for BuddyPress logged in users
which already had arrow icons on the left side for large screens.

Props Offereins, hnla, slaFFik, mercime.
Fixes #7310 (trunk).

[mercime]

In 11216:

Remove additional arrows from appearing on the BuddyPress' my_account_menu.

The new arrow icons introduced in WP 4.7 trunk caused additional arrows to show
up on the right side of the Toolbar menu links for BuddyPress logged in users
which already had arrow icons on the left side for large screens.

Props Offereins, hnla, slaFFik, mercime.
Fixes #7310 (2.7 branch).