summaryrefslogtreecommitdiffstats
path: root/src/layouts
diff options
context:
space:
mode:
Diffstat (limited to 'src/layouts')
-rw-r--r--src/layouts/_bubble-group.scss13
-rw-r--r--src/layouts/_card.scss3
2 files changed, 11 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') {
diff --git a/src/layouts/_card.scss b/src/layouts/_card.scss
index e6c379d..9e54d50 100644
--- a/src/layouts/_card.scss
+++ b/src/layouts/_card.scss
@@ -7,14 +7,17 @@
7 --dims: ( 7 --dims: (
8 --pad-x: fn.global-dim(--size --150), 8 --pad-x: fn.global-dim(--size --150),
9 --pad-y: fn.global-dim(--size --85), 9 --pad-y: fn.global-dim(--size --85),
10
10 --75: ( 11 --75: (
11 --pad-x: fn.global-dim(--size --100), 12 --pad-x: fn.global-dim(--size --100),
12 --pad-y: fn.global-dim(--size --50), 13 --pad-y: fn.global-dim(--size --50),
13 ), 14 ),
15
14 --200: ( 16 --200: (
15 --pad-x: fn.global-dim(--size --300), 17 --pad-x: fn.global-dim(--size --300),
16 --pad-y: fn.global-dim(--size --150), 18 --pad-y: fn.global-dim(--size --150),
17 ), 19 ),
20
18 --300: ( 21 --300: (
19 --pad-x: fn.global-dim(--size --450), 22 --pad-x: fn.global-dim(--size --450),
20 --pad-y: fn.global-dim(--size --225), 23 --pad-y: fn.global-dim(--size --225),