From 2ef14e9319df7365a42192b4479ad1facb193a2e Mon Sep 17 00:00:00 2001 From: Volpeon Date: Fri, 25 Oct 2024 14:47:14 +0200 Subject: Fix again --- src/layouts/_split-view.scss | 68 +++++++++++++++++++++++--------------------- 1 file changed, 36 insertions(+), 32 deletions(-) diff --git a/src/layouts/_split-view.scss b/src/layouts/_split-view.scss index eac739f..2bc35bc 100644 --- a/src/layouts/_split-view.scss +++ b/src/layouts/_split-view.scss @@ -7,47 +7,51 @@ @forward 'split-view.vars'; @use 'split-view.vars' as vars; -@include bem.layout('split-view') { - display: flex; - gap: props.get(vars.$col-gap); - align-items: start; - - @include bem.elem('panel') { - flex: 1 1 auto; - inline-size: 100%; - min-inline-size: 0; - - @include bem.modifier('side-25') { - flex: 0 0 auto; - inline-size: 25%; - min-inline-size: props.get(vars.$panel--side-25--min); - } +@mixin styles { + @include materialize-at-root(meta.module-variables('vars')); - @include bem.modifier('sticky') { - position: sticky; - inset-block-start: props.get(vars.$panel--sticky--inset); - } - } - - @include bem.elem('content') { - inline-size: 100%; - } - - @include media.media('<=md') { - flex-direction: column; - gap: props.get(vars.$row-gap); - align-items: stretch; + @include bem.layout('split-view') { + display: flex; + gap: props.get(vars.$col-gap); + align-items: start; @include bem.elem('panel') { flex: 1 1 auto; + inline-size: 100%; + min-inline-size: 0; @include bem.modifier('side-25') { - inline-size: auto; - min-inline-size: 0; + flex: 0 0 auto; + inline-size: 25%; + min-inline-size: props.get(vars.$panel--side-25--min); } @include bem.modifier('sticky') { - position: static; + position: sticky; + inset-block-start: props.get(vars.$panel--sticky--inset); + } + } + + @include bem.elem('content') { + inline-size: 100%; + } + + @include media.media('<=md') { + flex-direction: column; + gap: props.get(vars.$row-gap); + align-items: stretch; + + @include bem.elem('panel') { + flex: 1 1 auto; + + @include bem.modifier('side-25') { + inline-size: auto; + min-inline-size: 0; + } + + @include bem.modifier('sticky') { + position: static; + } } } } -- cgit v1.2.3-70-g09d2