summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2023-01-28 17:19:24 +0100
committerVolpeon <git@volpeon.ink>2023-01-28 17:19:24 +0100
commit55766016d327b4ac7b4e9dff457f1b4589ea753f (patch)
tree3a637748774736b164b282ebeddd64f32d7ad0c3
parentBetter unicode emoji (diff)
downloadiro-design-55766016d327b4ac7b4e9dff457f1b4589ea753f.tar.gz
iro-design-55766016d327b4ac7b4e9dff457f1b4589ea753f.tar.bz2
iro-design-55766016d327b4ac7b4e9dff457f1b4589ea753f.zip
nvm, non-image emojis are a pain
-rw-r--r--src/objects/_emoji.scss20
-rw-r--r--tpl/objects/emoji.pug9
-rw-r--r--tpl/views/emoji.pug10
3 files changed, 10 insertions, 29 deletions
diff --git a/src/objects/_emoji.scss b/src/objects/_emoji.scss
index 6ab71d7..7d03b13 100644
--- a/src/objects/_emoji.scss
+++ b/src/objects/_emoji.scss
@@ -22,18 +22,13 @@
22 ), 'colors'); 22 ), 'colors');
23 23
24 @include iro.bem-object(iro.props-namespace()) { 24 @include iro.bem-object(iro.props-namespace()) {
25 display: inline-flex; 25 display: inline;
26 position: relative; 26 width: 1em;
27 align-items: center; 27 height: 1em;
28 justify-content: center; 28 margin: calc(-.5 * fn.dim(--size)) calc(-1 * fn.dim(--pad));
29 width: 1em; 29 padding: fn.dim(--pad);
30 height: 1em; 30 font-size: fn.dim(--size);
31 margin: calc(-.5 * fn.dim(--size)) calc(-1 * fn.dim(--pad)); 31 vertical-align: .15em;
32 padding: fn.dim(--pad);
33 font-size: fn.dim(--size);
34 line-height: 1;
35 text-align: center;
36 vertical-align: middle;
37 32
38 @include iro.bem-modifier('125') { 33 @include iro.bem-modifier('125') {
39 margin-top: calc(-.5 * fn.dim(--125 --size)); 34 margin-top: calc(-.5 * fn.dim(--125 --size));
@@ -46,7 +41,6 @@
46 border-radius: calc(fn.dim(--rounding) / fn.dim(--zoom)); 41 border-radius: calc(fn.dim(--rounding) / fn.dim(--zoom));
47 42
48 &:hover { 43 &:hover {
49 z-index: 10;
50 transform: scale(fn.dim(--zoom)); 44 transform: scale(fn.dim(--zoom));
51 background-color: fn.color(--bg); 45 background-color: fn.color(--bg);
52 } 46 }
diff --git a/tpl/objects/emoji.pug b/tpl/objects/emoji.pug
index af56c7a..af65028 100644
--- a/tpl/objects/emoji.pug
+++ b/tpl/objects/emoji.pug
@@ -11,11 +11,4 @@ mixin emoji(id)
11 classes['o-emoji--' + attributes.size] = true; 11 classes['o-emoji--' + attributes.size] = true;
12 } 12 }
13 13
14 if (!attributes.unicode) { 14 img(src=id + '.png', class=classes)
15 src = id + '.png'
16 }
17
18 if !attributes.unicode
19 img(src=src, class=classes)
20 else
21 span(class=classes)= id
diff --git a/tpl/views/emoji.pug b/tpl/views/emoji.pug
index 2503e8d..8410794 100644
--- a/tpl/views/emoji.pug
+++ b/tpl/views/emoji.pug
@@ -4,23 +4,17 @@ mixin view-emoji
4 =loremIpsum 4 =loremIpsum
5 =' ' 5 =' '
6 +emoji('drgn') 6 +emoji('drgn')
7 =' ' 7 +emoji('drgn')
8 +emoji('🐉️')(unicode=true)
9 =' ' 8 =' '
10 =loremIpsum 9 =loremIpsum
11 =' ' 10 =' '
12 +emoji('drgn')(zoomable=true) 11 +emoji('drgn')(zoomable=true)
13 =' ' 12 =' '
14 +emoji('🐉️')(zoomable=true unicode=true)
15 =' '
16 =loremIpsum 13 =loremIpsum
17 =' ' 14 =' '
18 +emoji('drgn')(size=125) 15 +emoji('drgn')(size=125)
19 =' ' 16 +emoji('drgn')(size=125)
20 +emoji('🐉️')(unicode=true size=125)
21 =' ' 17 =' '
22 =loremIpsum 18 =loremIpsum
23 =' ' 19 =' '
24 +emoji('drgn')(zoomable=true size=125) 20 +emoji('drgn')(zoomable=true size=125)
25 =' '
26 +emoji('🐉️')(zoomable=true unicode=true size=125)