summaryrefslogtreecommitdiffstats
path: root/src/layouts/_bubble-group.scss
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2022-03-28 09:00:40 +0200
committerVolpeon <git@volpeon.ink>2022-03-28 09:00:40 +0200
commit120ad0cdc11143fb6f184bcbca332dbf8a2114e8 (patch)
treeb25fbe77ac51d99d20e09be6308af718df5d174f /src/layouts/_bubble-group.scss
parentImproved bubbles (diff)
downloadiro-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.scss13
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') {