diff options
| author | Volpeon <git@volpeon.ink> | 2022-06-15 07:15:57 +0200 |
|---|---|---|
| committer | Volpeon <git@volpeon.ink> | 2022-06-15 07:15:57 +0200 |
| commit | 83ae14bbb8dd532f04c4214f762fca57199f4622 (patch) | |
| tree | 149837121bea9b26517c1a1b6f1ef3e0cfd1ac5e /src/layouts | |
| parent | Smaller indent on narrow viewports (diff) | |
| download | iro-design-83ae14bbb8dd532f04c4214f762fca57199f4622.tar.gz iro-design-83ae14bbb8dd532f04c4214f762fca57199f4622.tar.bz2 iro-design-83ae14bbb8dd532f04c4214f762fca57199f4622.zip | |
Narrower container
Diffstat (limited to 'src/layouts')
| -rw-r--r-- | src/layouts/_container.scss | 25 |
1 files changed, 11 insertions, 14 deletions
diff --git a/src/layouts/_container.scss b/src/layouts/_container.scss index 52acfb8..d31a631 100644 --- a/src/layouts/_container.scss +++ b/src/layouts/_container.scss | |||
| @@ -4,10 +4,11 @@ | |||
| 4 | @include iro.props-namespace('container') { | 4 | @include iro.props-namespace('container') { |
| 5 | @include iro.props-store(( | 5 | @include iro.props-store(( |
| 6 | --dims: ( | 6 | --dims: ( |
| 7 | --width: iro.fn-px-to-rem(620px), | 7 | --narrow-125: iro.fn-px-to-rem(800px), |
| 8 | --width-50: iro.fn-px-to-rem(320px), | 8 | --narrow: iro.fn-px-to-rem(600px), |
| 9 | --pad-x: fn.global-dim(--size --400), | 9 | --narrow-75: iro.fn-px-to-rem(400px), |
| 10 | --pad-y: fn.global-dim(--size --800), | 10 | --pad-x: fn.global-dim(--size --400), |
| 11 | --pad-y: fn.global-dim(--size --800), | ||
| 11 | ) | 12 | ) |
| 12 | ), 'dims'); | 13 | ), 'dims'); |
| 13 | 14 | ||
| @@ -19,16 +20,12 @@ | |||
| 19 | ), 'sm'); | 20 | ), 'sm'); |
| 20 | 21 | ||
| 21 | @include iro.bem-layout(iro.props-namespace()) { | 22 | @include iro.bem-layout(iro.props-namespace()) { |
| 22 | @include iro.bem-modifier('narrow') { | 23 | @each $size in 'narrow-125' 'narrow' 'narrow-75' { |
| 23 | max-width: fn.dim(--width); | 24 | @include iro.bem-modifier($size) { |
| 24 | margin-right: auto; | 25 | max-width: fn.dim(--#{$size}); |
| 25 | margin-left: auto; | 26 | margin-right: auto; |
| 26 | } | 27 | margin-left: auto; |
| 27 | 28 | } | |
| 28 | @include iro.bem-modifier('narrow-50') { | ||
| 29 | max-width: fn.dim(--width-50); | ||
| 30 | margin-right: auto; | ||
| 31 | margin-left: auto; | ||
| 32 | } | 29 | } |
| 33 | 30 | ||
| 34 | @include iro.bem-modifier('pad-x') { | 31 | @include iro.bem-modifier('pad-x') { |