diff options
author | Volpeon <git@volpeon.ink> | 2023-01-28 16:05:37 +0100 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2023-01-28 16:05:37 +0100 |
commit | 44d19cf5faf41b2cd576fc353ee16cb643584fb2 (patch) | |
tree | c57e4399ab8b5ea85677610f915dd2cd319a293a /src | |
parent | Fix (diff) | |
download | iro-design-44d19cf5faf41b2cd576fc353ee16cb643584fb2.tar.gz iro-design-44d19cf5faf41b2cd576fc353ee16cb643584fb2.tar.bz2 iro-design-44d19cf5faf41b2cd576fc353ee16cb643584fb2.zip |
Emoji
Diffstat (limited to 'src')
-rw-r--r-- | src/objects/_emoji.scss | 19 |
1 files changed, 15 insertions, 4 deletions
diff --git a/src/objects/_emoji.scss b/src/objects/_emoji.scss index 37e1ccc..7d03b13 100644 --- a/src/objects/_emoji.scss +++ b/src/objects/_emoji.scss | |||
@@ -5,9 +5,13 @@ | |||
5 | @include iro.props-store(( | 5 | @include iro.props-store(( |
6 | --dims: ( | 6 | --dims: ( |
7 | --size: 1.4em, | 7 | --size: 1.4em, |
8 | --pad: .2em, | 8 | --pad: .3em, |
9 | --rounding: 3px, | 9 | --rounding: 3px, |
10 | --zoom: 2, | 10 | --zoom: 2, |
11 | |||
12 | --125: ( | ||
13 | --size: 1.8em, | ||
14 | ) | ||
11 | ) | 15 | ) |
12 | ), 'dims'); | 16 | ), 'dims'); |
13 | 17 | ||
@@ -19,11 +23,18 @@ | |||
19 | 23 | ||
20 | @include iro.bem-object(iro.props-namespace()) { | 24 | @include iro.bem-object(iro.props-namespace()) { |
21 | display: inline; | 25 | display: inline; |
22 | width: fn.dim(--size); | 26 | width: 1em; |
23 | height: fn.dim(--size); | 27 | height: 1em; |
24 | margin: calc(-.5 * fn.dim(--size)) calc(-1 * fn.dim(--pad)); | 28 | margin: calc(-.5 * fn.dim(--size)) calc(-1 * fn.dim(--pad)); |
25 | padding: fn.dim(--pad); | 29 | padding: fn.dim(--pad); |
26 | vertical-align: .1em; | 30 | font-size: fn.dim(--size); |
31 | vertical-align: .15em; | ||
32 | |||
33 | @include iro.bem-modifier('125') { | ||
34 | margin-top: calc(-.5 * fn.dim(--125 --size)); | ||
35 | margin-bottom: calc(-.5 * fn.dim(--125 --size)); | ||
36 | font-size: fn.dim(--125 --size); | ||
37 | } | ||
27 | 38 | ||
28 | @include iro.bem-modifier('zoomable') { | 39 | @include iro.bem-modifier('zoomable') { |
29 | transition: transform .2s ease, background-color .2s ease; | 40 | transition: transform .2s ease, background-color .2s ease; |