diff options
Diffstat (limited to 'src/objects')
| -rw-r--r-- | src/objects/_action-menu.scss | 2 | ||||
| -rw-r--r-- | src/objects/_avatar.scss | 37 | ||||
| -rw-r--r-- | src/objects/_icon.scss | 14 | 
3 files changed, 28 insertions, 25 deletions
| diff --git a/src/objects/_action-menu.scss b/src/objects/_action-menu.scss index a3e1ca1..3943252 100644 --- a/src/objects/_action-menu.scss +++ b/src/objects/_action-menu.scss | |||
| @@ -117,7 +117,7 @@ | |||
| 117 | @include iro.bem-elem('icon-slot') { | 117 | @include iro.bem-elem('icon-slot') { | 
| 118 | display: flex; | 118 | display: flex; | 
| 119 | justify-content: center; | 119 | justify-content: center; | 
| 120 | width: 1em; | 120 | width: 1.2em; | 
| 121 | } | 121 | } | 
| 122 | } | 122 | } | 
| 123 | } | 123 | } | 
| diff --git a/src/objects/_avatar.scss b/src/objects/_avatar.scss index 5a65fbf..526912f 100644 --- a/src/objects/_avatar.scss +++ b/src/objects/_avatar.scss | |||
| @@ -21,6 +21,11 @@ | |||
| 21 | @include iro.props-namespace('avatar') { | 21 | @include iro.props-namespace('avatar') { | 
| 22 | @include iro.props-store(( | 22 | @include iro.props-store(( | 
| 23 | --dims: ( | 23 | --dims: ( | 
| 24 | --150: ( | ||
| 25 | --size: fn.global-dim(--size --600), | ||
| 26 | --font-size: fn.global-dim(--font-size --150), | ||
| 27 | --indicator-size: fn.global-dim(--size --175), | ||
| 28 | ), | ||
| 24 | --100: ( | 29 | --100: ( | 
| 25 | --size: fn.global-dim(--size --450), | 30 | --size: fn.global-dim(--size --450), | 
| 26 | --font-size: fn.global-dim(--font-size --100), | 31 | --font-size: fn.global-dim(--font-size --100), | 
| @@ -89,27 +94,17 @@ | |||
| 89 | } | 94 | } | 
| 90 | } | 95 | } | 
| 91 | 96 | ||
| 92 | @include iro.bem-modifier('75') { | 97 | @each $size in 50 75 150 { | 
| 93 | font-size: fn.dim(--75 --font-size); | 98 | @include iro.bem-modifier($size) { | 
| 94 | 99 | font-size: fn.dim(--#{$size} --font-size); | |
| 95 | @include status(75); | 100 | |
| 96 | 101 | @include status($size); | |
| 97 | @include iro.bem-elem('content') { | 102 | |
| 98 | width: fn.dim(--75 --size); | 103 | @include iro.bem-elem('content') { | 
| 99 | height: fn.dim(--75 --size); | 104 | width: fn.dim(--#{$size} --size); | 
| 100 | line-height: fn.dim(--75 --size); | 105 | height: fn.dim(--#{$size} --size); | 
| 101 | } | 106 | line-height: fn.dim(--#{$size} --size); | 
| 102 | } | 107 | } | 
| 103 | |||
| 104 | @include iro.bem-modifier('50') { | ||
| 105 | font-size: fn.dim(--50 --font-size); | ||
| 106 | |||
| 107 | @include status(50); | ||
| 108 | |||
| 109 | @include iro.bem-elem('content') { | ||
| 110 | width: fn.dim(--50 --size); | ||
| 111 | height: fn.dim(--50 --size); | ||
| 112 | line-height: fn.dim(--50 --size); | ||
| 113 | } | 108 | } | 
| 114 | } | 109 | } | 
| 115 | } | 110 | } | 
| diff --git a/src/objects/_icon.scss b/src/objects/_icon.scss index e613ec2..12baeba 100644 --- a/src/objects/_icon.scss +++ b/src/objects/_icon.scss | |||
| @@ -1,11 +1,19 @@ | |||
| 1 | @use 'iro-sass/src/index' as iro; | 1 | @use 'iro-sass/src/index' as iro; | 
| 2 | @use '../functions' as fn; | ||
| 2 | 3 | ||
| 3 | @include iro.props-namespace('icon') { | 4 | @include iro.props-namespace('icon') { | 
| 5 | @include iro.props-store(( | ||
| 6 | --dims: ( | ||
| 7 | --stroke: 1.5px, | ||
| 8 | --size: calc(1 / 14 * 16em), | ||
| 9 | ) | ||
| 10 | ), 'dims'); | ||
| 11 | |||
| 4 | @include iro.bem-object(iro.props-namespace()) { | 12 | @include iro.bem-object(iro.props-namespace()) { | 
| 5 | display: inline-block; | 13 | display: inline-block; | 
| 6 | width: 1em; | 14 | width: fn.dim(--size); | 
| 7 | height: 1em; | 15 | height: fn.dim(--size); | 
| 8 | stroke-width: var(--icon-stroke-width, 1.5px); | 16 | stroke-width: fn.dim(--stroke); | 
| 9 | stroke-linecap: round; | 17 | stroke-linecap: round; | 
| 10 | stroke-linejoin: round; | 18 | stroke-linejoin: round; | 
| 11 | vertical-align: -.12em; | 19 | vertical-align: -.12em; | 
