summaryrefslogtreecommitdiffstats
path: root/src/objects/_emoji.scss
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2025-08-06 16:40:56 +0200
committerVolpeon <git@volpeon.ink>2025-08-06 16:40:56 +0200
commit41b0d0497988274057fc2512c822a6bc9d2d3ebd (patch)
tree015a95ede42b799ac1fd049baa8b0a853b6d3bb3 /src/objects/_emoji.scss
parentFix button font size (diff)
downloadiro-design-41b0d0497988274057fc2512c822a6bc9d2d3ebd.tar.gz
iro-design-41b0d0497988274057fc2512c822a6bc9d2d3ebd.tar.bz2
iro-design-41b0d0497988274057fc2512c822a6bc9d2d3ebd.zip
Switch to tab indentationHEADmaster
Diffstat (limited to 'src/objects/_emoji.scss')
-rw-r--r--src/objects/_emoji.scss66
1 files changed, 33 insertions, 33 deletions
diff --git a/src/objects/_emoji.scss b/src/objects/_emoji.scss
index ce2dfa7..fd36535 100644
--- a/src/objects/_emoji.scss
+++ b/src/objects/_emoji.scss
@@ -8,43 +8,43 @@
8@use 'emoji.vars' as vars; 8@use 'emoji.vars' as vars;
9 9
10@mixin styles { 10@mixin styles {
11 @include materialize-at-root(meta.module-variables('vars')); 11 @include materialize-at-root(meta.module-variables('vars'));
12 12
13 @include bem.object('emoji') { 13 @include bem.object('emoji') {
14 position: relative; 14 position: relative;
15 display: inline-block; 15 display: inline-block;
16 inline-size: calc(props.get(vars.$size)); 16 inline-size: calc(props.get(vars.$size));
17 block-size: calc(props.get(vars.$size)); 17 block-size: calc(props.get(vars.$size));
18 padding: calc(props.get(vars.$pad)); 18 padding: calc(props.get(vars.$pad));
19 margin: calc(-1 * props.get(vars.$pad)); 19 margin: calc(-1 * props.get(vars.$pad));
20 vertical-align: props.get(vars.$valign); 20 vertical-align: props.get(vars.$valign);
21 object-fit: contain; 21 object-fit: contain;
22 22
23 @include bem.modifier('icon') { 23 @include bem.modifier('icon') {
24 margin: calc(-1 * props.get(vars.$pad) - .5 * (props.get(vars.$size) - props.get(icon.$size))); 24 margin: calc(-1 * props.get(vars.$pad) - .5 * (props.get(vars.$size) - props.get(icon.$size)));
25 vertical-align: props.get(icon.$valign); 25 vertical-align: props.get(icon.$valign);
26 } 26 }
27 27
28 @each $mod, $size, $valign in vars.$sizes { 28 @each $mod, $size, $valign in vars.$sizes {
29 @include bem.modifier($mod) { 29 @include bem.modifier($mod) {
30 inline-size: props.get($size); 30 inline-size: props.get($size);
31 block-size: props.get($size); 31 block-size: props.get($size);
32 vertical-align: props.get($valign); 32 vertical-align: props.get($valign);
33 33
34 @include bem.modifier('icon') { 34 @include bem.modifier('icon') {
35 margin: calc(-1 * props.get(vars.$pad) - .5 * (props.get($size) - props.get(icon.$size))); 35 margin: calc(-1 * props.get(vars.$pad) - .5 * (props.get($size) - props.get(icon.$size)));
36 } 36 }
37 } 37 }
38 } 38 }
39 39
40 @include bem.modifier('zoomable') { 40 @include bem.modifier('zoomable') {
41 border-radius: calc(props.get(vars.$rounding) / props.get(vars.$zoom)); 41 border-radius: calc(props.get(vars.$rounding) / props.get(vars.$zoom));
42 transition: transform .2s ease, background-color .2s ease; 42 transition: transform .2s ease, background-color .2s ease;
43 43
44 &:hover { 44 &:hover {
45 background-color: props.get(vars.$bg-color); 45 background-color: props.get(vars.$bg-color);
46 transform: scale(props.get(vars.$zoom)); 46 transform: scale(props.get(vars.$zoom));
47 } 47 }
48 } 48 }
49 } 49 }
50} 50}