diff options
author | Volpeon <git@volpeon.ink> | 2022-02-08 14:02:52 +0100 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2022-02-08 14:02:52 +0100 |
commit | defdf4ede0f42134c076b6a2c70519e2db629fba (patch) | |
tree | 6b9116114724c14ce1f1bb7015ff717e2f9e40be /src/objects | |
parent | Improved action menu (diff) | |
download | iro-design-defdf4ede0f42134c076b6a2c70519e2db629fba.tar.gz iro-design-defdf4ede0f42134c076b6a2c70519e2db629fba.tar.bz2 iro-design-defdf4ede0f42134c076b6a2c70519e2db629fba.zip |
Update
Diffstat (limited to 'src/objects')
-rw-r--r-- | src/objects/_action-menu.scss | 23 | ||||
-rw-r--r-- | src/objects/_button.scss | 2 |
2 files changed, 23 insertions, 2 deletions
diff --git a/src/objects/_action-menu.scss b/src/objects/_action-menu.scss index e908fdf..2c922f8 100644 --- a/src/objects/_action-menu.scss +++ b/src/objects/_action-menu.scss | |||
@@ -32,6 +32,12 @@ | |||
32 | --disabled: ( | 32 | --disabled: ( |
33 | --label: fn.global-color(--fg-hi3), | 33 | --label: fn.global-color(--fg-hi3), |
34 | ), | 34 | ), |
35 | --key-focus: ( | ||
36 | --bg: fn.global-color(--obj-hi), | ||
37 | --label: fn.global-color(--fg-lo), | ||
38 | --border: fn.global-color(--focus --fill), | ||
39 | --shadow: fn.global-color(--focus --shadow), | ||
40 | ), | ||
35 | ), | 41 | ), |
36 | ), | 42 | ), |
37 | ), 'colors'); | 43 | ), 'colors'); |
@@ -76,7 +82,8 @@ | |||
76 | display: block; | 82 | display: block; |
77 | box-sizing: border-box; | 83 | box-sizing: border-box; |
78 | width: 100%; | 84 | width: 100%; |
79 | padding: fn.dim(--item --pad-y) fn.dim(--item --pad-x); | 85 | padding: calc(fn.dim(--item --pad-y) - 2px) calc(fn.dim(--item --pad-x) - 2px); |
86 | border: 2px solid transparent; | ||
80 | color: fn.color(--item --disabled --label); | 87 | color: fn.color(--item --disabled --label); |
81 | 88 | ||
82 | &:link, | 89 | &:link, |
@@ -97,6 +104,20 @@ | |||
97 | color: currentColor; | 104 | color: currentColor; |
98 | } | 105 | } |
99 | } | 106 | } |
107 | |||
108 | @include iro.bem-at-theme('keyboard') { | ||
109 | &:focus { | ||
110 | border-radius: 2px; | ||
111 | border-color: fn.color(--item --key-focus --border); | ||
112 | background-color: fn.color(--item --key-focus --bg); | ||
113 | box-shadow: fn.color(--item --key-focus --shadow); | ||
114 | color: fn.color(--item --key-focus --label); | ||
115 | |||
116 | @include iro.bem-elem('icon') { | ||
117 | color: currentColor; | ||
118 | } | ||
119 | } | ||
120 | } | ||
100 | } | 121 | } |
101 | } | 122 | } |
102 | 123 | ||
diff --git a/src/objects/_button.scss b/src/objects/_button.scss index 0df0148..e5fcfaa 100644 --- a/src/objects/_button.scss +++ b/src/objects/_button.scss | |||
@@ -51,7 +51,7 @@ | |||
51 | ), | 51 | ), |
52 | --key-focus: ( | 52 | --key-focus: ( |
53 | --bg: transparent, | 53 | --bg: transparent, |
54 | --label: fn.global-color(--accent --primary --lo2), | 54 | --label: fn.global-color(--focus --text), |
55 | --border: fn.global-color(--focus --fill), | 55 | --border: fn.global-color(--focus --fill), |
56 | --shadow: fn.global-color(--focus --shadow), | 56 | --shadow: fn.global-color(--focus --shadow), |
57 | ), | 57 | ), |