From 56fd1f36a7d36fe7f6f9e5ed7efc93acdd341da2 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Sun, 6 Feb 2022 15:23:39 +0100 Subject: Updated action button --- src/objects/_action-button.scss | 30 +++++++++++++++++++----------- 1 file changed, 19 insertions(+), 11 deletions(-) diff --git a/src/objects/_action-button.scss b/src/objects/_action-button.scss index 153780d..6aa1823 100644 --- a/src/objects/_action-button.scss +++ b/src/objects/_action-button.scss @@ -27,11 +27,12 @@ ), --selected: ( --bg: iro.props-get(--colors --obj-hi, $global: true), - --label: iro.props-get(--colors --fg-lo, $global: true), + --label: iro.props-get(--colors --fg, $global: true), --border: iro.props-get(--colors --fg-hi3, $global: true), --shadow: 0 0 0 0 transparent, - + --hover: ( + --label: iro.props-get(--colors --fg-lo, $global: true), --border: iro.props-get(--colors --fg-hi2, $global: true), --shadow: 0 0 0 0 transparent, ), @@ -64,8 +65,11 @@ ), --selected: ( --bg: iro.props-get(--colors --obj-hi, $global: true), - --label: iro.props-get(--colors --fg-lo, $global: true), + --label: iro.props-get(--colors --fg, $global: true), + --hover: ( + --label: iro.props-get(--colors --fg-lo, $global: true), + ), --key-focus: ( --bg: iro.props-get(--colors --obj, $global: true), ), @@ -97,7 +101,7 @@ text-overflow: ellipsis; white-space: nowrap; - @include iro.bem-multi('&:link, &:visited', 'modifier:' 'native') { + @include iro.bem-multi('&:link, &:visited', 'modifier' 'native') { &:hover { border-color: iro.props-get(--colors --hover --border); background-color: iro.props-get(--colors --hover --bg); @@ -128,13 +132,13 @@ box-shadow: iro.props-get(--colors --selected --shadow); color: iro.props-get(--colors --selected --label); - @include iro.bem-multi('&:link, &:visited', 'modifier:' 'native') { + @include iro.bem-multi('&:link, &:visited', 'modifier' 'native') { &:hover, &:active { border-color: iro.props-get(--colors --selected --hover --border); background-color: iro.props-get(--colors --selected --bg); box-shadow: iro.props-get(--colors --selected --hover --shadow); - color: iro.props-get(--colors --selected --label); + color: iro.props-get(--colors --selected --hover --label); } } @@ -154,7 +158,7 @@ box-shadow: none; color: iro.props-get(--colors --quiet --label); - @include iro.bem-multi('&:link, &:visited', 'modifier:' 'native') { + @include iro.bem-multi('&:link, &:visited', 'modifier' 'native') { &:hover { border-color: transparent; background-color: iro.props-get(--colors --quiet --hover --bg); @@ -185,13 +189,13 @@ box-shadow: none; color: iro.props-get(--colors --quiet --selected --label); - @include iro.bem-multi('&:link, &:visited', 'modifier:' 'native') { + @include iro.bem-multi('&:link, &:visited', 'modifier' 'native') { &:hover, &:active { border-color: transparent; background-color: iro.props-get(--colors --quiet --selected --bg); box-shadow: none; - color: iro.props-get(--colors --quiet --selected --label); + color: iro.props-get(--colors --quiet --selected --hover --label); } } @@ -212,7 +216,7 @@ box-shadow: iro.props-get(--colors --disabled --shadow); color: iro.props-get(--colors --disabled --label); - @include iro.bem-multi('&:link, &:visited', 'modifier:' 'native') { + @include iro.bem-multi('&:link, &:visited', 'modifier' 'native') { &:hover, &:active { border-color: iro.props-get(--colors --disabled --border); @@ -228,7 +232,7 @@ box-shadow: none; color: iro.props-get(--colors --quiet --disabled --label); - @include iro.bem-multi('&:link, &:visited', 'modifier:' 'native') { + @include iro.bem-multi('&:link, &:visited', 'modifier' 'native') { &:hover, &:active { border-color: transparent; @@ -237,6 +241,10 @@ color: iro.props-get(--colors --quiet --disabled --label); } } + + @include iro.bem-is('selected') { + background-color: iro.props-get(--colors --quiet --selected --bg); + } } } } -- cgit v1.2.3-70-g09d2