diff options
| -rw-r--r-- | scss/_badge.scss | 1 | ||||
| -rw-r--r-- | scss/_variables.scss | 3 | ||||
| -rw-r--r-- | scss/mixins/_badge.scss | 6 |
3 files changed, 10 insertions, 0 deletions
diff --git a/scss/_badge.scss b/scss/_badge.scss index bdbe4b9cc..c727ba5a2 100644 --- a/scss/_badge.scss +++ b/scss/_badge.scss @@ -13,6 +13,7 @@ white-space: nowrap; vertical-align: baseline; @include border-radius($badge-border-radius); + @include transition($badge-transition); @at-root a#{&} { @include hover-focus { diff --git a/scss/_variables.scss b/scss/_variables.scss index 275a8ede9..add1c1bfe 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -892,6 +892,9 @@ $badge-padding-y: .25em !default; $badge-padding-x: .4em !default; $badge-border-radius: $border-radius !default; +$badge-transition: $btn-transition !default; +$badge-focus-width: $input-btn-focus-width !default; + $badge-pill-padding-x: .6em !default; // Use a higher than normal value to ensure completely rounded edges when // customizing padding or font-size on labels. diff --git a/scss/mixins/_badge.scss b/scss/mixins/_badge.scss index cf99b3537..64b29cb57 100644 --- a/scss/mixins/_badge.scss +++ b/scss/mixins/_badge.scss @@ -7,5 +7,11 @@ color: color-yiq($bg); background-color: darken($bg, 10%); } + + &:focus, + &.focus { + outline: 0; + box-shadow: 0 0 0 $badge-focus-width rgba($bg, .5); + } } } |