diff options
author | Volpeon <git@volpeon.ink> | 2024-10-26 16:10:35 +0200 |
---|---|---|
committer | Volpeon <git@volpeon.ink> | 2024-10-26 16:10:35 +0200 |
commit | d946b22facd7e3be10ade14a5be19099c9932c4c (patch) | |
tree | a538a85424b05fc9be7c7bacd586e08a9afd5c7e | |
parent | Lightbox: Make image max height configurable (diff) | |
download | iro-design-d946b22facd7e3be10ade14a5be19099c9932c4c.tar.gz iro-design-d946b22facd7e3be10ade14a5be19099c9932c4c.tar.bz2 iro-design-d946b22facd7e3be10ade14a5be19099c9932c4c.zip |
Add media-view
-rw-r--r-- | src/_iro-design.scss | 1 | ||||
-rw-r--r-- | src/layouts/_media-view.scss | 18 |
2 files changed, 19 insertions, 0 deletions
diff --git a/src/_iro-design.scss b/src/_iro-design.scss index 199b19d..7f726da 100644 --- a/src/_iro-design.scss +++ b/src/_iro-design.scss | |||
@@ -32,6 +32,7 @@ $breakpoints: ( | |||
32 | @forward 'layouts/media' as l-media--*; | 32 | @forward 'layouts/media' as l-media--*; |
33 | @forward 'layouts/overflow' as l-overflow--*; | 33 | @forward 'layouts/overflow' as l-overflow--*; |
34 | @forward 'layouts/split-view' as l-split-view--*; | 34 | @forward 'layouts/split-view' as l-split-view--*; |
35 | @forward 'layouts/media-view' as l-media-view--*; | ||
35 | 36 | ||
36 | @forward 'scopes/implicit' as s-implicit--*; | 37 | @forward 'scopes/implicit' as s-implicit--*; |
37 | @forward 'scopes/blockquotes' as s-blockquotes--*; | 38 | @forward 'scopes/blockquotes' as s-blockquotes--*; |
diff --git a/src/layouts/_media-view.scss b/src/layouts/_media-view.scss new file mode 100644 index 0000000..2c53db6 --- /dev/null +++ b/src/layouts/_media-view.scss | |||
@@ -0,0 +1,18 @@ | |||
1 | @use 'sass:meta'; | ||
2 | @use 'iro-sass/src/bem'; | ||
3 | @use 'iro-sass/src/props'; | ||
4 | @use '../props' as *; | ||
5 | |||
6 | @mixin styles { | ||
7 | @include bem.layout('media-view') { | ||
8 | display: flex; | ||
9 | flex-direction: column; | ||
10 | min-block-size: 100%; | ||
11 | |||
12 | @include bem.elem('footer') { | ||
13 | position: sticky; | ||
14 | inset-block-end: 0; | ||
15 | margin-block-start: auto; | ||
16 | } | ||
17 | } | ||
18 | } | ||