diff options
Diffstat (limited to 'src/objects/_badge.scss')
-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') { |