summaryrefslogtreecommitdiffstats
path: root/src/objects/_action-button.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects/_action-button.scss')
-rw-r--r--src/objects/_action-button.scss64
1 files changed, 32 insertions, 32 deletions
diff --git a/src/objects/_action-button.scss b/src/objects/_action-button.scss
index 48149b1..8efdad9 100644
--- a/src/objects/_action-button.scss
+++ b/src/objects/_action-button.scss
@@ -9,91 +9,91 @@
9@use 'action-button.vars' as vars; 9@use 'action-button.vars' as vars;
10 10
11@mixin -apply-theme($theme, $key: ()) { 11@mixin -apply-theme($theme, $key: ()) {
12 color: props.get($theme, list.join($key, --disabled --label)...); 12 color: props.get($theme, list.join($key, --disabled --label-color)...);
13 background-color: props.get($theme, list.join($key, --disabled --bg)...); 13 background-color: props.get($theme, list.join($key, --disabled --bg-color)...);
14 border-color: props.get($theme, list.join($key, --disabled --border)...); 14 border-color: props.get($theme, list.join($key, --disabled --border-color)...);
15 15
16 &::after { 16 &::after {
17 outline-color: props.get($theme, list.join($key, --key-focus --border)...); 17 outline-color: props.get($theme, list.join($key, --key-focus --border-color)...);
18 box-shadow: 18 box-shadow:
19 0 19 0
20 0 20 0
21 0 21 0
22 calc(props.get(vars.$key-focus--border-width) + props.get(vars.$key-focus--outline-width)) 22 calc(props.get(vars.$key-focus--border-width) + props.get(vars.$key-focus--outline-width))
23 props.get($theme, list.join($key, --key-focus --outline-width)...); 23 props.get($theme, list.join($key, --key-focus --outline-color)...);
24 } 24 }
25 25
26 &:link, 26 &:link,
27 &:visited, 27 &:visited,
28 &:enabled { 28 &:enabled {
29 color: props.get($theme, list.join($key, --label)...); 29 color: props.get($theme, list.join($key, --label-color)...);
30 background-color: props.get($theme, list.join($key, --bg)...); 30 background-color: props.get($theme, list.join($key, --bg-color)...);
31 border-color: props.get($theme, list.join($key, --border)...); 31 border-color: props.get($theme, list.join($key, --border-color)...);
32 32
33 &:hover, 33 &:hover,
34 &:focus-visible { 34 &:focus-visible {
35 color: props.get($theme, list.join($key, --hover --label)...); 35 color: props.get($theme, list.join($key, --hover --label-color)...);
36 background-color: props.get($theme, list.join($key, --hover --bg)...); 36 background-color: props.get($theme, list.join($key, --hover --bg-color)...);
37 border-color: props.get($theme, list.join($key, --hover --border)...); 37 border-color: props.get($theme, list.join($key, --hover --border-color)...);
38 } 38 }
39 39
40 &:active { 40 &:active {
41 color: props.get($theme, list.join($key, --active --label)...); 41 color: props.get($theme, list.join($key, --active --label-color)...);
42 background-color: props.get($theme, list.join($key, --active --bg)...); 42 background-color: props.get($theme, list.join($key, --active --bg-color)...);
43 border-color: props.get($theme, list.join($key, --active --border)...); 43 border-color: props.get($theme, list.join($key, --active --border-color)...);
44 } 44 }
45 } 45 }
46 46
47 @include iro.bem-modifier('quiet') { 47 @include iro.bem-modifier('quiet') {
48 color: props.get($theme, list.join($key, --quiet --disabled --label)...); 48 color: props.get($theme, list.join($key, --quiet --disabled --label-color)...);
49 background-color: transparent; 49 background-color: transparent;
50 border-color: transparent; 50 border-color: transparent;
51 51
52 &:link, 52 &:link,
53 &:visited, 53 &:visited,
54 &:enabled { 54 &:enabled {
55 color: props.get($theme, list.join($key, --quiet --label)...); 55 color: props.get($theme, list.join($key, --quiet --label-color)...);
56 background-color: transparent; 56 background-color: transparent;
57 border-color: transparent; 57 border-color: transparent;
58 58
59 &:hover, 59 &:hover,
60 &:focus-visible { 60 &:focus-visible {
61 color: props.get($theme, list.join($key, --quiet --hover --label)...); 61 color: props.get($theme, list.join($key, --quiet --hover --label-color)...);
62 background-color: props.get($theme, list.join($key, --quiet --hover --bg)...); 62 background-color: props.get($theme, list.join($key, --quiet --hover --bg-color)...);
63 border-color: transparent; 63 border-color: transparent;
64 } 64 }
65 65
66 &:active { 66 &:active {
67 color: props.get($theme, list.join($key, --quiet --active --label)...); 67 color: props.get($theme, list.join($key, --quiet --active --label-color)...);
68 background-color: props.get($theme, list.join($key, --quiet --active --bg)...); 68 background-color: props.get($theme, list.join($key, --quiet --active --bg-color)...);
69 border-color: transparent; 69 border-color: transparent;
70 } 70 }
71 } 71 }
72 } 72 }
73 73
74 @include iro.bem-is('selected') { 74 @include iro.bem-is('selected') {
75 color: props.get($theme, list.join($key, --selected --disabled --label)...); 75 color: props.get($theme, list.join($key, --selected --disabled --label-color)...);
76 background-color: props.get($theme, list.join($key, --selected --disabled --bg)...); 76 background-color: props.get($theme, list.join($key, --selected --disabled --bg-color)...);
77 border-color: props.get($theme, list.join($key, --selected --disabled --border)...); 77 border-color: props.get($theme, list.join($key, --selected --disabled --border-color)...);
78 78
79 &:link, 79 &:link,
80 &:visited, 80 &:visited,
81 &:enabled { 81 &:enabled {
82 color: props.get($theme, list.join($key, --selected --label)...); 82 color: props.get($theme, list.join($key, --selected --label-color)...);
83 background-color: props.get($theme, list.join($key, --selected --bg)...); 83 background-color: props.get($theme, list.join($key, --selected --bg-color)...);
84 border-color: props.get($theme, list.join($key, --selected --border)...); 84 border-color: props.get($theme, list.join($key, --selected --border-color)...);
85 85
86 &:hover, 86 &:hover,
87 &:focus-visible { 87 &:focus-visible {
88 color: props.get($theme, list.join($key, --selected --hover --label)...); 88 color: props.get($theme, list.join($key, --selected --hover --label-color)...);
89 background-color: props.get($theme, list.join($key, --selected --hover --bg)...); 89 background-color: props.get($theme, list.join($key, --selected --hover --bg-color)...);
90 border-color: props.get($theme, list.join($key, --selected --hover --border)...); 90 border-color: props.get($theme, list.join($key, --selected --hover --border-color)...);
91 } 91 }
92 92
93 &:active { 93 &:active {
94 color: props.get($theme, list.join($key, --selected --active --label)...); 94 color: props.get($theme, list.join($key, --selected --active --label-color)...);
95 background-color: props.get($theme, list.join($key, --selected --active --bg)...); 95 background-color: props.get($theme, list.join($key, --selected --active --bg-color)...);
96 border-color: props.get($theme, list.join($key, --selected --active --border)...); 96 border-color: props.get($theme, list.join($key, --selected --active --border-color)...);
97 } 97 }
98 } 98 }
99 } 99 }
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-11-06 07:29:03 +0000