diff options
Diffstat (limited to 'src/layouts')
-rw-r--r-- | src/layouts/_bubble-group.scss | 13 | ||||
-rw-r--r-- | src/layouts/_card.scss | 3 |
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), |