Skip to content
This repository has been archived by the owner on Jun 5, 2023. It is now read-only.

Commit

Permalink
fix(Button): Apply overflow: visible for IE11
Browse files Browse the repository at this point in the history
The FocusRing in the Button component requires
its containers overflow to be visible. In IE11,
it's set to "hidden" by default. This change
addresses this.
  • Loading branch information
diondiondion committed Jan 10, 2020
1 parent c17321d commit f0b184a
Showing 1 changed file with 8 additions and 0 deletions.
8 changes: 8 additions & 0 deletions src/Button/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,11 @@ const Wrapper = styled(PropFilteringWrapper)`
text-align: ${p => p.align || 'center'};
text-decoration: none;
/* This is only needed for IE11 whose default button styles
* include 'overflow: hidden'. We need overflow to be visible
* for the focus ring. */
overflow: visible;
${p =>
!p.square &&
css`
Expand Down Expand Up @@ -114,6 +119,9 @@ const Wrapper = styled(PropFilteringWrapper)`
`}
&.focus-visible {
/* Override the default focus indicator of ButtonCore
* Actual focus styles are applied using the FocusRing
* component further below */
outline: none;
}
Expand Down

0 comments on commit f0b184a

Please sign in to comment.