diff options
| author | Volpeon <git@volpeon.ink> | 2023-02-13 16:22:32 +0100 |
|---|---|---|
| committer | Volpeon <git@volpeon.ink> | 2023-02-13 16:22:32 +0100 |
| commit | 7a517353ba7f84476502aefe102b305382a09d66 (patch) | |
| tree | b04176f8c4474f90b39bb93570ca1f5ba20bcd7e /src/objects | |
| parent | Update (diff) | |
| download | iro-design-7a517353ba7f84476502aefe102b305382a09d66.tar.gz iro-design-7a517353ba7f84476502aefe102b305382a09d66.tar.bz2 iro-design-7a517353ba7f84476502aefe102b305382a09d66.zip | |
Update
Diffstat (limited to 'src/objects')
| -rw-r--r-- | src/objects/_action-button.scss | 3 | ||||
| -rw-r--r-- | src/objects/_avatar.scss | 10 | ||||
| -rw-r--r-- | src/objects/_overflow-button.scss | 29 |
3 files changed, 26 insertions, 16 deletions
diff --git a/src/objects/_action-button.scss b/src/objects/_action-button.scss index 1cce94f..edb9200 100644 --- a/src/objects/_action-button.scss +++ b/src/objects/_action-button.scss | |||
| @@ -61,6 +61,7 @@ | |||
| 61 | --label: fn.global-color(--fg), | 61 | --label: fn.global-color(--fg), |
| 62 | 62 | ||
| 63 | --hover: ( | 63 | --hover: ( |
| 64 | --bg: fn.global-color(--obj), | ||
| 64 | --label: fn.global-color(--fg-lo), | 65 | --label: fn.global-color(--fg-lo), |
| 65 | ), | 66 | ), |
| 66 | ), | 67 | ), |
| @@ -187,7 +188,7 @@ | |||
| 187 | &:hover, | 188 | &:hover, |
| 188 | &:active { | 189 | &:active { |
| 189 | border-color: transparent; | 190 | border-color: transparent; |
| 190 | background-color: fn.color(--quiet --selected --bg); | 191 | background-color: fn.color(--quiet --selected --hover --bg); |
| 191 | box-shadow: none; | 192 | box-shadow: none; |
| 192 | color: fn.color(--quiet --selected --hover --label); | 193 | color: fn.color(--quiet --selected --hover --label); |
| 193 | } | 194 | } |
diff --git a/src/objects/_avatar.scss b/src/objects/_avatar.scss index da7fdbd..51b144a 100644 --- a/src/objects/_avatar.scss +++ b/src/objects/_avatar.scss | |||
| @@ -22,22 +22,22 @@ | |||
| 22 | @include iro.props-store(( | 22 | @include iro.props-store(( |
| 23 | --dims: ( | 23 | --dims: ( |
| 24 | --150: ( | 24 | --150: ( |
| 25 | --size: fn.global-dim(--size --600), | 25 | --size: fn.global-dim(--size --650), |
| 26 | --font-size: fn.global-dim(--font-size --150), | 26 | --font-size: fn.global-dim(--font-size --200), |
| 27 | --indicator-size: fn.global-dim(--size --175), | 27 | --indicator-size: fn.global-dim(--size --175), |
| 28 | ), | 28 | ), |
| 29 | --100: ( | 29 | --100: ( |
| 30 | --size: fn.global-dim(--size --450), | 30 | --size: fn.global-dim(--size --500), |
| 31 | --font-size: fn.global-dim(--font-size --100), | 31 | --font-size: fn.global-dim(--font-size --100), |
| 32 | --indicator-size: fn.global-dim(--size --125), | 32 | --indicator-size: fn.global-dim(--size --125), |
| 33 | ), | 33 | ), |
| 34 | --75: ( | 34 | --75: ( |
| 35 | --size: fn.global-dim(--size --325), | 35 | --size: fn.global-dim(--size --375), |
| 36 | --font-size: fn.global-dim(--font-size --75), | 36 | --font-size: fn.global-dim(--font-size --75), |
| 37 | --indicator-size: fn.global-dim(--size --100), | 37 | --indicator-size: fn.global-dim(--size --100), |
| 38 | ), | 38 | ), |
| 39 | --50: ( | 39 | --50: ( |
| 40 | --size: fn.global-dim(--size --225), | 40 | --size: fn.global-dim(--size --250), |
| 41 | --font-size: fn.global-dim(--font-size --50), | 41 | --font-size: fn.global-dim(--font-size --50), |
| 42 | --indicator-size: fn.global-dim(--size --85), | 42 | --indicator-size: fn.global-dim(--size --85), |
| 43 | ), | 43 | ), |
diff --git a/src/objects/_overflow-button.scss b/src/objects/_overflow-button.scss index 4a794a7..b15ea1f 100644 --- a/src/objects/_overflow-button.scss +++ b/src/objects/_overflow-button.scss | |||
| @@ -27,6 +27,7 @@ | |||
| 27 | --label: fn.global-color(--fg), | 27 | --label: fn.global-color(--fg), |
| 28 | 28 | ||
| 29 | --hover: ( | 29 | --hover: ( |
| 30 | --bg: fn.global-color(--obj), | ||
| 30 | --label: fn.global-color(--fg-lo), | 31 | --label: fn.global-color(--fg-lo), |
| 31 | ), | 32 | ), |
| 32 | ), | 33 | ), |
| @@ -47,11 +48,13 @@ | |||
| 47 | --bg: fn.global-color(--red --quiet --obj), | 48 | --bg: fn.global-color(--red --quiet --obj), |
| 48 | --label: fn.global-color(--red --quiet --fg-lo), | 49 | --label: fn.global-color(--red --quiet --fg-lo), |
| 49 | ), | 50 | ), |
| 51 | |||
| 50 | --selected: ( | 52 | --selected: ( |
| 51 | --bg: fn.global-color(--red --quiet --bg), | 53 | --bg: fn.global-color(--red --quiet --bg), |
| 52 | --label: fn.global-color(--red --quiet --fg), | 54 | --label: fn.global-color(--red --quiet --fg), |
| 53 | 55 | ||
| 54 | --hover: ( | 56 | --hover: ( |
| 57 | --bg: fn.global-color(--red --quiet --obj), | ||
| 55 | --label: fn.global-color(--red --quiet --fg-lo), | 58 | --label: fn.global-color(--red --quiet --fg-lo), |
| 56 | ), | 59 | ), |
| 57 | ), | 60 | ), |
| @@ -66,11 +69,13 @@ | |||
| 66 | --bg: fn.global-color(--blue --quiet --obj), | 69 | --bg: fn.global-color(--blue --quiet --obj), |
| 67 | --label: fn.global-color(--blue --quiet --fg-lo), | 70 | --label: fn.global-color(--blue --quiet --fg-lo), |
| 68 | ), | 71 | ), |
| 72 | |||
| 69 | --selected: ( | 73 | --selected: ( |
| 70 | --bg: fn.global-color(--blue --quiet --bg), | 74 | --bg: fn.global-color(--blue --quiet --bg), |
| 71 | --label: fn.global-color(--blue --quiet --fg), | 75 | --label: fn.global-color(--blue --quiet --fg), |
| 72 | 76 | ||
| 73 | --hover: ( | 77 | --hover: ( |
| 78 | --bg: fn.global-color(--blue --quiet --obj), | ||
| 74 | --label: fn.global-color(--blue --quiet --fg-lo), | 79 | --label: fn.global-color(--blue --quiet --fg-lo), |
| 75 | ), | 80 | ), |
| 76 | ), | 81 | ), |
| @@ -85,11 +90,13 @@ | |||
| 85 | --bg: fn.global-color(--green --quiet --obj), | 90 | --bg: fn.global-color(--green --quiet --obj), |
| 86 | --label: fn.global-color(--green --quiet --fg-lo), | 91 | --label: fn.global-color(--green --quiet --fg-lo), |
| 87 | ), | 92 | ), |
| 93 | |||
| 88 | --selected: ( | 94 | --selected: ( |
| 89 | --bg: fn.global-color(--green --quiet --bg), | 95 | --bg: fn.global-color(--green --quiet --bg), |
| 90 | --label: fn.global-color(--green --quiet --fg), | 96 | --label: fn.global-color(--green --quiet --fg), |
| 91 | 97 | ||
| 92 | --hover: ( | 98 | --hover: ( |
| 99 | --bg: fn.global-color(--green --quiet --obj), | ||
| 93 | --label: fn.global-color(--green --quiet --fg-lo), | 100 | --label: fn.global-color(--green --quiet --fg-lo), |
| 94 | ), | 101 | ), |
| 95 | ), | 102 | ), |
| @@ -154,18 +161,20 @@ | |||
| 154 | 161 | ||
| 155 | @include iro.bem-is('selected') { | 162 | @include iro.bem-is('selected') { |
| 156 | @include iro.bem-elem('inside') { | 163 | @include iro.bem-elem('inside') { |
| 157 | border-color: fn.color(--selected --bg); | 164 | background-color: fn.color(--selected --bg); |
| 158 | color: fn.color(--selected --label); | ||
| 159 | } | 165 | } |
| 160 | 166 | ||
| 161 | &:link, | 167 | &:link, |
| 162 | &:visited, | 168 | &:visited, |
| 163 | &:enabled { | 169 | &:enabled { |
| 170 | @include iro.bem-elem('inside') { | ||
| 171 | color: fn.color(--selected --label); | ||
| 172 | } | ||
| 173 | |||
| 164 | &:hover, | 174 | &:hover, |
| 165 | &:active { | 175 | &:active { |
| 166 | @include iro.bem-elem('inside') { | 176 | @include iro.bem-elem('inside') { |
| 167 | border-color: transparent; | 177 | background-color: fn.color(--selected --hover --bg); |
| 168 | background-color: fn.color(--selected --bg); | ||
| 169 | color: fn.color(--selected --hover --label); | 178 | color: fn.color(--selected --hover --label); |
| 170 | } | 179 | } |
| 171 | } | 180 | } |
| @@ -202,18 +211,18 @@ | |||
| 202 | } | 211 | } |
| 203 | 212 | ||
| 204 | @include iro.bem-is('selected') { | 213 | @include iro.bem-is('selected') { |
| 205 | @include iro.bem-elem('inside') { | ||
| 206 | border-color: fn.color(--#{$color} --selected --bg); | ||
| 207 | color: fn.color(--#{$color} --selected --label); | ||
| 208 | } | ||
| 209 | |||
| 210 | &:link, | 214 | &:link, |
| 211 | &:visited, | 215 | &:visited, |
| 212 | &:enabled { | 216 | &:enabled { |
| 217 | @include iro.bem-elem('inside') { | ||
| 218 | background-color: fn.color(--#{$color} --selected --bg); | ||
| 219 | color: fn.color(--#{$color} --selected --label); | ||
| 220 | } | ||
| 221 | |||
| 213 | &:hover, | 222 | &:hover, |
| 214 | &:active { | 223 | &:active { |
| 215 | @include iro.bem-elem('inside') { | 224 | @include iro.bem-elem('inside') { |
| 216 | background-color: fn.color(--#{$color} --selected --bg); | 225 | background-color: fn.color(--#{$color} --selected --hover --bg); |
| 217 | color: fn.color(--#{$color} --selected --hover --label); | 226 | color: fn.color(--#{$color} --selected --hover --label); |
| 218 | } | 227 | } |
| 219 | } | 228 | } |
