diff options
-rw-r--r-- | src/_declare-vars.scss | 2 | ||||
-rw-r--r-- | src/layouts/_card.scss | 9 | ||||
-rw-r--r-- | tpl/index.pug | 2 | ||||
-rw-r--r-- | tpl/objects/action-menu.pug | 2 | ||||
-rw-r--r-- | tpl/objects/menu.pug | 2 |
5 files changed, 13 insertions, 4 deletions
diff --git a/src/_declare-vars.scss b/src/_declare-vars.scss index 38d39dd..fa6de76 100644 --- a/src/_declare-vars.scss +++ b/src/_declare-vars.scss | |||
@@ -6,7 +6,7 @@ | |||
6 | @include iro.props-store(( | 6 | @include iro.props-store(( |
7 | --dims: ( | 7 | --dims: ( |
8 | --spacing: ( | 8 | --spacing: ( |
9 | --base: iro.fn-px-to-rem(24px), | 9 | --base: iro.fn-px-to-rem(28px), |
10 | --factors: ( | 10 | --factors: ( |
11 | --xxs: .125, | 11 | --xxs: .125, |
12 | --xs: .25, | 12 | --xs: .25, |
diff --git a/src/layouts/_card.scss b/src/layouts/_card.scss index 2ed121f..a0220c3 100644 --- a/src/layouts/_card.scss +++ b/src/layouts/_card.scss | |||
@@ -7,6 +7,10 @@ | |||
7 | --dims: ( | 7 | --dims: ( |
8 | --pad-x: fn.global-dim(--spacing --sm), | 8 | --pad-x: fn.global-dim(--spacing --sm), |
9 | --pad-y: fn.global-dim(--spacing --xs), | 9 | --pad-y: fn.global-dim(--spacing --xs), |
10 | --sm: ( | ||
11 | --pad-x: fn.global-dim(--spacing --xs), | ||
12 | --pad-y: fn.global-dim(--spacing --xxs), | ||
13 | ), | ||
10 | --lg: ( | 14 | --lg: ( |
11 | --pad-x: fn.global-dim(--spacing --md), | 15 | --pad-x: fn.global-dim(--spacing --md), |
12 | --pad-y: fn.global-dim(--spacing --sm), | 16 | --pad-y: fn.global-dim(--spacing --sm), |
@@ -21,6 +25,11 @@ | |||
21 | gap: fn.dim(--pad-x); | 25 | gap: fn.dim(--pad-x); |
22 | line-height: 1.4; | 26 | line-height: 1.4; |
23 | 27 | ||
28 | @include iro.bem-modifier('sm') { | ||
29 | padding: fn.dim(--sm --pad-y) fn.dim(--sm --pad-x); | ||
30 | gap: fn.dim(--sm --pad-x); | ||
31 | } | ||
32 | |||
24 | @include iro.bem-modifier('lg') { | 33 | @include iro.bem-modifier('lg') { |
25 | padding: fn.dim(--lg --pad-y) fn.dim(--lg --pad-x); | 34 | padding: fn.dim(--lg --pad-y) fn.dim(--lg --pad-x); |
26 | gap: fn.dim(--lg --pad-x); | 35 | gap: fn.dim(--lg --pad-x); |
diff --git a/tpl/index.pug b/tpl/index.pug index d8984ce..c42c48f 100644 --- a/tpl/index.pug +++ b/tpl/index.pug | |||
@@ -28,7 +28,7 @@ mixin user-card(name, hue) | |||
28 | - | 28 | - |
29 | const avaName = name.slice(0, 1) | 29 | const avaName = name.slice(0, 1) |
30 | 30 | ||
31 | .l-card.l-card--flush | 31 | .l-card.l-card--flush.l-card--sm |
32 | +avatar(block=true size='xs' class='l-card__block' hue=hue) | 32 | +avatar(block=true size='xs' class='l-card__block' hue=hue) |
33 | = avaName | 33 | = avaName |
34 | = name | 34 | = name |
diff --git a/tpl/objects/action-menu.pug b/tpl/objects/action-menu.pug index 751e29d..dbfc99d 100644 --- a/tpl/objects/action-menu.pug +++ b/tpl/objects/action-menu.pug | |||
@@ -7,7 +7,7 @@ mixin action-menu | |||
7 | 7 | ||
8 | mixin action-menu-item | 8 | mixin action-menu-item |
9 | button.o-action-menu__item(disabled=attributes.disabled) | 9 | button.o-action-menu__item(disabled=attributes.disabled) |
10 | .l-card.l-card--flush | 10 | .l-card.l-card--flush.l-card--sm |
11 | .l-card__block.o-action-menu__icon-slot | 11 | .l-card__block.o-action-menu__icon-slot |
12 | if attributes.icon | 12 | if attributes.icon |
13 | if attributes.iconIsStatus | 13 | if attributes.iconIsStatus |
diff --git a/tpl/objects/menu.pug b/tpl/objects/menu.pug index 97a571d..b348df8 100644 --- a/tpl/objects/menu.pug +++ b/tpl/objects/menu.pug | |||
@@ -14,7 +14,7 @@ mixin menu-item | |||
14 | } | 14 | } |
15 | 15 | ||
16 | button(class=classes, disabled=attributes.disabled) | 16 | button(class=classes, disabled=attributes.disabled) |
17 | .l-card.l-card--flush | 17 | .l-card.l-card--flush.l-card--sm |
18 | if attributes.icon | 18 | if attributes.icon |
19 | .l-card__block.o-menu__icon-slot | 19 | .l-card__block.o-menu__icon-slot |
20 | if attributes.iconIsStatus | 20 | if attributes.iconIsStatus |