Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Update links (and things that look like links) to use the new focus style #1309

Merged
merged 9 commits into from
May 8, 2019
Merged

Update links (and things that look like links) to use the new focus style #1309

merged 9 commits into from
May 8, 2019

Commits on May 8, 2019

  1. Adding govuk-focusable-text-link mixin 

    This approach uses box-shadow, which has broadly good support across browser.

We have found that Edge and Internet Explorer produce rendering issues.

Edge 18 has quite problematic issues but this can be seen on any website using custom
focus styles. Edge 18 supports 'drop-shadow()' which can work but only on elements that are `diplay: inline`, with this in mind we think the complexity is not worth the cost to users for all browsers.

Edge 19+ will be using the Chromium rendering engine so this will not be an issue.

Edge 17 and below, and IE 9-11 have lesser issues that we have determined will not cause a barrier.

See: https://gist.github.com/nickcolley/3788eefd34e7f04391de07867a85018b for an example of how `drop-shadow()` could work.

Co-authored-by: Nick Colley <nick.colley@digital.cabinet-office.gov.uk>
    @aliuk2012 @NickColley
    aliuk2012 and NickColley committed May 8, 2019
    Configuration menu
    Copy the full SHA
    f121c99 View commit details
    Browse the repository at this point in the history

  2. Update govuk-link-common mixin to use new govuk-focusable-text-link m… 

    …ixin

Co-authored-by: Nick Colley <nick.colley@digital.cabinet-office.gov.uk>
    @aliuk2012 @NickColley
    aliuk2012 and NickColley committed May 8, 2019
    Configuration menu
    Copy the full SHA
    1979c10 View commit details
    Browse the repository at this point in the history

  3. Update back-link component focus to avoid duplicate border 

    Co-authored-by: Nick Colley <nick.colley@digital.cabinet-office.gov.uk>
    @aliuk2012 @NickColley
    aliuk2012 and NickColley committed May 8, 2019
    Configuration menu
    Copy the full SHA
    09ff00c View commit details
    Browse the repository at this point in the history

  4. Update details focus styles to match updated focussed state 

    We can remove a lot of the custom focus styles since they were relevant to the relationship between the background and outline which are not used anymore.

Co-authored-by: Nick Colley <nick.colley@digital.cabinet-office.gov.uk>
    @aliuk2012 @NickColley
    aliuk2012 and NickColley committed May 8, 2019
    Configuration menu
    Copy the full SHA
    a921fcc View commit details
    Browse the repository at this point in the history

  5. Add new focus style to error summary links

    @NickColley
    NickColley committed May 8, 2019
    Configuration menu
    Copy the full SHA
    1570997 View commit details
    Browse the repository at this point in the history

  6. Use simpler focus styles for skip-link component

    @NickColley
    NickColley committed May 8, 2019
    Configuration menu
    Copy the full SHA
    52a6712 View commit details
    Browse the repository at this point in the history

  7. Update header to align with new focus state styles

    @NickColley
    NickColley committed May 8, 2019
    Configuration menu
    Copy the full SHA
    3118967 View commit details
    Browse the repository at this point in the history

  8. Remove incorrectly overriden error summary focus style 

    When we updated the the focus styles for to have the same colour as the body text, we forgot to update the specific overrides we need when using GOV.UK Frontend with GOV.UK Template (legacy).

This meant that when you focused a link in the error summary the color was red instead of black, removing this block achieves the result we want.
    @NickColley
    NickColley committed May 8, 2019
    Configuration menu
    Copy the full SHA
    eca6ca0 View commit details
    Browse the repository at this point in the history

  9. Add CHANGELOG entry

    @NickColley
    NickColley committed May 8, 2019
    Configuration menu
    Copy the full SHA
    c0a6776 View commit details
    Browse the repository at this point in the history