diff options
Diffstat (limited to 'src/objects')
| -rw-r--r-- | src/objects/_badge.scss | 39 |
1 files changed, 38 insertions, 1 deletions
diff --git a/src/objects/_badge.scss b/src/objects/_badge.scss index 86d5ad2..f12ec1c 100644 --- a/src/objects/_badge.scss +++ b/src/objects/_badge.scss | |||
| @@ -22,10 +22,23 @@ | |||
| 22 | --colors: ( | 22 | --colors: ( |
| 23 | --bg: fn.global-color(--obj-hi), | 23 | --bg: fn.global-color(--obj-hi), |
| 24 | --label: fn.global-color(--fg-lo), | 24 | --label: fn.global-color(--fg-lo), |
| 25 | --hover: ( | ||
| 26 | --bg: fn.global-color(--obj), | ||
| 27 | ), | ||
| 28 | --active: ( | ||
| 29 | --bg: fn.global-color(--obj-lo), | ||
| 30 | ), | ||
| 31 | |||
| 25 | --accent: ( | 32 | --accent: ( |
| 26 | --bg: fn.global-color(--accent --primary --bg), | 33 | --bg: fn.global-color(--accent --primary --bg), |
| 27 | --label: fn.global-color(--accent --primary --fg), | 34 | --label: fn.global-color(--accent --primary --fg), |
| 28 | ) | 35 | --hover: ( |
| 36 | --bg: fn.global-color(--accent --primary --obj), | ||
| 37 | ), | ||
| 38 | --active: ( | ||
| 39 | --bg: fn.global-color(--accent --primary --obj-lo), | ||
| 40 | ), | ||
| 41 | ), | ||
| 29 | ), | 42 | ), |
| 30 | ), 'colors'); | 43 | ), 'colors'); |
| 31 | 44 | ||
| @@ -37,10 +50,34 @@ | |||
| 37 | color: fn.color(--label); | 50 | color: fn.color(--label); |
| 38 | font-size: fn.dim(--font-size); | 51 | font-size: fn.dim(--font-size); |
| 39 | text-align: center; | 52 | text-align: center; |
| 53 | |||
| 54 | &:link, | ||
| 55 | &:visited, | ||
| 56 | &:enabled { | ||
| 57 | &:hover { | ||
| 58 | background-color: fn.color(--hover --bg); | ||
| 59 | } | ||
| 60 | |||
| 61 | &:active { | ||
| 62 | background-color: fn.color(--active --bg); | ||
| 63 | } | ||
| 64 | } | ||
| 40 | 65 | ||
| 41 | @include iro.bem-modifier('accent') { | 66 | @include iro.bem-modifier('accent') { |
| 42 | background-color: fn.color(--accent --bg); | 67 | background-color: fn.color(--accent --bg); |
| 43 | color: fn.color(--accent --label); | 68 | color: fn.color(--accent --label); |
| 69 | |||
| 70 | &:link, | ||
| 71 | &:visited, | ||
| 72 | &:enabled { | ||
| 73 | &:hover { | ||
| 74 | background-color: fn.color(--accent --hover --bg); | ||
| 75 | } | ||
| 76 | |||
| 77 | &:active { | ||
| 78 | background-color: fn.color(--accent --active --bg); | ||
| 79 | } | ||
| 80 | } | ||
| 44 | } | 81 | } |
| 45 | 82 | ||
| 46 | @include iro.bem-modifier('fixed-100') { | 83 | @include iro.bem-modifier('fixed-100') { |
