Remove forced default focus outline #19935

Closed
wants to merge 1 commit into
from

Conversation

Projects
None yet
2 participants
@patrickhlauke
Member

patrickhlauke commented May 19, 2016

the current outline: thin dotted that is forced as "default" is not in fact default in Firefox/OS X; forcing it leads to unsightly dotted outline that's non-standard for the browser/platform.

removing it seems to have no adverse effect in other all situations where this mixin is used (buttons, scaffolding for general link styles, and the case of forms). attempted to use outline: initial at first, but this seems somehow broken in Firefox (ends up removing standard Firefox dotted outline on links).

This is mostly a bug-fix, rather than a new feature (hence targetting it for v3)

Closes #19933

Remove forced default focus outline
As this causes non-standard dotted outline on checkboxes/radio buttons
in Firefox/OSX

@patrickhlauke patrickhlauke added this to the v3.3.7 milestone May 19, 2016

@patrickhlauke patrickhlauke added the css label May 19, 2016

@patrickhlauke

This comment has been minimized.

Show comment
Hide comment
@patrickhlauke

patrickhlauke May 19, 2016

Member

/cc @cvrebert @mdo for review. related to #19708 (which is v4)

Member

patrickhlauke commented May 19, 2016

/cc @cvrebert @mdo for review. related to #19708 (which is v4)

@cvrebert

This comment has been minimized.

Show comment
Hide comment
@cvrebert

cvrebert May 19, 2016

Member

Any adverse effect on IE or Win Firefox?

Member

cvrebert commented May 19, 2016

Any adverse effect on IE or Win Firefox?

@patrickhlauke

This comment has been minimized.

Show comment
Hide comment
@patrickhlauke

patrickhlauke May 19, 2016

Member

will post some screenshots in a bit, but generally: no adverse effect (though subtly different, checkboxes, tabs - in navs - etc all still have a good focus indication)

Member

patrickhlauke commented May 19, 2016

will post some screenshots in a bit, but generally: no adverse effect (though subtly different, checkboxes, tabs - in navs - etc all still have a good focus indication)

@patrickhlauke

This comment has been minimized.

Show comment
Hide comment
@patrickhlauke

patrickhlauke May 19, 2016

Member

some before/after shots.

for IE11, removing that explicit outline effectively brings the outline back to its natural look (i.e. links, buttons and checkboxes do have that particular outline normally)

ie11

for Firefox/Windows, the notable change is that <button> elements now have no forced outline - however, this is in line with general Firefox behavior once a particular :focus style has been set (FX won't show default dotted outline - though it would show an inner dotted outline around the actual text, which is suppressed by normalize.css). I'd argue it's still distinctive enough, though could be stronger...

fx

Member

patrickhlauke commented May 19, 2016

some before/after shots.

for IE11, removing that explicit outline effectively brings the outline back to its natural look (i.e. links, buttons and checkboxes do have that particular outline normally)

ie11

for Firefox/Windows, the notable change is that <button> elements now have no forced outline - however, this is in line with general Firefox behavior once a particular :focus style has been set (FX won't show default dotted outline - though it would show an inner dotted outline around the actual text, which is suppressed by normalize.css). I'd argue it's still distinctive enough, though could be stronger...

fx

@patrickhlauke

This comment has been minimized.

Show comment
Hide comment
@patrickhlauke

patrickhlauke May 25, 2016

Member

@mdo @cvrebert thoughts on this?

Member

patrickhlauke commented May 25, 2016

@mdo @cvrebert thoughts on this?

@cvrebert cvrebert added the v3 label Jul 8, 2016

@cvrebert cvrebert closed this in c3c089b Jul 9, 2016

cvrebert added a commit that referenced this pull request Jul 12, 2016

Remove forced default focus outline
As this causes non-standard dotted outline on checkboxes/radio buttons
in OS X Firefox

Ports #19935 to v4
Refs #19933

[skip sauce]
@cvrebert

This comment has been minimized.

Show comment
Hide comment
@cvrebert

cvrebert Jul 12, 2016

Member

Ported to v4 in #20275.

Member

cvrebert commented Jul 12, 2016

Ported to v4 in #20275.

twbs-savage pushed a commit to twbs-savage/bootstrap that referenced this pull request Jul 12, 2016

Remove forced default focus outline (#20275)
As this causes non-standard dotted outline on checkboxes/radio buttons
in OS X Firefox

Ports #19935 to v4
Refs #19933

[skip sauce]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment