Skip to content

Implement custom focus ring #67

@ezhangy

Description

@ezhangy

Implement the NJWDS custom focus ring. This focus ring differs from the USWDS version in order to improve contrast on dark backgrounds. As can be seen in the image below, the custom focus ring has:

  • An outer blue outline and inner white outline
  • Some margin between the inner white outline and the element so that the background color can show through.
Screenshot of focus ring on button component

The CSS to implement this is not straightforward, so leaving as an issue for now.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions