diff options
| author | Volpeon <git@volpeon.ink> | 2022-02-07 21:17:53 +0100 |
|---|---|---|
| committer | Volpeon <git@volpeon.ink> | 2022-02-07 21:17:53 +0100 |
| commit | 7213f51c4d982a2eaf988574f109d13f55dbc285 (patch) | |
| tree | ca795995a04a2845324804d87bd4409d6dadc6b5 /src/objects/_action-menu.scss | |
| parent | Improved action menu example (diff) | |
| download | iro-design-7213f51c4d982a2eaf988574f109d13f55dbc285.tar.gz iro-design-7213f51c4d982a2eaf988574f109d13f55dbc285.tar.bz2 iro-design-7213f51c4d982a2eaf988574f109d13f55dbc285.zip | |
Update
Diffstat (limited to 'src/objects/_action-menu.scss')
| -rw-r--r-- | src/objects/_action-menu.scss | 22 |
1 files changed, 17 insertions, 5 deletions
diff --git a/src/objects/_action-menu.scss b/src/objects/_action-menu.scss index 69fb9b0..cd35d47 100644 --- a/src/objects/_action-menu.scss +++ b/src/objects/_action-menu.scss | |||
| @@ -24,8 +24,11 @@ | |||
| 24 | --icon: fn.global-color(--fg-hi), | 24 | --icon: fn.global-color(--fg-hi), |
| 25 | --item: ( | 25 | --item: ( |
| 26 | --hover: ( | 26 | --hover: ( |
| 27 | --bg: fn.global-color(--obj-hi), | 27 | --bg: fn.global-color(--obj-hi), |
| 28 | --fg: fn.global-color(--fg-lo), | 28 | --label: fn.global-color(--fg-lo), |
| 29 | ), | ||
| 30 | --disabled: ( | ||
| 31 | --label: fn.global-color(--fg-hi3), | ||
| 29 | ), | 32 | ), |
| 30 | ), | 33 | ), |
| 31 | ), | 34 | ), |
| @@ -71,12 +74,21 @@ | |||
| 71 | box-sizing: border-box; | 74 | box-sizing: border-box; |
| 72 | width: 100%; | 75 | width: 100%; |
| 73 | padding: fn.dim(--item --pad-y) fn.dim(--item --pad-x); | 76 | padding: fn.dim(--item --pad-y) fn.dim(--item --pad-x); |
| 77 | color: fn.color(--item --disabled --label); | ||
| 78 | |||
| 79 | &:link, | ||
| 80 | &:visited, | ||
| 81 | &:enabled { | ||
| 82 | color: currentColor; | ||
| 83 | |||
| 84 | @include iro.bem-elem('icon') { | ||
| 85 | color: fn.color(--icon); | ||
| 86 | } | ||
| 74 | 87 | ||
| 75 | @include iro.bem-multi('&:link, &:visited', 'modifier' 'native') { | ||
| 76 | &:hover, | 88 | &:hover, |
| 77 | &:active { | 89 | &:active { |
| 78 | background-color: fn.color(--item --hover --bg); | 90 | background-color: fn.color(--item --hover --bg); |
| 79 | color: fn.color(--item --hover --fg); | 91 | color: fn.color(--item --hover --label); |
| 80 | 92 | ||
| 81 | @include iro.bem-elem('icon') { | 93 | @include iro.bem-elem('icon') { |
| 82 | color: currentColor; | 94 | color: currentColor; |
| @@ -92,7 +104,7 @@ | |||
| 92 | } | 104 | } |
| 93 | 105 | ||
| 94 | @include iro.bem-elem('icon') { | 106 | @include iro.bem-elem('icon') { |
| 95 | color: fn.color(--icon); | 107 | color: fn.color(--item --disabled --label); |
| 96 | } | 108 | } |
| 97 | } | 109 | } |
| 98 | } | 110 | } |
