From 2ef14e9319df7365a42192b4479ad1facb193a2e Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
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(-)

(limited to 'src')

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