diff options
-rw-r--r-- | assets/css/objects/_emoji.scss | 21 | ||||
-rw-r--r-- | content/index.md | 2 |
2 files changed, 13 insertions, 10 deletions
diff --git a/assets/css/objects/_emoji.scss b/assets/css/objects/_emoji.scss index 8387e1d..64b1b41 100644 --- a/assets/css/objects/_emoji.scss +++ b/assets/css/objects/_emoji.scss | |||
@@ -4,7 +4,8 @@ | |||
4 | @include iro.props-namespace('emoji') { | 4 | @include iro.props-namespace('emoji') { |
5 | @include iro.props-store(( | 5 | @include iro.props-store(( |
6 | --dims: ( | 6 | --dims: ( |
7 | --size: 1em, | 7 | --size: 1.4em, |
8 | --pad: .2em, | ||
8 | --rounding: 3px, | 9 | --rounding: 3px, |
9 | ) | 10 | ) |
10 | ), 'dims'); | 11 | ), 'dims'); |
@@ -16,14 +17,16 @@ | |||
16 | ), 'colors'); | 17 | ), 'colors'); |
17 | 18 | ||
18 | @include iro.bem-object(iro.props-namespace()) { | 19 | @include iro.bem-object(iro.props-namespace()) { |
19 | display: inline; | 20 | display: inline; |
20 | width: fn.dim(--size); | 21 | position: relative; |
21 | height: fn.dim(--size); | 22 | top: calc(-.5em * fn.global-dim(--font --standard --line-height) + fn.dim(--rounding)); |
22 | margin: calc(-1 * fn.dim(--rounding) - fn.dim(--size) + 1em) calc(.25em - fn.dim(--rounding)); | 23 | width: fn.dim(--size); |
23 | padding: fn.dim(--rounding); | 24 | height: fn.dim(--size); |
24 | transform: scale(1.5); | 25 | margin: calc(-.5 * fn.dim(--size)) 0; |
25 | transition: transform .2s ease, background-color .2s ease; | 26 | padding: fn.dim(--pad); |
26 | border-radius: calc(fn.dim(--rounding) / 3); | 27 | transition: transform .2s ease, background-color .2s ease; |
28 | border-radius: calc(fn.dim(--rounding) / 3); | ||
29 | vertical-align: bottom; | ||
27 | 30 | ||
28 | &:hover { | 31 | &:hover { |
29 | transform: scale(3); | 32 | transform: scale(3); |
diff --git a/content/index.md b/content/index.md index d854641..54fd580 100644 --- a/content/index.md +++ b/content/index.md | |||
@@ -2,4 +2,4 @@ | |||
2 | title: Volpeon | 2 | title: Volpeon |
3 | --- | 3 | --- |
4 | 4 | ||
5 | A red fox disguised as a software developer. Writes code, creates vector art and experiments with AI. | 5 | Red fox and part-time dragon disguised as a software developer. I create vector art and experiment with AI. :drgn_mlem: |