summaryrefslogtreecommitdiffstats
path: root/src/objects/_button.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects/_button.scss')
-rw-r--r--src/objects/_button.scss34
1 files changed, 15 insertions, 19 deletions
diff --git a/src/objects/_button.scss b/src/objects/_button.scss
index 0467f24..8fbec78 100644
--- a/src/objects/_button.scss
+++ b/src/objects/_button.scss
@@ -36,7 +36,7 @@
36 props.get(vars.$shadow-blur) 36 props.get(vars.$shadow-blur)
37 props.get(vars.$shadow-grow) 37 props.get(vars.$shadow-grow)
38 props.get($theme, list.join($key, --shadow-color)...); 38 props.get($theme, list.join($key, --shadow-color)...);
39 39
40 &:hover, 40 &:hover,
41 &:focus-visible { 41 &:focus-visible {
42 color: props.get($theme, list.join($key, --hover --label-color)...); 42 color: props.get($theme, list.join($key, --hover --label-color)...);
@@ -52,31 +52,31 @@
52 } 52 }
53 } 53 }
54 54
55 @include bem.modifier('static') { 55 @include bem.modifier('badge') {
56 color: props.get($theme, list.join($key, --static --label-color)...); 56 color: props.get($theme, list.join($key, --badge --label-color)...);
57 background-color: props.get($theme, list.join($key, --static --bg-color)...); 57 background-color: props.get($theme, list.join($key, --badge --bg-color)...);
58 border-color: props.get($theme, list.join($key, --static --border-color)...); 58 border-color: props.get($theme, list.join($key, --badge --border-color)...);
59 box-shadow: none; 59 box-shadow: none;
60 60
61 &:link, 61 &:link,
62 &:visited, 62 &:visited,
63 &:enabled { 63 &:enabled {
64 color: props.get($theme, list.join($key, --static --label-color)...); 64 color: props.get($theme, list.join($key, --badge --label-color)...);
65 background-color: props.get($theme, list.join($key, --static --bg-color)...); 65 background-color: props.get($theme, list.join($key, --badge --bg-color)...);
66 border-color: props.get($theme, list.join($key, --static --border-color)...); 66 border-color: props.get($theme, list.join($key, --badge --border-color)...);
67 box-shadow: none; 67 box-shadow: none;
68 68
69 &:hover, 69 &:hover,
70 &:focus-visible { 70 &:focus-visible {
71 color: props.get($theme, list.join($key, --static --hover --label-color)...); 71 color: props.get($theme, list.join($key, --badge --hover --label-color)...);
72 background-color: props.get($theme, list.join($key, --static --hover --bg-color)...); 72 background-color: props.get($theme, list.join($key, --badge --hover --bg-color)...);
73 border-color: props.get($theme, list.join($key, --static --hover --border-color)...); 73 border-color: props.get($theme, list.join($key, --badge --hover --border-color)...);
74 } 74 }
75 75
76 &:active { 76 &:active {
77 color: props.get($theme, list.join($key, --static --active --label-color)...); 77 color: props.get($theme, list.join($key, --badge --active --label-color)...);
78 background-color: props.get($theme, list.join($key, --static --active --bg-color)...); 78 background-color: props.get($theme, list.join($key, --badge --active --bg-color)...);
79 border-color: props.get($theme, list.join($key, --static --active --border-color)...); 79 border-color: props.get($theme, list.join($key, --badge --active --border-color)...);
80 } 80 }
81 } 81 }
82 } 82 }
@@ -114,7 +114,7 @@
114 background-color: props.get($theme, list.join($key, --selected --disabled --bg-color)...); 114 background-color: props.get($theme, list.join($key, --selected --disabled --bg-color)...);
115 border-color: props.get($theme, list.join($key, --selected --disabled --border-color)...); 115 border-color: props.get($theme, list.join($key, --selected --disabled --border-color)...);
116 116
117 @include bem.modifier('static') { 117 @include bem.multi('&:link, &:visited, &:enabled', 'modifier' 'badge') {
118 color: props.get($theme, list.join($key, --selected --label-color)...); 118 color: props.get($theme, list.join($key, --selected --label-color)...);
119 background-color: props.get($theme, list.join($key, --selected --bg-color)...); 119 background-color: props.get($theme, list.join($key, --selected --bg-color)...);
120 border-color: props.get($theme, list.join($key, --selected --border-color)...); 120 border-color: props.get($theme, list.join($key, --selected --border-color)...);
@@ -123,10 +123,6 @@
123 &:link, 123 &:link,
124 &:visited, 124 &:visited,
125 &:enabled { 125 &:enabled {
126 color: props.get($theme, list.join($key, --selected --label-color)...);
127 background-color: props.get($theme, list.join($key, --selected --bg-color)...);
128 border-color: props.get($theme, list.join($key, --selected --border-color)...);
129
130 &:hover, 126 &:hover,
131 &:focus-visible { 127 &:focus-visible {
132 color: props.get($theme, list.join($key, --selected --hover --label-color)...); 128 color: props.get($theme, list.join($key, --selected --hover --label-color)...);