diff options
author | Volpeon <git@volpeon.ink> | 2022-03-28 09:00:40 +0200 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2022-03-28 09:00:40 +0200 |
commit | 120ad0cdc11143fb6f184bcbca332dbf8a2114e8 (patch) | |
tree | b25fbe77ac51d99d20e09be6308af718df5d174f /src/layouts/_bubble-group.scss | |
parent | Improved bubbles (diff) | |
download | iro-design-120ad0cdc11143fb6f184bcbca332dbf8a2114e8.tar.gz iro-design-120ad0cdc11143fb6f184bcbca332dbf8a2114e8.tar.bz2 iro-design-120ad0cdc11143fb6f184bcbca332dbf8a2114e8.zip |
Improved bubble
Diffstat (limited to 'src/layouts/_bubble-group.scss')
-rw-r--r-- | src/layouts/_bubble-group.scss | 13 |
1 files changed, 8 insertions, 5 deletions
diff --git a/src/layouts/_bubble-group.scss b/src/layouts/_bubble-group.scss index 7593881..3e280b5 100644 --- a/src/layouts/_bubble-group.scss +++ b/src/layouts/_bubble-group.scss | |||
@@ -5,7 +5,12 @@ | |||
5 | @include iro.props-store(( | 5 | @include iro.props-store(( |
6 | --dims: ( | 6 | --dims: ( |
7 | --spacing-x: fn.global-dim(--size --225), | 7 | --spacing-x: fn.global-dim(--size --225), |
8 | --spacing-y: fn.global-dim(--size --50), | 8 | --spacing-y: fn.global-dim(--size --150), |
9 | |||
10 | --compact: ( | ||
11 | --spacing-x: fn.global-dim(--size --225), | ||
12 | --spacing-y: fn.global-dim(--size --50), | ||
13 | ) | ||
9 | ) | 14 | ) |
10 | ), 'dims'); | 15 | ), 'dims'); |
11 | 16 | ||
@@ -18,10 +23,7 @@ | |||
18 | gap: fn.dim(--spacing-y) fn.dim(--spacing-x); | 23 | gap: fn.dim(--spacing-y) fn.dim(--spacing-x); |
19 | 24 | ||
20 | @include iro.bem-elem('avatar') { | 25 | @include iro.bem-elem('avatar') { |
21 | grid-area: avatar; | 26 | grid-area: avatar; |
22 | position: sticky; | ||
23 | top: 0; | ||
24 | justify-self: end; | ||
25 | } | 27 | } |
26 | 28 | ||
27 | @include iro.bem-elem('bubble') { | 29 | @include iro.bem-elem('bubble') { |
@@ -30,6 +32,7 @@ | |||
30 | 32 | ||
31 | @include iro.bem-modifier('compact') { | 33 | @include iro.bem-modifier('compact') { |
32 | justify-items: start; | 34 | justify-items: start; |
35 | gap: fn.dim(--compact --spacing-y) fn.dim(--compact --spacing-x); | ||
33 | } | 36 | } |
34 | 37 | ||
35 | @include iro.bem-modifier('arrow') { | 38 | @include iro.bem-modifier('arrow') { |