Action button: add static mod

1 files changed, 36 insertions, 7 deletions

diff --git a/src/objects/_action-button.scss b/src/objects/_action-button.scss
index 7863f50..f4a9a46 100644
--- a/src/objects/_action-button.scss
+++ b/src/objects/_action-button.scss
@@ -52,6 +52,35 @@
         }
     }
 
+    @include bem.modifier('static') {
+        color:            props.get($theme, list.join($key, --quiet --hover --label-color)...);
+        background-color: props.get($theme, list.join($key, --quiet --hover --bg-color)...);
+        border-color:     transparent;
+        box-shadow:       none;
+
+        &:link,
+        &:visited,
+        &:enabled {
+            color:            props.get($theme, list.join($key, --quiet --hover --label-color)...);
+            background-color: props.get($theme, list.join($key, --quiet --hover --bg-color)...);
+            border-color:     transparent;
+            box-shadow:       none;
+
+            &:hover,
+            &:focus-visible {
+                color:            props.get($theme, list.join($key, --quiet --active --label-color)...);
+                background-color: props.get($theme, list.join($key, --quiet --active --bg-color)...);
+                border-color:     transparent;
+            }
+
+            &:active {
+                color:            props.get($theme, list.join($key, --quiet --active --label-color)...);
+                background-color: props.get($theme, list.join($key, --quiet --active --bg-color)...);
+                border-color:     transparent;
+            }
+        }
+    }
+
     @include bem.modifier('quiet') {
         color:            props.get($theme, list.join($key, --quiet --disabled --label-color)...);
         background-color: transparent;
@@ -80,11 +109,17 @@
         }
     }
 
-    @include bem.is('selected', 'badge') {
+    @include bem.is('selected') {
         color:            props.get($theme, list.join($key, --selected --disabled --label-color)...);
         background-color: props.get($theme, list.join($key, --selected --disabled --bg-color)...);
         border-color:     props.get($theme, list.join($key, --selected --disabled --border-color)...);
 
+        @include bem.modifier('static') {
+            color:            props.get($theme, list.join($key, --selected --label-color)...);
+            background-color: props.get($theme, list.join($key, --selected --bg-color)...);
+            border-color:     props.get($theme, list.join($key, --selected --border-color)...);
+        }
+
         &:link,
         &:visited,
         &:enabled {
@@ -106,12 +141,6 @@
             }
         }
     }
-
-    @include bem.is('badge') {
-        color:            props.get($theme, list.join($key, --selected --label-color)...);
-        background-color: props.get($theme, list.join($key, --selected --bg-color)...);
-        border-color:     props.get($theme, list.join($key, --selected --border-color)...);
-    }
 }
 
 @mixin styles {