From 365c56edcc36b5b92902bac01ce44b43d01e8685 Mon Sep 17 00:00:00 2001 From: Volpeon Date: Fri, 18 Oct 2024 18:08:24 +0200 Subject: Refactoring --- src/layouts/_media.scss | 40 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 40 insertions(+) create mode 100644 src/layouts/_media.scss (limited to 'src/layouts/_media.scss') diff --git a/src/layouts/_media.scss b/src/layouts/_media.scss new file mode 100644 index 0000000..7483f12 --- /dev/null +++ b/src/layouts/_media.scss @@ -0,0 +1,40 @@ +@use 'sass:meta'; +@use 'iro-sass/src/iro-sass' as iro; +@use '../props'; + +@forward 'media.vars'; +@use 'media.vars' as vars; + +@mixin styles { + @include props.materialize(meta.module-variables('vars')); + + @include iro.bem-layout('media') { + display: flex; + gap: props.get(vars.$gap); + align-items: center; + line-height: 1.4; + + @each $mod, $size in vars.$sizes { + @include iro.bem-modifier($mod) { + gap: props.get($size); + } + } + + @include iro.bem-modifier('wrap') { + flex-wrap: wrap; + } + + @include iro.bem-elem('block') { + flex: 0 0 auto; + + @include iro.bem-modifier('shrink', 'main') { + flex-shrink: 1; + min-inline-size: 0; + } + + @include iro.bem-modifier('main') { + inline-size: 100%; + } + } + } +} -- cgit v1.2.3-70-g09d2