AusDTO / gov-au-ui-kit

MOVED TO https://github.com/govau/uikit/
https://github.com/govau/uikit/
MIT License
19 stars 12 forks source link

Bug - .site-nav last-child in mobile view is missing active visuals #471

Open TrebBrennan opened 7 years ago

TrebBrennan commented 7 years ago

What I did

Unable to determine the active page on a small screen width (eg mobile) when the last item in the list is active.

What browser and device I was using

Chrome inspector / Emulated iPhone6:Chrome (browserstack

What I expected to see

An indication of the page I'm on. Items other than last-child have a different coloured border which was the expectation, BUT even that isn't likely to pass WCAG:

WCAG 1.4.1 Use of Color: Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element. (Level A)

What I saw

screen-shot-2017-02-21-at-3 00 33-pm

Additional information (optional)

Suggest changing active state to something other than colour, for example font-weight or a new border left for active?

CSS overriding the .is-active class:

@media screen and (max-width: 767px)
main.css:1
.site-nav__wrapper li:last-child a {
    border-bottom: none;
}