Active trail menu items should be distinct from other items

Taggin'

Nice, this sounds like something that is easy to achieve without a lot of design bikeshedding. We just need a color or some kind of indicator that is inline with the current design. I think someone should patch it and then we review the design change.

Tagging with novice as it is should be simple styling

I changed the background opacity for items in the active trail. It is the subtle difference and visible enough to do the job.

Hey @Bojan Živkov thanks for the patch.

Due to recent commits in core the patch does not apply anymore so I rerolled.

From looking in the CSS files I noticed we have this code...

#page,
#main-wrapper,
.region-primary-menu .menu-item a.is-active,
.region-primary-menu .menu-item .menu-item--active-trail a {
  background: #ffffff;
}

.region-primary-menu .menu-item .menu-item--active-trail a should be targeting the .menu-item--active-trail list item but the selector is currently incorrect.

Can we please write a new patch that amends the code above and targets the active trail correctly.

Rewrote the patch, the previous one didn't work anymore because of changes to the primary-menu.css file.

For the style of the active trail we need to use:

background: #ffffff;

This is existing code in Bartik for active trail menu items which you can find in colors.css.
It is not working currently because the selector is slightly incorrect so we just need a small change to existing code for this issue.

#page,
#main-wrapper,
.region-primary-menu .menu-item a.is-active,
.region-primary-menu .menu-item .menu-item--active-trail a {
  background: #ffffff;
}

Corrected css selector.

Added before and after screenshots.

Thanks @haasontwerp for the patch.

The visual changes are perfect!
 

 
However I need one improvement for the code.

For the active trail selector...

.region-primary-menu .menu-item.menu-item--active-trail a

We need to remove the .menu-item part of it and just have....

.region-primary-menu .menu-item--active-trail a

This is because .menu-item--active-trail is a variant class of .menu-item so it does not need to be declared twice.

Removed the menu-item selector because it doesn't needs to be declared twice.

The CSS selector is now correct and the changes in #16 do not affect anything visually from the patch in #12.

Setting this issue to RTBC. Thanks all!

Added beta evaluation