diff options
Diffstat (limited to 'src/objects/_button.scss')
| -rw-r--r-- | src/objects/_button.scss | 22 |
1 files changed, 11 insertions, 11 deletions
diff --git a/src/objects/_button.scss b/src/objects/_button.scss index 854e1e3..e4a656c 100644 --- a/src/objects/_button.scss +++ b/src/objects/_button.scss | |||
| @@ -22,9 +22,9 @@ | |||
| 22 | &:link, | 22 | &:link, |
| 23 | &:visited, | 23 | &:visited, |
| 24 | &:enabled { | 24 | &:enabled { |
| 25 | color: props.get($theme, list.join($key, --outline-label)); | 25 | color: props.get($theme, list.join($key, --outline-label)...); |
| 26 | background-color: transparent; | 26 | background-color: transparent; |
| 27 | border-color: props.get($theme, list.join($key, --outline-border)); | 27 | border-color: props.get($theme, list.join($key, --outline-border)...); |
| 28 | } | 28 | } |
| 29 | } | 29 | } |
| 30 | 30 | ||
| @@ -33,37 +33,37 @@ | |||
| 33 | &:enabled { | 33 | &:enabled { |
| 34 | &:hover, | 34 | &:hover, |
| 35 | &:focus-visible { | 35 | &:focus-visible { |
| 36 | color: props.get($theme, list.join($key, --hover --label)); | 36 | color: props.get($theme, list.join($key, --hover --label)...); |
| 37 | background-color: props.get($theme, list.join($key, --hover --bg)); | 37 | background-color: props.get($theme, list.join($key, --hover --bg)...); |
| 38 | border-color: transparent; | 38 | border-color: transparent; |
| 39 | } | 39 | } |
| 40 | 40 | ||
| 41 | &:active { | 41 | &:active { |
| 42 | color: props.get($theme, list.join($key, --active --label)); | 42 | color: props.get($theme, list.join($key, --active --label)...); |
| 43 | background-color: props.get($theme, list.join($key, --active --bg)); | 43 | background-color: props.get($theme, list.join($key, --active --bg)...); |
| 44 | border-color: transparent; | 44 | border-color: transparent; |
| 45 | } | 45 | } |
| 46 | } | 46 | } |
| 47 | } | 47 | } |
| 48 | 48 | ||
| 49 | @mixin -apply-static-theme($theme, $key: ()) { | 49 | @mixin -apply-static-theme($theme, $key: ()) { |
| 50 | color: props.get($theme, list.join($key, --disabled --label)); | 50 | color: props.get($theme, list.join($key, --disabled --label)...); |
| 51 | background-color: props.get($theme, list.join($key, --disabled --bg)); | 51 | background-color: props.get($theme, list.join($key, --disabled --bg)...); |
| 52 | border-color: transparent; | 52 | border-color: transparent; |
| 53 | 53 | ||
| 54 | &::after { | 54 | &::after { |
| 55 | outline: props.get($theme, list.join($key, --key-focus --border)) solid props.get(vars.$key-focus--border-width); | 55 | outline-color: props.get($theme, list.join($key, --key-focus --border)...); |
| 56 | box-shadow: | 56 | box-shadow: |
| 57 | 0 | 57 | 0 |
| 58 | 0 | 58 | 0 |
| 59 | 0 | 59 | 0 |
| 60 | calc(props.get(vars.$key-focus--border-width) + props.get(vars.$key-focus--outline-width)) | 60 | calc(props.get(vars.$key-focus--border-width) + props.get(vars.$key-focus--outline-width)) |
| 61 | props.get($theme, list.join($key, --key-focus --outline)); | 61 | props.get($theme, list.join($key, --key-focus --outline)...); |
| 62 | } | 62 | } |
| 63 | 63 | ||
| 64 | @include iro.bem-modifier('outline') { | 64 | @include iro.bem-modifier('outline') { |
| 65 | background-color: transparent; | 65 | background-color: transparent; |
| 66 | border-color: props.get($theme, list.join($key, --disabled --outline-border)); | 66 | border-color: props.get($theme, list.join($key, --disabled --outline-border)...); |
| 67 | } | 67 | } |
| 68 | 68 | ||
| 69 | @include -apply-theme($theme, $key); | 69 | @include -apply-theme($theme, $key); |
